So ändern Sie die Farbe des DatePicker-Dialogfelds für Android 5.0


111

Ist es möglich, das Farbschema des Datepickers (und auch des Timepickers) für Android 5.0 zu ändern?

Ich habe versucht, die Akzentfarben einzustellen, aber das funktioniert nicht (sowohl mit als auch ohne android:):

<!-- colorPrimary is used for the default action bar background -->
<item name="colorPrimary">@color/purple</item>

<!-- colorPrimaryDark is used for the status bar -->
<item name="colorPrimaryDark">@color/purple_tint</item>

<!-- colorAccent is used as the default value for colorControlActivated
     which is used to tint widgets -->
<item name="colorAccent">@color/purple_tint</item>

Vom Original: Geben Sie hier die Bildbeschreibung ein

Zu so etwas: Geben Sie hier die Bildbeschreibung ein


Welche Farbe ist Ihr Farbakzent in Ihren App-Themenstilen eingestellt
Neil

@Neil Ich habe den Code hinzugefügt, den ich bisher für das Styling verwendet habe.
Warpzit

Antworten:


321

Der Grund, warum Neils Vorschlag zu einem Vollbild führt, DatePickerist die Wahl des übergeordneten Themas:

<!-- Theme.AppCompat.Light is not a dialog theme -->
<style name="DialogTheme" parent="**Theme.AppCompat.Light**">
    <item name="colorAccent">@color/blue_500</item>
</style>

Wenn Sie diesen Weg gehen, müssen Sie außerdem das Thema angeben, während Sie Folgendes erstellen DatePickerDialog:

// R.style.DialogTheme
new DatePickerDialog(MainActivity.this, R.style.DialogTheme, new DatePickerDialog.OnDateSetListener() {
    @Override
    public void onDateSet(DatePicker view, int year, int monthOfYear, int dayOfMonth) {
        //DO SOMETHING
    }
}, 2015, 02, 26).show();

Das ist meiner Meinung nach nicht gut. Man sollte versuchen, das Styling von Java und innerhalb von styles.xml / theme.xml fernzuhalten.

Ich bin damit einverstanden, dass Neils Vorschlag mit ein wenig Änderung (Änderung des übergeordneten Themas Theme.Material.Light.Dialog) das gewünschte Ergebnis bringt. Aber hier ist der andere Weg:

Bei der ersten Betrachtung stoßen wir auf datePickerStyleDinge, die Folgendes definieren: headerBackground(was Sie ändern möchten) dayOfWeekBackgroundund einige andere Textfarben und Textstile.

Das Überschreiben dieses Attributs im Thema Ihrer App funktioniert nicht. DatePickerDialogverwendet ein separates Thema, das vom Attribut zugewiesen werden kann datePickerDialogTheme. Also, für unsere Änderungen zu aktivieren , müssen wir außer Kraft datePickerStyleinnerhalb eines überschriebenendatePickerDialogTheme .

Auf geht's:

Überschreiben datePickerDialogThemeSie das Basisthema Ihrer App:

<style name="AppBaseTheme" parent="android:Theme.Material.Light">
    ....
    <item name="android:datePickerDialogTheme">@style/MyDatePickerDialogTheme</item>
</style>

Definieren MyDatePickerDialogTheme. Die Auswahl des übergeordneten Themas hängt vom Basisthema Ihrer App ab: Es kann entweder Theme.Material.Dialogoder sein Theme.Material.Light.Dialog:

<style name="MyDatePickerDialogTheme" parent="android:Theme.Material.Light.Dialog">
    <item name="android:datePickerStyle">@style/MyDatePickerStyle</item>
</style>

Wir haben datePickerStylemit dem Stil überschrieben MyDatePickerStyle. Die Wahl des Elternteils hängt wiederum vom Hauptthema Ihrer App ab: entweder Widget.Material.DatePickeroder Widget.Material.Light.DatePicker. Definieren Sie es gemäß Ihren Anforderungen:

<style name="MyDatePickerStyle" parent="@android:style/Widget.Material.Light.DatePicker">
    <item name="android:headerBackground">@color/chosen_header_bg_color</item>
</style>

Derzeit überschreiben wir nur headerBackgrounddie Standardeinstellung ?attr/colorAccent(aus diesem Grund funktioniert der Neil-Vorschlag auch beim Ändern des Hintergrunds). Es sind jedoch viele Anpassungen möglich:

dayOfWeekBackground
dayOfWeekTextAppearance
headerMonthTextAppearance
headerDayOfMonthTextAppearance
headerYearTextAppearance
headerSelectedTextColor
yearListItemTextAppearance
yearListSelectorColor
calendarTextColor
calendarSelectedTextColor

Wenn Sie nicht so viel Kontrolle (Anpassung) wünschen, müssen Sie nicht überschreiben datePickerStyle. colorAccentsteuert die meisten DatePicker'sFarben. Das Überschreiben direkt im colorAccentInneren MyDatePickerDialogThemesollte also funktionieren:

<style name="MyDatePickerDialogTheme" parent="android:Theme.Material.Light.Dialog">
    <item name="android:colorAccent">@color/date_picker_accent</item>

    <!-- No need to override 'datePickerStyle' -->
    <!-- <item name="android:datePickerStyle">@style/MyDatePickerStyle</item> -->
</style>

Aufschalten colorAccentgibt Ihnen den zusätzlichen Vorteil der Änderung OK& CANCELTextfarben auch. Nicht schlecht.

Auf diese Weise müssen Sie dem DatePickerDialog'sKonstruktor keine Styling-Informationen bereitstellen . Alles wurde richtig verkabelt:

DatePickerDialog dpd = new DatePickerDialog(this, new DatePickerDialog.OnDateSetListener() {
    @Override
    public void onDateSet(DatePicker view, int year, int monthOfYear, int dayOfMonth) {

    }
 }, 2015, 5, 22);

 dpd.show();

8
Vielen Dank für eine gute und vollständige Beschreibung, wie es funktioniert und wie es in Stilen überschrieben werden musste
Warpzit

Ausgezeichnete Erklärung @Vikram wie können wir ok ändern, Textfarbe abbrechen?
Dilip

1
@ Vikram calendarSelectedTextColor nicht gefunden.
Akhilesh Dhar Dubey

7
Ist es möglich, für Android <21 the datePicker abwärtskompatibel zu sein?
RoCk RoCk

1
@RoCk Ich bin mir nicht sicher, was du meinst, aber ich habe eine Bibliothek erstellt, um die Datums- und Zeitauswahl von Android Version 23 auf Version 14 zurück zu portieren. Das Projekt wird gehostet unter: https://github.com/vikramkakkar/SublimePicker .
Vikram

68

Probieren Sie es aus.

Der Code

new DatePickerDialog(MainActivity.this, R.style.DialogTheme, new DatePickerDialog.OnDateSetListener() {
    @Override
    public void onDateSet(DatePicker view, int year, int monthOfYear, int dayOfMonth) {
        //DO SOMETHING
    }
}, 2015, 02, 26).show();

Der Stil In Ihrer Datei styles.xml

BEARBEITEN - Das Thema wurde wie vorgeschlagen in Theme.AppCompat.Light.Dialog geändert

<style name="DialogTheme" parent="Theme.AppCompat.Light.Dialog">
    <item name="colorAccent">@color/blue_500</item>
</style>

2
Ja, es ist lila, aber auch Vollbild :) aber wenn ich es in ein Fragment stecke, wird es vielleicht enthalten sein. Irgendwelche Vorschläge, bevor ich wieder damit herumspiele?
Warpzit

Ich werde sehen, ob ich eine passendere Lösung finden kann, die nicht dazu führt, dass sie im Vollbildmodus angezeigt wird
Neil,

9
Verwenden Sie einfach parent="Theme.AppCompat.Light.Dialog"anstelle vonparent="Theme.AppCompat.Light"
Chupik

@ Neil danke für die Antwort, zeigte mir in die richtige Richtung und dies ist eigentlich die schnellste Lösung, aber ich suchte nach einem All-Style / Theme-Ansatz :)
Warpzit

Funktioniert nicht auf Android 6, es ist Vollbild und Farbe wird nicht geändert
Jemshit Iskenderov

16

Erstellen Sie einen neuen Stil

<!-- Theme.AppCompat.Light.Dialog -->
<style name="DialogTheme" parent="Theme.AppCompat.Light.Dialog">
    <item name="colorAccent">@color/blue_500</item>
</style>

Java-Code:

Das übergeordnete Thema ist hier der Schlüssel. Wählen Sie Ihren colorAccent

DatePickerDialog = new DatePickerDialog(context,R.style.DialogTheme,this,now.get(Calendar.YEAR),now.get(Calendar.MONTH),now.get(Calendar.DAY_OF_MONTH);

Ergebnis:

Geben Sie hier die Bildbeschreibung ein


6

versuche das, arbeite für mich

Setzen Sie die beiden Optionen colorAccentundandroid:colorAccent

<style name="AppTheme" parent="@style/Theme.AppCompat.Light.NoActionBar">
    <!-- Customize your theme here. -->
   ....
    <item name="android:dialogTheme">@style/AppTheme.DialogTheme</item>
    <item name="android:datePickerDialogTheme">@style/Dialog.Theme</item>
</style>

<style name="AppTheme.DialogTheme" parent="Theme.AppCompat.Light.Dialog">

<!-- Put the two options, colorAccent and android:colorAccent. -->
    <item name="colorAccent">@color/colorPrimary</item>
    <item name="android:colorPrimary">@color/colorPrimary</item>
    <item name="android:colorPrimaryDark">@color/colorPrimaryDark</item>
    <item name="android:colorAccent">@color/colorPrimary</item>
 </style>

Diese Antwort erfordert keine v24 apis und höher Michael
Michael

3

Um nur zu erwähnen, können Sie android.R.style.Theme_DeviceDefault_Light_Dialogstattdessen auch das Standardthema wie verwenden.

new DatePickerDialog(MainActivity.this, android.R.style.Theme_DeviceDefault_Light_Dialog, new DatePickerDialog.OnDateSetListener() {
@Override
public void onDateSet(DatePicker view, int year, int monthOfYear, int dayOfMonth) {
    //DO SOMETHING
    }
}, 2015, 02, 26).show();

1

Sie müssen kein Thema erstellen, sondern schreiben es einfach in Ihr Dialogerstellungsobjekt

DatePickerDialog datePicker = new DatePickerDialog(getActivity(), AlertDialog.THEME_HOLO_LIGHT,this, mYear, mMonth, mDay);

Befolgen Sie diese Anweisungen, um alle Arten der Datumsauswahl zu erhalten. Es funktioniert wirklich

http://www.android-examples.com/change-datepickerdialog-theme-in-android-using-dialogfragment/


Funktioniert wie Gem, Bruder!
Sam

AlertDialog.THEME_HOLO_LIGHT veraltet .. funktioniert nicht
Yash

1
<style name="AppThemeDatePicker" parent="Theme.AppCompat.Light.NoActionBar">
    <item name="colorAccent">@color/select2</item>
    <item name="android:colorAccent">@color/select2</item>
    <item name="android:datePickerStyle">@style/MyDatePickerStyle</item>
</style>


<style name="MyDatePickerStyle" parent="@android:style/Widget.Material.Light.DatePicker">
    <item name="android:headerBackground">@color/select2</item>
</style>

0

Ich hatte das Problem, dass auf dem Bildschirm für API 24 in Android keine Zeitauswahlschaltflächen angezeigt wurden. (API 21+) wird gelöst durch

<style name="MyDatePickerDialogTheme" parent="android:Theme.Material.Light.Dialog">
            <item name="android:colorAccent">@color/colorPrimary2</item></style>

<style name="Theme" parent="BBaseTheme">
         <item name="android:datePickerDialogTheme">@style/MyDatePickerDialogTheme</item>
</style>

0

Zum Ändern der Textfarbe des Listenelements für das Jahr (SPEZIFISCH FÜR ANDROID 5.0)

Stellen Sie einfach eine bestimmte Textfarbe in Ihrem Datumsauswahl-Dialogstil ein. Aus irgendeinem Grund yearListItemTextAppearancespiegelt das Setzen des Flags keine Änderung der Jahresliste wider.

<item name="android:textColor">@android:color/black</item>
Durch die Nutzung unserer Website bestätigen Sie, dass Sie unsere Cookie-Richtlinie und Datenschutzrichtlinie gelesen und verstanden haben.
Licensed under cc by-sa 3.0 with attribution required.