طراحی صفحات
این داکیومنت توضیح میدهد که چگونه المانها را در صفحات قابل طراحی مدیریت کنید؛ صفحاتی مثل: EBook، Form، Main، Profile، Listing، Wizard و Text.
در این راهنما یاد میگیرید که چگونه المانها را ایجاد، ویرایش، ویرایش سریع، دوتا کردن، جابهجایی و حذف کنید.
با دنبال کردن این بخش، کل روند طراحی در Applin Studio را کامل یاد میگیرید.
صفحات زیر از المانهای UI و طراحی مبتنی بر المان پشتیبانی میکنند:
EBook، Form، Listing، Main، Profile، Term، Text، Wizard
افزودن یک المان
وقتی داخل یکی از صفحات پشتیبانیشده باشید، اضافه کردن المان جدید بسیار ساده است.
کافی است روی Add Element کلیک کنید — یا روی یک المان موجود بزنید و گزینهٔ Add Element را انتخاب کنید.
حالا المانی که میخواهید در صفحه قرار دهید را انتخاب کنید.
برای مثال، اینجا یک المان Button انتخاب میکنیم:
و به همین راحتی، المان داخل صفحه قرار میگیرد.
بیایید ادامه دهیم و آن را سفارشیسازی کنیم.
کلیک روی یک المان
برای کار با هر المان، تنها کافی است روی آن کلیک کنید.
پس از انتخاب المان، مجموعهای از گزینههای سریع برایتان ظاهر میشود که به شما امکان میدهد:
- Edit – ویرایش کامل المان
- Edit (fast) – ویرایش سریع و درجا
- Move Up / Move Down – جابهجایی بالا یا پایین
- Duplicate – دوتا کردن المان
- Delete – حذف المان
این ابزارها باعث میشوند مدیریت محتوا و ساختار صفحه دقیقاً همانطور باشد که میخواهید.
ویرایش یک المان
هر المان یک ادیتور اختصاصی دارد که تمام فیلدها و تنظیمات آن را نمایش میدهد.
شما میتوانید هر فیلد را تغییر دهید و تغییرات بلافاصله و زنده ذخیره میشوند.
برای مثال، اینجا متن Button را تغییر میدهیم:
بعد رنگ آن را عوض میکنیم:
و بلافاصله نتیجه در پیشنمایش دیده میشود:
ویرایش سریع (Edit Fast)
اگر میخواهید سریعتر به فیلدهای ضروری دسترسی پیدا کنید، کافی است روی Edit Element (Fast) کلیک کنید.
این گزینه سریعترین راه برای تغییر تنظیمات اصلی یک المان است، بدون نیاز به باز کردن ادیتور کامل.
بعد از انتخاب Edit Element (Fast) میتوانید المان را با سرعت بسیار بیشتری ویرایش کنید.
این گزینه زمانی عالی است که میخواهید یک سری اصلاحات کوچک انجام دهید یا چندین المان را پشتسرهم ریز تغییر دهید.
جابهجایی المانها (Reordering)
با استفاده از دکمههای Up و Down میتوانید جای یک المان را نسبت به سایر المانها تغییر دهید:
این قابلیت کمک میکند چینش صفحه را دقیقاً همانطور که دوست دارید تنظیم کنید.
دوتا کردن یک المان (Duplicate)
با گزینهٔ Duplicate میتوانید یک کپی کامل از المان انتخابشده بسازید:
این ویژگی زمانی عالی است که میخواهید اجزای مشابه را سریع و پشتسرهم ایجاد کنید.
حذف یک المان
برای حذف یک المان کافی است روی Delete کلیک کنید:
این کار فوری و بدون مراحل اضافی انجام میشود.
انواع المانهای قابل استفاده
در ادامه فهرست کاملی از المانهایی قرار دارد که میتوانید در صفحه درج و سفارشیسازی کنید.
برای مشاهده فیلدها و تنظیمات هر المان، روی لینک مربوطه کلیک کنید:
-
Box
یک ظرف (Container) برای گروهبندی و نگهداشتن سایر المانها. -
Br
یک خط جدید یا فاصله عمودی اضافه میکند. -
Button
یک دکمه قابل کلیک که یک اکشن یا جابهجایی انجام میدهد. -
CheckBox
گزینه چندانتخابی که کاربر میتواند آن را روشن یا خاموش کند. -
Code
نمایش کد با رنگبندی و برجستهسازی. -
Column
چیدمان عمودی برای قرار دادن المانها در یک ستون. -
Headings
عنوان یا زیرعنوان با اندازههای مختلف (H1 تا H6). -
Hr
یک خط افقی برای جدا کردن بخشها. -
Icon
نمایش یک آیکون از کتابخانه آیکونهای اپلین. -
Input
یک فیلد متنی برای وارد کردن نوشته توسط کاربر. -
Item
یک آیتم لیستی، معمولاً مناسب برای منوها یا لیستها. -
Li
یک آیتم ساده گلولهای (Bullet). -
Listing
یک چیدمان ساختاریافته چندآیتمی (مثل کارتها یا ردیفها). -
Loading
یک انیمیشن یا آیکون بارگذاری. -
Logo
نمایش لوگوی اپلیکیشن یا لوگوی آپلودشده. -
P
متن استاندارد پاراگراف. -
Page
یک لینک برای رفتن به صفحهای دیگر در اپلیکیشن. -
Photo
نمایش تصویر. -
Progress
نوار پیشرفت برای نمایش میزان تکمیل یک فرآیند. -
Quote
بلوک نقلقول با استایل ویژه. -
Radio
گزینه تکانتخابی در یک گروه. -
Row
چیدمان افقی برای قرار دادن المانها در یک ردیف. -
Select
یک منوی کشویی (Dropdown) برای انتخاب یک گزینه. -
Slider
یک اسلایدر تصاویر. -
Switch
یک کلید روشن/خاموش. -
Tag
یک برچسب یا تگ رنگی. -
Term
نمایش متنهای قانونی همراه با گزینه پذیرش (در صورت نیاز). -
Upload
امکان آپلود فایل یا تصویر توسط کاربر. -
Video
نمایش پخشکننده ویدیو. -
Web
قرار دادن محتوای وب خارجی در داخل صفحه.