صفحات Form برای ارائه فرمهای تعاملی طراحی شدهاند که دادههای کاربر را از طریق عناصر مختلف مانند فیلدهای متنی، چکباکسها، رادیو باتنها و آپلود فایل جمعآوری میکنند. این ساختار، ورود دادهها را ساده و کارآمد میکند و اطمینان میدهد که کاربران بتوانند اطلاعات خود را به راحتی درون برنامه ارسال کنند.
این بخش رفتار اصلی یک صفحه Form را تعریف میکند: نوع، نام، رنگ و کاور را مشخص میکند، ناوبری را با مسیرها (Routes)، صفحه بعدی (NextPage) و Timeout کنترل میکند، مشخص میکند که آیا صفحه آخرین مرحله است یا خیر، گزینههای نمایش مثل تمامصفحه (Fullscreen)، حالت افقی (Landscape) و امکان گرفتن اسکرینشات را مدیریت میکند و چیدمان و جهت متن را تعیین میکند.
| فیلد | نوع | مقدار پیشفرض | توضیحات |
|---|---|---|---|
| @Type | PageType | "Form" | نوع صفحه را به عنوان صفحه فرم مشخص میکند |
| Name | PageName | {name} | نام یا عنوان صفحه |
| Color | Color | {color} | رنگ پسزمینه صفحه |
| Cover | URL | {cover} | تصویر کاور اختیاری برای صفحه |
| Routes | Array |
[] | لیست اسکریپتها یا اقدامات مرتبط با این صفحه |
| NextPage | Page | 0 | شناسه صفحه بعدی برای ناوبری |
| Timeout | Page | 0 | مدت زمان به ثانیه قبل از ناوبری خودکار |
| Finish | Boolean | false | مشخص میکند که آیا این صفحه پایان یک توالی است یا خیر |
| FullScreen | Boolean | false | تعیین میکند که صفحه در حالت تمامصفحه نمایش داده شود |
| CanLandScape | Boolean | false | اجازه جهت افقی اگر true |
| CanScreenShot | Boolean | false | اجازه گرفتن اسکرینشات توسط کاربر اگر true |
| Dir | Direction | {dir} | جهت چیدمان صفحه (ltr یا rtl) |
| Dir.Text | TextDirection | {dir} | جهت متن محتوای صفحه |
نمونه کدنویسی:
{
"@Type": "Form",
"Name": "{name}",
"Color": "{color}",
"Cover": "{cover}",
"Routes": [],
"NextPage": 0,
"Timeout": 0,
"Finish": false,
"FullScreen": false,
"CanLandScape": false,
"CanScreenShot": false,
"Dir": "{dir}",
"Dir.Text": "{dir}"
}این بخش تنظیمات نوار عنوان صفحه را مدیریت میکند: امکان نمایش یا مخفی کردن، تعیین رنگ پسزمینه، تعریف متن عنوان با اندازه، رنگ و سبک، اتصال به صفحه منو و تعیین آیکونهای بازگشت و منو را فراهم میکند.
| فیلد | نوع | مقدار پیشفرض | توضیحات |
|---|---|---|---|
| Title.Show | Boolean | true | نمایش یا مخفی کردن نوار عنوان |
| Title.Color | Color | {titleColor} | رنگ پسزمینه نوار عنوان |
| Title.Text | String | {titleText} | متن عنوان نمایش داده شده در بالا |
| Title.Text.Size | Number | 16 | اندازه فونت متن عنوان |
| Title.Text.Color | Color | {titleTextColor} | رنگ متن عنوان |
| Title.Text.Style | TextStyle | {titleTextStyle} | سبک فونت (bold, italic و غیره) |
| Title.Menu | PageName | {pageName} | نام صفحه منو برای باز شدن از عنوان |
| Title.Back.Logo | Logo | {backLogo} | آیکون دکمه بازگشت |
| Title.Menu.Logo | Logo | {menuLogo} | آیکون دکمه منو |
نمونه کدنویسی:
{
"@Type": "Form",
"Title.Show": true,
"Title.Color": "{titleColor}",
"Title.Text": "{titleText}",
"Title.Text.Size": 16,
"Title.Text.Color": "{titleTextColor}",
"Title.Text.Style": "{titleTextStyle}",
"Title.Menu": "{pageName}",
"Title.Back.Logo": "{backLogo}",
"Title.Menu.Logo": "{menuLogo}"
}این بخش عناصر UI صفحه را تعریف میکند: یک آرایه از کامپوننتها است که در صفحه نمایش داده میشوند و امکان ساختاردهی و نمایش محتوای تعاملی صفحه را فراهم میکند.
| فیلد | نوع | مقدار پیشفرض | توضیحات |
|---|---|---|---|
| Elements | Array |
[] | لیستی از عناصر UI که در صفحه رندر میشوند |
نمونه کدنویسی:
{
"@Type": "Form",
"Elements": [
]
}برای مشاهدهٔ نحوهٔ ایجاد این صفحه در اپلیکیشن ساز اپلین (حالت بدون کدنویسی)، به لینک زیر مراجعه کنید:
طراحی صفحهٔ فرم در اپلین استودیو