web-dev-qa-db-fra.com

Style personnalisé de sélecteur de date de matériau

j'ai utilisé le sélecteur de dates de plage à partir de matériel Google avec cette bibliothèque

implémentation 'com.google.Android.material: matériel: 1.2.0-alpha02'

c'est mon code

     MaterialDatePicker.Builder<Pair<Long, Long>> builder =
            MaterialDatePicker.Builder.dateRangePicker();

    CalendarConstraints.Builder constraintsBuilder = new CalendarConstraints.Builder();
    builder.setCalendarConstraints(constraintsBuilder.build());
    MaterialDatePicker<Pair<Long,Long>> picker = builder.build();
    assert getFragmentManager() != null;
    picker.show(getFragmentManager(), picker.toString());

je veux personnaliser le champ de texte de changement de sélecteur de dialogue, rendre le dialogue pas plein écran, etc. comment puis-je faire toutes ces modifications

enter image description here

4
zakaria

Changer entre la version plein écran et la version de dialogue peut être aussi simple que cela:

plein écran:

val picker = MaterialDatePicker.Builder.dateRangePicker().setTheme(R.style.ThemeOverlay_MaterialComponents_MaterialCalendar_Fullscreen).build()

dialogue:

val picker = MaterialDatePicker.Builder.dateRangePicker().setTheme(R.style.ThemeOverlay_MaterialComponents_MaterialCalendar).build()
2
postfixNotation

Bien que la réponse publiée fonctionne totalement, il ne semble pas nécessaire de définir le materialCalendarTheme globalement - vous pouvez simplement le définir via les méthodes MaterialDatePicker.Builder Et setTheme(int themeResId). En suivant un exemple comment ils le font dans Material Design Catalog App .

val datePicker = MaterialDatePicker.Builder.dateRangePicker().apply {
    context?.resolveOrNull(R.attr.materialCalendarTheme)?.let {
        setTheme(it)
    }
    setCalendarConstraints(getConstraints())
    }.build()
// ...

resolutionOrThrow méthode d'assistance:

fun Context.resolveOrNull(@AttrRes attributeResId: Int): Int? {
    val typedValue = TypedValue()
    if (theme.resolveAttribute(attributeResId, typedValue, true)) {
        return typedValue.data
    }
    return null
}

De cette façon, votre boîte de dialogue DatePicker ne sera pas en plein écran mais une boîte de dialogue ordinaire.

1
reVerse