הוספת בוררים לאפליקציה

אפשר לנסות את הדרך של כתיבת הודעה
‫Jetpack Compose היא ערכת הכלים המומלצת לבניית ממשק משתמש ב-Android. איך מוסיפים רכיבים ב-Compose

‫Android מספקת אמצעי בקרה למשתמשים לבחירת שעה או תאריך כתיבות דו-שיח מוכנות לשימוש. אמצעי הבחירה האלה מספקים אמצעי בקרה לבחירת כל חלק של השעה (שעה, דקה, AM/PM) או התאריך (חודש, יום, שנה).

דוגמה לבחירת שעה מ-material.io
איור 1. בחירת שעה בכלי לבחירת תאריכים ביומן בנייד.

השימוש בכלי הבחירה האלה עוזר לוודא שהמשתמשים יכולים לבחור שעה או תאריך שהם תקינים, בפורמט הנכון ומותאמים ללוקאל של המשתמש.

דוגמה לחלונית בחירה של תאריך במצב מודאלי מתוך material.io
איור 2. חלונית לבחירת תאריך במודל.

מומלץ להשתמש ב-DialogFragment כדי לארח כל פעם את בוחר התאריכים או השעות. המחלקות DialogFragment מנהלות את מחזור החיים של תיבת הדו-שיח ומאפשרות להציג את כלי הבחירה בתצורות פריסה שונות, כמו תיבת דו-שיח בסיסית בטלפונים או כחלק מוטמע בפריסה במסכים גדולים.

יצירת בורר שעות

כדי להציג TimePickerDialog באמצעות DialogFragment, מגדירים מחלקת מקטע שמרחיבה את DialogFragment ומחזירים TimePickerDialog מהשיטה onCreateDialog() של המקטע.

הרחבת DialogFragment עבור כלי לבחירת שעה

כדי להגדיר DialogFragment לTimePickerDialog:

  • מגדירים את השיטה onCreateDialog() כדי להחזיר מופע של TimePickerDialog.
  • מטמיעים את הממשק TimePickerDialog.OnTimeSetListener כדי לקבל קריאה חוזרת כשהמשתמש מגדיר את השעה.

הנה דוגמה:

Kotlin

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.
    }
}

Java

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" />

כשמשתמש לוחץ על הכפתור הזה, המערכת קוראת לשיטה הבאה:

Kotlin

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

Java

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

השיטה הזו קוראת ל-show() במופע חדש של DialogFragment שמוגדר בדוגמה הקודמת. השיטה show() דורשת מופע של FragmentManager ושם תג ייחודי לקטע.

יצירת בוחר תאריכים

יצירה של DatePickerDialog דומה ליצירה של TimePickerDialog. ההבדל הוא תיבת הדו-שיח שיוצרים בשביל הפרגמנט.

כדי להציג DatePickerDialog באמצעות DialogFragment, מגדירים מחלקת מקטע שמרחיבה את DialogFragment ומחזירים DatePickerDialog מהשיטה onCreateDialog() של המקטע.

הרחבת DialogFragment עבור כלי לבחירת תאריך

כדי להגדיר DialogFragment לDatePickerDialog:

  • מגדירים את השיטה onCreateDialog() כדי להחזיר מופע של DatePickerDialog.
  • מטמיעים את הממשק DatePickerDialog.OnDateSetListener כדי לקבל קריאה חוזרת כשהמשתמש מגדיר את התאריך.

הנה דוגמה:

Kotlin

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.
    }
}

Java

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().

לדוגמה, הנה לחצן שכשמקישים עליו, מופעלת מתודה להצגת תיבת הדו-שיח:

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

כשמשתמש לוחץ על הכפתור הזה, המערכת קוראת לשיטה הבאה:

Kotlin

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

Java

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

השיטה הזו קוראת ל-show() במופע חדש של DialogFragment שמוגדר בדוגמה הקודמת. השיטה show() דורשת מופע של FragmentManager ושם תג ייחודי לקטע.

שימוש בכלי לבחירת תאריכים עם מילוי אוטומטי

בשנת 2017, הושק ב-Android מסגרת המילוי האוטומטי, שמאפשרת למשתמשים לשמור נתונים שאפשר להשתמש בהם למילוי טפסים באפליקציות שונות. אפשר להשתמש בבוררים בתרחישים של מילוי אוטומטי, כדי לספק ממשק משתמש שמאפשר למשתמשים לשנות את הערך של שדה שמאחסן נתוני תאריך או שעה. לדוגמה, בטופס של כרטיס אשראי, בוחר תאריכים מאפשר למשתמשים להזין או לשנות את תאריך התפוגה של כרטיס האשראי שלהם.

ממשקי בחירה הם תיבות דו-שיח, ולכן הם לא מוצגים בפעילות יחד עם שדות אחרים. כדי להציג את הנתונים של הכלי לבחירת תאריכים כשהוא לא מוצג, אפשר להשתמש בתצוגה אחרת, כמו EditText, שבה אפשר להציג את הערך כשהכלי לבחירת תאריכים לא מוצג.

אובייקט EditText מצפה באופן מקורי לנתונים של מילוי אוטומטי מהסוג AUTOFILL_TYPE_TEXT. לעומת זאת, שירותי מילוי אוטומטי שומרים את הנתונים כ-AUTOFILL_TYPE_DATE כדי ליצור ייצוג מתאים שלהם. כדי לפתור את חוסר העקביות בסוגים, מומלץ ליצור תצוגה מותאמת אישית שמוגדרת כצאצא של EditText ומטמיעה את השיטות שנדרשות לטיפול נכון בערכים מסוג AUTOFILL_TYPE_DATE.

כדי ליצור מחלקת משנה של EditText שיכולה לטפל בערכים מהסוג AUTOFILL_TYPE_DATE:

  1. יוצרים מחלקה שיורשת מ-EditText.
  2. מטמיעים את ה-method‏ getAutofillType(), שמחזיר AUTOFILL_TYPE_DATE.
  3. מטמיעים את השיטה getAutofillValue() שמחזירה אובייקט AutofillValue שמייצג את התאריך באלפיות שנייה. כדי ליצור את אובייקט ההחזרה, משתמשים ב-method‏ forDate() כדי ליצור אובייקט AutofillValue.
  4. מטמיעים את ה-method‏ autofill(). השיטה הזו מספקת את הלוגיקה לטיפול בפרמטר AutofillValue, שהוא מסוג AUTOFILL_TYPE_DATE. כדי לטפל בפרמטר, צריך ליצור ייצוג מחרוזת מתאים שלו, כמו mm/yyyy. משתמשים בייצוג המחרוזת כדי להגדיר את המאפיין text של התצוגה.
  5. מטמיעים פונקציונליות שמציגה כלי לבחירת תאריך כשהמשתמש רוצה לערוך את התאריך במחלקת המשנה המותאמת אישית של EditText. התצוגה מעדכנת את המאפיין text עם ייצוג מחרוזת של הערך שהמשתמש בוחר בכלי לבחירת תאריכים.

דוגמה למחלקת משנה של EditText שמטפלת בערכים של AUTOFILL_TYPE_DATE אפשר לראות בדוגמה של מילוי אוטומטי ב-Java או ב-Kotlin.

מידע נוסף על הוכחת התמיכה במילוי אוטומטי בתצוגות מותאמות אישית זמין במאמר בנושא מסגרת למילוי אוטומטי.