انتخابگرها را به برنامه خود اضافه کنید

روش نوشتن را امتحان کنید
Jetpack Compose ابزار رابط کاربری پیشنهادی برای اندروید است. یاد بگیرید که چگونه کامپوننت‌ها را در Compose اضافه کنید.

اندروید کنترل‌هایی را برای کاربر فراهم می‌کند تا زمان یا تاریخ را به صورت دیالوگ‌های آماده برای استفاده انتخاب کند. این انتخابگرها کنترل‌هایی را برای انتخاب هر بخش از زمان (ساعت، دقیقه، صبح/بعد از ظهر) یا تاریخ (ماه، روز، سال) ارائه می‌دهند.

نمونه‌ای از انتخابگر زمان از material.io
شکل ۱. انتخاب ساعت در انتخابگر تقویم موبایل.

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

مثالی از انتخابگر تاریخ مودال از material.io
شکل ۲. انتخابگر تاریخ مودال.

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

ایجاد یک انتخابگر زمان

برای نمایش یک TimePickerDialog با استفاده از DialogFragment ، یک کلاس fragment تعریف کنید که DialogFragment ارث بری کند و یک TimePickerDialog از متد onCreateDialog() مربوط به fragment برگرداند.

گسترش DialogFragment برای انتخابگر زمان

برای تعریف یک DialogFragment برای TimePickerDialog ، مراحل زیر را دنبال کنید:

  • متد onCreateDialog() را برای بازگرداندن یک نمونه از TimePickerDialog تعریف کنید.
  • رابط TimePickerDialog.OnTimeSetListener را طوری پیاده‌سازی کنید که وقتی کاربر زمان را تنظیم می‌کند، یک فراخوانی مجدد دریافت کند.

در اینجا یک مثال آورده شده است:

کاتلین

class TimePickerFragment : DialogFragment(), TimePickerDialog.OnTimeSetListener {

    override fun onCreateDialog(savedInstanceState: Bundle): Dialog {
        // Use the current time as the default values for the picker.
        val c = Calendar.getInstance()
        val hour = c.get(Calendar.HOUR_OF_DAY)
        val minute = c.get(Calendar.MINUTE)

        // Create a new instance of TimePickerDialog and return it.
        return TimePickerDialog(activity, this, hour, minute, DateFormat.is24HourFormat(activity))
    }

    override fun onTimeSet(view: TimePicker, hourOfDay: Int, minute: Int) {
        // Do something with the time the user picks.
    }
}

جاوا

public static class TimePickerFragment extends DialogFragment
                            implements TimePickerDialog.OnTimeSetListener {

    @Override
    public Dialog onCreateDialog(Bundle savedInstanceState) {
        // Use the current time as the default values for the picker.
        final Calendar c = Calendar.getInstance();
        int hour = c.get(Calendar.HOUR_OF_DAY);
        int minute = c.get(Calendar.MINUTE);

        // Create a new instance of TimePickerDialog and return it.
        return new TimePickerDialog(getActivity(), this, hour, minute,
                DateFormat.is24HourFormat(getActivity()));
    }

    public void onTimeSet(TimePicker view, int hourOfDay, int minute) {
        // Do something with the time the user picks.
    }
}

برای اطلاعات بیشتر در مورد آرگومان‌های سازنده، به کلاس TimePickerDialog مراجعه کنید.

حالا شما فقط به یک رویداد نیاز دارید که یک نمونه از این قطعه کد را به اکتیویتی شما اضافه کند.

نمایش انتخابگر زمان

بعد از اینکه یک DialogFragment مانند مثال قبل تعریف کردید، می‌توانید با ایجاد یک نمونه از DialogFragment و فراخوانی متد show() زمان انتخابگر را نمایش دهید.

برای مثال، در اینجا دکمه‌ای را مشاهده می‌کنید که وقتی روی آن ضربه زده می‌شود، متدی را برای نمایش کادر محاوره‌ای فراخوانی می‌کند:

<Button
    android:id="@+id/pickTime"
    android:layout_width="wrap_content"
    android:layout_height="wrap_content"
    android:text="Pick time" />

وقتی کاربر این دکمه را لمس می‌کند، سیستم متد زیر را فراخوانی می‌کند:

کاتلین

findViewById<Button>(R.id.pickTime).setOnClickListener {
    TimePickerFragment().show(supportFragmentManager, "timePicker")
}

جاوا

findViewById<Button>(R.id.pickTime).setOnClickListener {
    TimePickerFragment().show(supportFragmentManager, "timePicker");
}

این متد، تابع show() را روی یک نمونه جدید از DialogFragment که در مثال قبلی تعریف شده است، فراخوانی می‌کند. متد show() به یک نمونه از FragmentManager و یک نام تگ منحصر به فرد برای قطعه کد نیاز دارد.

ایجاد یک انتخابگر تاریخ

ایجاد یک DatePickerDialog مانند ایجاد یک TimePickerDialog است. تفاوت در دیالوگی است که برای فرگمنت ایجاد می‌کنید.

برای نمایش یک DatePickerDialog با استفاده از DialogFragment ، یک کلاس fragment تعریف کنید که از DialogFragment ارث‌بری کند و یک DatePickerDialog از متد onCreateDialog() مربوط به fragment برگرداند.

گسترش DialogFragment برای یک انتخابگر تاریخ

برای تعریف یک DialogFragment برای DatePickerDialog ، مراحل زیر را دنبال کنید:

  • متد onCreateDialog() را برای برگرداندن یک نمونه از DatePickerDialog تعریف کنید.
  • رابط DatePickerDialog.OnDateSetListener را طوری پیاده‌سازی کنید که وقتی کاربر تاریخ را تنظیم می‌کند، یک فراخوانی مجدد دریافت کند.

در اینجا یک مثال آورده شده است:

کاتلین

class DatePickerFragment : DialogFragment(), DatePickerDialog.OnDateSetListener {

    override fun onCreateDialog(savedInstanceState: Bundle): Dialog {
        // Use the current date as the default date in the picker.
        val c = Calendar.getInstance()
        val year = c.get(Calendar.YEAR)
        val month = c.get(Calendar.MONTH)
        val day = c.get(Calendar.DAY_OF_MONTH)

        // Create a new instance of DatePickerDialog and return it.
        return DatePickerDialog(requireContext(), this, year, month, day)

    }

    override fun onDateSet(view: DatePicker, year: Int, month: Int, day: Int) {
        // Do something with the date the user picks.
    }
}

جاوا

public static class DatePickerFragment extends DialogFragment
                            implements DatePickerDialog.OnDateSetListener {

    @Override
    public Dialog onCreateDialog(Bundle savedInstanceState) {
        // Use the current date as the default date in the picker.
        final Calendar c = Calendar.getInstance();
        int year = c.get(Calendar.YEAR);
        int month = c.get(Calendar.MONTH);
        int day = c.get(Calendar.DAY_OF_MONTH);

        // Create a new instance of DatePickerDialog and return it.
        return new DatePickerDialog(requireContext(), this, year, month, day);
    }

    public void onDateSet(DatePicker view, int year, int month, int day) {
        // Do something with the date the user picks.
    }
}

برای اطلاعات بیشتر در مورد آرگومان‌های سازنده، به کلاس DatePickerDialog مراجعه کنید.

شما فقط به یک رویداد نیاز دارید که نمونه‌ای از این قطعه کد را به اکتیویتی شما اضافه کند.

نمایش انتخابگر تاریخ

بعد از اینکه مانند مثال قبل یک DialogFragment تعریف کردید، می‌توانید با ایجاد یک نمونه از DialogFragment و فراخوانی show() date picker را نمایش دهید.

برای مثال، در اینجا دکمه‌ای را مشاهده می‌کنید که وقتی روی آن ضربه زده می‌شود، متدی را برای نمایش کادر محاوره‌ای فراخوانی می‌کند:

<Button
    android:id="@+id/pickDate"
    android:layout_width="wrap_content"
    android:layout_height="wrap_content"
    android:text="Pick date"/>

وقتی کاربر این دکمه را لمس می‌کند، سیستم متد زیر را فراخوانی می‌کند:

کاتلین

findViewById<Button>(R.id.pickDate).setOnClickListener {
    val newFragment = DatePickerFragment()
    newFragment.show(supportFragmentManager, "datePicker")
}

جاوا

findViewById<Button>(R.id.pickDate).setOnClickListener {
    val newFragment = DatePickerFragment();
    newFragment.show(supportFragmentManager, "datePicker");
}

این متد، تابع show() را روی یک نمونه جدید از DialogFragment که در مثال قبلی تعریف شده است، فراخوانی می‌کند. متد show() به یک نمونه از FragmentManager و یک نام تگ منحصر به فرد برای قطعه کد نیاز دارد.

از انتخابگرهایی با قابلیت تکمیل خودکار استفاده کنید

در سال ۲۰۱۷، اندروید چارچوب Autofill را معرفی کرد که به کاربران امکان می‌دهد داده‌هایی را ذخیره کنند که می‌توانند برای پر کردن فرم‌ها در برنامه‌های مختلف استفاده شوند. انتخابگرها می‌توانند در سناریوهای تکمیل خودکار مفید باشند، زیرا رابط کاربری‌ای ارائه می‌دهند که به کاربران امکان می‌دهد مقدار فیلدی را که داده‌های تاریخ یا زمان را ذخیره می‌کند، تغییر دهند. به عنوان مثال، در فرم کارت اعتباری، انتخابگر تاریخ به کاربران امکان می‌دهد تاریخ انقضای کارت اعتباری خود را وارد یا تغییر دهند.

از آنجا که انتخابگرها دیالوگ هستند، در یک فعالیت همراه با سایر فیلدها نمایش داده نمی‌شوند. برای نمایش داده‌های انتخابگر زمانی که انتخابگر قابل مشاهده نیست، می‌توانید از نمای دیگری مانند EditText استفاده کنید که می‌تواند مقدار را زمانی که انتخابگر قابل مشاهده نیست نمایش دهد.

یک شیء EditText به طور طبیعی انتظار داده‌های تکمیل خودکار از نوع AUTOFILL_TYPE_TEXT را دارد. در مقابل، سرویس‌های تکمیل خودکار داده‌ها را به عنوان AUTOFILL_TYPE_DATE ذخیره می‌کنند تا نمایش مناسبی از آنها ایجاد کنند. برای حل ناهماهنگی در نوع‌ها، توصیه می‌کنیم یک نمای سفارشی ایجاد کنید که از EditText ارث‌بری کند و روش‌های مورد نیاز برای مدیریت صحیح مقادیر نوع AUTOFILL_TYPE_DATE پیاده‌سازی کند.

برای ایجاد یک زیرکلاس از EditText که بتواند مقادیری از نوع AUTOFILL_TYPE_DATE را مدیریت کند، مراحل زیر را دنبال کنید:

  1. یک کلاس ایجاد کنید که از EditText ارث بری کند.
  2. متد getAutofillType() را پیاده‌سازی کنید که AUTOFILL_TYPE_DATE را برمی‌گرداند.
  3. متد getAutofillValue() را پیاده‌سازی کنید، که یک شیء AutofillValue را برمی‌گرداند که تاریخ را بر حسب میلی‌ثانیه نشان می‌دهد. برای ایجاد شیء برگشتی، از متد forDate() برای تولید یک شیء AutofillValue استفاده کنید.
  4. متد autofill() را پیاده‌سازی کنید. این متد منطق لازم برای مدیریت پارامتر AutofillValue را که از نوع AUTOFILL_TYPE_DATE است، فراهم می‌کند. برای مدیریت این پارامتر، یک نمایش رشته‌ای مناسب از آن، مانند mm/yyyy ، ایجاد کنید. از نمایش رشته‌ای برای تنظیم ویژگی text نمای خود استفاده کنید.
  5. قابلیتی را پیاده‌سازی کنید که وقتی کاربر می‌خواهد تاریخ را در زیرکلاس سفارشی EditText ویرایش کند، یک انتخابگر نمایش دهد. نما، ویژگی text را با نمایش رشته‌ای مقداری که کاربر در انتخابگر انتخاب می‌کند، به‌روزرسانی می‌کند.

برای مثالی از یک زیرکلاس EditText که مقادیر AUTOFILL_TYPE_DATE را مدیریت می‌کند، به نمونه‌ی Autofill Framework در جاوا یا کاتلین مراجعه کنید.

برای کسب اطلاعات بیشتر در مورد اثبات پشتیبانی از تکمیل خودکار برای نماهای سفارشی خود، به چارچوب تکمیل خودکار مراجعه کنید.