پرش به مطلب اصلی

ویجت دکمه

ویجت دکمه برای انجام یک کار با لمس کاربر استفاده می‌شود؛ مثل رفتن به صفحه دیگر، باز کردن لینک، ارسال فرم یا اجرای یک عملکرد.


کاربردها

  • اجرای یک کار با لمس کاربر، مثل باز کردن صفحه یا ارسال فرم
  • ساخت دکمه‌های اصلی مثل ورود، ثبت‌نام، خرید یا ادامه
  • استفاده به‌عنوان فراخوان اقدام در بخش‌های مختلف برنامه
یادداشت

قبل از انتشار برنامه، نمایش این ویجت را در اندازه‌های مختلف صفحه بررسی کنید.

فرم تنظیمات ویجت دکمه
فرم تنظیمات ویجت «دکمه» در پنل اپ‌ادیتور.

تنظیمات اصلی

عنوان دکمه

عنوان، متنی است که کاربر روی دکمه می‌بیند. این متن باید به‌روشنی بگوید با لمس دکمه چه اتفاقی می‌افتد.

گزینه‌ها

  • متن عنوان: متن روی دکمه؛ مثل «ورود»، «ثبت‌نام»، «خرید»، «ارسال فرم»، «مشاهده جزئیات» یا «تماس با ما». در عنوان دکمه می‌توانید از متغیرهای داینامیک هم استفاده کنید؛ برای این کار، نام متغیر را داخل دو آکولاد قرار دهید؛ مثل {{myvar}}. مقدار متغیر هنگام اجرای اپلیکیشن جایگزین می‌شود.
  • اندازه نوشته: مشخص می‌کند متن دکمه کوچک‌تر یا بزرگ‌تر دیده شود.
  • فونت: ظاهر نوشته دکمه را تغییر می‌دهد.
  • رنگ متن: رنگ نوشته را مشخص می‌کند. بهتر است با رنگ پس‌زمینه تضاد کافی داشته باشد تا خوانا باشد.
  • بولد و کج: برای تأکید بیشتر روی متن دکمه استفاده می‌شود.
  • تراز متن: مشخص می‌کند نوشته در سمت شروع، وسط، سمت پایان یا دوطرف قرار بگیرد.
  • جهت متن: برای متن‌های فارسی، انگلیسی یا ترکیبی کمک می‌کند نوشته درست و خوانا نمایش داده شود.
  • فاصله بین خطوط: اگر عنوان دکمه در چند خط نمایش داده شود، فاصله بین خط‌ها را تنظیم می‌کند.
نکته

عنوان دکمه را کوتاه، روشن و عملی بنویسید. کاربر باید فقط با دیدن متن، هدف دکمه را بفهمد.


آیکون دکمه

آیکون یک تصویر کوچک است که می‌تواند کنار عنوان، بالا یا پایین آن نمایش داده شود.

گزینه‌ها

  • آیکون: تصویر یا نشانه‌ای برای دکمه
  • سایز آیکون: اندازه آیکون را مشخص می‌کند؛ مانند 16×16، 24×24، 32×32، 48×48، 64×64 و 96×96
یادداشت

اگر دکمه فقط آیکون دارد و متن ندارد، بهتر است آیکون کاملاً گویا و آشنا باشد.


موقعیت آیکون

این گزینه مشخص می‌کند آیکون نسبت به متن دکمه کجا قرار بگیرد:

  • بالا
  • پایین
  • ابتدا
  • انتها

تراز افقی

تراز افقی مشخص می‌کند محتوای داخل دکمه چگونه در عرض دکمه چیده شود.

گزینه‌ها

  • وابسته به تراز متن
  • وسط
یادداشت

وقتی آیکون در بالا یا پایین متن باشد، تراز افقی به‌صورت خودکار محدود می‌شود.


ثابت ماندن اندازه متن

  • ثابت ماندن اندازه متن با تغییر اندازه متن در تنظیمات برنامه: اگر این گزینه فعال باشد، اندازه متن دکمه مستقل از تنظیمات کلی برنامه ثابت می‌ماند.

عملکرد دکمه

دکمه فقط ظاهر نیست؛ معمولاً با لمس آن باید یک کار انجام شود.

نمونه عملکردها

  • باز کردن یک صفحه دیگر
  • باز کردن لینک سایت یا شبکه اجتماعی
  • ارسال فرم
  • شروع خرید یا پرداخت
  • تماس، پیامک یا ایمیل
  • نمایش پیام به کاربر
  • اجرای چند کار پشت سر هم

نکات طراحی و تست

  • جایگاه دکمه باید با اهمیت آن در صفحه هماهنگ باشد.
  • عنوان، متن و فاصله‌گذاری باید در موبایل کاملاً خوانا باشد.
  • قبل از انتشار، حتماً ظاهر دکمه را در اندازه‌های مختلف صفحه تست کنید.