Einer App Auswahlelemente hinzufügen

Android bietet dem Nutzer Steuerelemente zur Auswahl von Uhrzeit oder Datum als einsatzbereite Dialogfelder. Mit diesen Pickern können Sie die einzelnen Abschnitte der Uhrzeit (Stunde, Minute, AM/PM) oder Datum (Monat, Tag, Jahr) auswählen.

Beispiel für die Zeitauswahl von material.io
Abbildung 1. Auswahl der Uhrzeit in einer mobilen Kalenderauswahl

Mit dieser Auswahl sorgen Sie dafür, dass Ihre Nutzer eine Uhrzeit oder ein Datum auswählen können, das gültig, richtig formatiert und an die Sprache des Nutzers angepasst ist.

Beispiel für eine modale Datumsauswahl von material.io
Abbildung 2. Modale Datumsauswahl.

Wir empfehlen die Verwendung von DialogFragment zum Hosten der Zeit- oder Datumsauswahl. Mit DialogFragment wird der Lebenszyklus eines Dialogfelds verwaltet und Sie können Auswahlelemente in verschiedenen Layoutkonfigurationen anzeigen lassen, z. B. in einem einfachen Dialogfeld auf Mobilgeräten oder als eingebetteter Teil des Layouts auf großen Bildschirmen.

Zeitauswahl erstellen

Wenn Sie ein TimePickerDialog mit DialogFragment anzeigen lassen möchten, definieren Sie eine Fragmentklasse, die DialogFragment erweitert, und geben Sie ein TimePickerDialog aus der Methode onCreateDialog() des Fragments zurück.

DialogFragment für eine Zeitauswahl erweitern

So definieren Sie eine DialogFragment für eine TimePickerDialog:

  • Definieren Sie die Methode onCreateDialog(), um eine Instanz von TimePickerDialog zurückzugeben.
  • Implementiere die TimePickerDialog.OnTimeSetListener-Schnittstelle, um einen Callback zu erhalten, wenn der Nutzer die Uhrzeit festlegt.

Beispiel:

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

Informationen zu den Konstruktorargumenten finden Sie in der Klasse TimePickerDialog.

Jetzt brauchen Sie nur noch ein Ereignis, das Ihrer Aktivität eine Instanz dieses Fragments hinzufügt.

Zeitauswahl anzeigen

Nachdem Sie eine DialogFragment wie im vorherigen Beispiel definiert haben, können Sie die Zeitauswahl einblenden, indem Sie eine Instanz der DialogFragment erstellen und die Methode show() aufrufen.

Hier sehen Sie beispielsweise eine Schaltfläche, die beim Antippen eine Methode zum Anzeigen des Dialogfelds aufruft:

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

Wenn der Nutzer auf diese Schaltfläche tippt, ruft das System die folgende Methode auf:

Kotlin

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

Java

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

Diese Methode ruft show() für eine neue Instanz von DialogFragment auf, die im vorherigen Beispiel definiert wurde. Für die Methode show() sind eine Instanz von FragmentManager und ein eindeutiger Tag-Name für das Fragment erforderlich.

Datumsauswahl erstellen

Ein DatePickerDialog wird wie ein TimePickerDialog erstellt. Der Unterschied besteht in dem Dialogfeld, das Sie für das Fragment erstellen.

Wenn Sie ein DatePickerDialog mit DialogFragment anzeigen lassen möchten, definieren Sie eine Fragmentklasse, die DialogFragment erweitert, und geben Sie ein DatePickerDialog aus der Methode onCreateDialog() des Fragments zurück.

DialogFragment für eine Datumsauswahl erweitern

So definieren Sie eine DialogFragment für eine DatePickerDialog:

  • Definieren Sie die Methode onCreateDialog(), um eine Instanz von DatePickerDialog zurückzugeben.
  • Implementiere die Schnittstelle DatePickerDialog.OnDateSetListener, um einen Callback zu erhalten, wenn der Nutzer das Datum festlegt.

Beispiel:

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

Informationen zu den Konstruktorargumenten finden Sie in der Klasse DatePickerDialog.

Sie benötigen nur ein Ereignis, mit dem Ihrer Aktivität eine Instanz dieses Fragments hinzugefügt wird.

Datumsauswahl anzeigen

Nachdem Sie eine DialogFragment wie im vorherigen Beispiel definiert haben, können Sie die Datumsauswahl aufrufen. Dazu erstellen Sie eine Instanz der DialogFragment und rufen show() auf.

Hier sehen Sie beispielsweise eine Schaltfläche, die beim Antippen eine Methode zum Anzeigen des Dialogfelds aufruft:

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

Wenn der Nutzer auf diese Schaltfläche tippt, ruft das System die folgende Methode auf:

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");
}

Diese Methode ruft show() für eine neue Instanz von DialogFragment auf, die im vorherigen Beispiel definiert wurde. Für die Methode show() sind eine Instanz von FragmentManager und ein eindeutiger Tag-Name für das Fragment erforderlich.

Auswahlelemente mit Autofill verwenden

2017 hat Android das Autofill-Framework eingeführt, mit dem Nutzer Daten speichern können, die sie zum Ausfüllen von Formularen in verschiedenen Apps verwenden können. Picker können bei Autofill-Szenarien nützlich sein, indem sie eine UI bereitstellen, mit der Nutzer den Wert eines Feldes ändern können, in dem Datums- oder Uhrzeitdaten gespeichert werden. In einem Kreditkartenformular können Nutzer beispielsweise mit einer Datumsauswahl das Ablaufdatum ihrer Kreditkarte eingeben oder ändern.

Da es sich bei der Auswahl um Dialogfelder handelt, werden sie nicht zusammen mit anderen Feldern in einer Aktivität angezeigt. Wenn die Daten der Auswahl angezeigt werden sollen, wenn die Auswahl nicht sichtbar ist, können Sie eine andere Ansicht verwenden, z. B. EditText. Dort kann der Wert angezeigt werden, wenn die Auswahl nicht sichtbar ist.

Ein EditText-Objekt erwartet nativ Autofill-Daten vom Typ AUTOFILL_TYPE_TEXT. Im Gegensatz dazu speichern Autofill-Dienste die Daten als AUTOFILL_TYPE_DATE, um sie entsprechend darstellen zu können. Um die Inkonsistenzen bei Typen zu beheben, empfehlen wir, eine benutzerdefinierte Ansicht zu erstellen, die von EditText übernimmt und die Methoden implementiert, die für die korrekte Verarbeitung von Werten vom Typ AUTOFILL_TYPE_DATE erforderlich sind.

Führen Sie die folgenden Schritte aus, um eine abgeleitete Klasse von EditText zu erstellen, die Werte vom Typ AUTOFILL_TYPE_DATE verarbeiten kann:

  1. Erstellen Sie eine Klasse, die von EditText übernimmt.
  2. Implementieren Sie die Methode getAutofillType(), die AUTOFILL_TYPE_DATE zurückgibt.
  3. Implementieren Sie die Methode getAutofillValue(), die ein AutofillValue-Objekt zurückgibt, das das Datum in Millisekunden darstellt. Verwende zum Erstellen des Rückgabeobjekts die Methode forDate(), um ein AutofillValue-Objekt zu generieren.
  4. Implementieren Sie die Methode autofill(). Diese Methode stellt die Logik zur Verarbeitung des AutofillValue-Parameters vom Typ AUTOFILL_TYPE_DATE bereit. Damit der Parameter verarbeitet werden kann, muss er als String dargestellt werden, z. B. mm/yyyy. Verwenden Sie die Stringdarstellung, um die Eigenschaft text der Ansicht festzulegen.
  5. Implementieren Sie Funktionen, die eine Auswahl anzeigen, wenn der Nutzer das Datum in der benutzerdefinierten abgeleiteten Klasse von EditText bearbeiten möchte. Die Ansicht aktualisiert das Attribut text mit einer Stringdarstellung des Werts, den der Nutzer in der Auswahl auswählt.

Ein Beispiel für eine abgeleitete Klasse von EditText, die AUTOFILL_TYPE_DATE-Werte verarbeitet, finden Sie im Autofill-Framework-Beispiel in Java oder Kotlin.

Weitere Informationen zum Nachweis der Autofill-Unterstützung für Ihre benutzerdefinierten Ansichten finden Sie unter Autofill-Framework.