Einer App Auswahlelemente hinzufügen

Jetpack Compose ausprobieren
Jetpack Compose ist das empfohlene UI-Toolkit für Android. Informationen zum Hinzufügen von Komponenten in Compose

Android bietet Steuerelemente, mit denen Nutzer in Dialogfeldern eine Uhrzeit oder ein Datum auswählen können. Mit diesen Auswahlfeldern können Nutzer die einzelnen Teile der Uhrzeit (Stunde, Minute, AM/PM) oder des Datums (Monat, Tag, Jahr) auswählen.

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

Mit diesen Auswahlfeldern können Nutzer eine gültige Uhrzeit oder ein gültiges Datum auswählen, die bzw. das korrekt formatiert und an das Gebietsschema des Nutzers angepasst ist.

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

Wir empfehlen, für jede Uhrzeit- oder Datumsauswahl DialogFragment zu verwenden. DialogFragment verwaltet den Dialoglebenszyklus für Sie und ermöglicht es Ihnen, Auswahlfelder in verschiedenen Layoutkonfigurationen anzuzeigen, z. B. in einem einfachen Dialogfeld auf Smartphones oder als eingebetteter Teil des Layouts auf großen Bildschirmen.

Uhrzeitauswahl erstellen

Wenn Sie ein TimePickerDialog mit DialogFragment anzeigen möchten, definieren Sie eine Fragmentklasse, die DialogFragment erweitert, und geben Sie ein TimePickerDialog über die Fragmentmethode onCreateDialog() zurück.

DialogFragment für eine Uhrzeitauswahl erweitern

So definieren Sie ein DialogFragment für ein TimePickerDialog:

  • Definieren Sie die onCreateDialog() Methode, um eine Instanz von TimePickerDialog zurückzugeben.
  • Implementieren Sie 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 benötigen Sie nur noch ein Ereignis, das Ihrer Aktivität eine Instanz dieses Fragments hinzufügt.

Uhrzeitauswahl anzeigen

Nachdem Sie ein DialogFragment wie im vorherigen Beispiel definiert haben, können Sie die Uhrzeitauswahl anzeigen, indem Sie eine Instanz von DialogFragment erstellen und die Methode show() aufrufen.

Hier ist beispielsweise eine Schaltfläche, die beim Tippen eine Methode aufruft, um das Dialogfeld anzuzeigen:

<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 des DialogFragment auf, das im vorherigen Beispiel definiert wurde. Für die Methode show() sind eine Instanz von FragmentManager und ein eindeutiger Tagname für das Fragment erforderlich.

Datumsauswahl erstellen

Das Erstellen eines DatePickerDialog ähnelt dem Erstellen eines TimePickerDialog. Der Unterschied besteht im Dialogfeld, das Sie für das Fragment erstellen.

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

DialogFragment für eine Datumsauswahl erweitern

So definieren Sie ein DialogFragment für ein DatePickerDialog:

  • Definieren Sie die onCreateDialog() Methode, um eine Instanz von DatePickerDialog zurückzugeben.
  • Implementieren Sie die DatePickerDialog.OnDateSetListener Schnittstelle, 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.

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

Datumsauswahl anzeigen

Nachdem Sie ein DialogFragment wie im vorherigen Beispiel definiert haben, können Sie die Datumsauswahl anzeigen, indem Sie eine Instanz von DialogFragment erstellen und show() aufrufen.

Hier ist beispielsweise eine Schaltfläche, die beim Tippen eine Methode aufruft, um das Dialogfeld anzuzeigen:

<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 des DialogFragment auf, das im vorherigen Beispiel definiert wurde. Für die Methode show() sind eine Instanz von FragmentManager und ein eindeutiger Tagname für das Fragment erforderlich.

Auswahlfelder mit Autofill verwenden

2017 wurde in Android das Autofill-Framework eingeführt, mit dem Nutzer Daten speichern können, die zum Ausfüllen von Formularen in verschiedenen Apps verwendet werden können. Auswahlfelder können in Autofill-Szenarien nützlich sein, da sie eine UI bieten, mit der Nutzer den Wert eines Felds ändern können, in dem Datums- oder Zeitdaten gespeichert sind. In einem Kreditkartenformular können Nutzer mit einer Datumsauswahl beispielsweise das Ablaufdatum ihrer Kreditkarte eingeben oder ändern.

Da Auswahlfelder Dialogfelder sind, werden sie nicht zusammen mit anderen Feldern in einer Aktivität angezeigt. Wenn Sie die Daten des Auswahlfelds anzeigen möchten, wenn das Auswahlfeld nicht sichtbar ist, können Sie eine andere Ansicht verwenden, z. B. ein EditText, in dem der Wert angezeigt werden kann, wenn das Auswahlfeld nicht sichtbar ist.

Ein EditText-Objekt erwartet nativ Autofill-Daten vom Typ AUTOFILL_TYPE_TEXT. Autofill-Dienste speichern die Daten dagegen als AUTOFILL_TYPE_DATE, um sie entsprechend darzustellen. Um die Inkonsistenz bei den Typen zu beheben, empfehlen wir, eine benutzerdefinierte Ansicht zu erstellen, die von EditText abgeleitet wird und die Methoden implementiert, die zum korrekten Verarbeiten 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 abgeleitet wird.
  2. Implementieren Sie die getAutofillType() Methode, die AUTOFILL_TYPE_DATE zurückgibt.
  3. Implementieren Sie die getAutofillValue() Methode, die ein AutofillValue Objekt zurückgibt, das das Datum in Millisekunden darstellt. Verwenden Sie zum Erstellen des Rückgabeobjekts die Methode forDate(), um ein AutofillValue Objekt zu generieren.
  4. Implementieren Sie die autofill() Methode. Diese Methode enthält die Logik zum Verarbeiten des AutofillValue Parameters, der vom Typ AUTOFILL_TYPE_DATE ist. Erstellen Sie eine geeignete Stringdarstellung des Parameters, z. B. mm/yyyy. Verwenden Sie die String Darstellung, um das text Attribut Ihrer Ansicht festzulegen.
  5. Implementieren Sie eine Funktion, die ein Auswahlfeld anzeigt, wenn der Nutzer das Datum in der benutzerdefinierten Unterklasse von EditText bearbeiten möchte. Die Ansicht aktualisiert das Attribut text mit einer Stringdarstellung des Werts, den der Nutzer im Auswahlfeld auswählt.

Ein Beispiel für eine Unterklasse 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 benutzerdefinierte Ansichten finden Sie unter Autofill-Framework.