Cara mengubah warna dialog DatePicker untuk Android 5.0


111

Apakah mungkin untuk mengubah skema warna datepicker (dan juga timepicker) untuk Android 5.0?

Saya sudah mencoba mengatur warna aksen, tetapi ini tidak berhasil (baik dengan dan tanpa 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>

Dari aslinya: masukkan deskripsi gambar di sini

Untuk sesuatu seperti ini: masukkan deskripsi gambar di sini


Apa warna yang disetel aksen warna Anda dalam gaya tema aplikasi Anda
Neil

@Neil Saya telah menambahkan kode yang telah saya coba gunakan untuk gaya sejauh ini.
Warpzit

Jawaban:


322

Alasan mengapa saran Neil menghasilkan layar penuh DatePickeradalah pilihan tema induk:

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

Selain itu, jika Anda mengikuti rute ini, Anda harus menentukan tema saat membuat 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();

Ini, menurut saya, tidak baik. Seseorang harus mencoba untuk menjaga styling dari java dan di dalam styles.xml / themes.xml.

Saya setuju bahwa saran Neil, dengan sedikit perubahan (mengubah tema induk menjadi, Theme.Material.Light.Dialog) akan memberi Anda hasil yang diinginkan. Tapi, inilah cara lain:

Pada pemeriksaan pertama, kami menemukan datePickerStyleyang mendefinisikan hal-hal seperti: headerBackground(apa yang Anda coba ubah) dayOfWeekBackground, dan beberapa warna teks dan gaya teks lainnya.

Mengganti atribut ini di tema aplikasi Anda tidak akan berfungsi. DatePickerDialogmenggunakan tema terpisah yang dapat ditentukan oleh atribut datePickerDialogTheme. Jadi, agar perubahan kita berpengaruh, kita harus mengganti datePickerStyleinside a overridendatePickerDialogTheme .

Kita mulai:

Ganti datePickerDialogThemedi dalam tema dasar aplikasi Anda:

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

Tentukan MyDatePickerDialogTheme. Pilihan tema induk akan bergantung pada apa tema dasar aplikasi Anda: bisa jadi Theme.Material.Dialogatau Theme.Material.Light.Dialog:

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

Kami telah menimpa datePickerStyledengan gaya MyDatePickerStyle. Pilihan induk sekali lagi akan bergantung pada apa tema dasar aplikasi Anda: baik Widget.Material.DatePickeratau Widget.Material.Light.DatePicker. Tentukan sesuai kebutuhan Anda:

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

Saat ini, kami hanya mengganti headerBackgroundyang secara default disetel ke ?attr/colorAccent(ini juga mengapa saran Neil berfungsi dalam mengubah latar belakang). Tetapi ada cukup banyak kemungkinan penyesuaian:

dayOfWeekBackground
dayOfWeekTextAppearance
headerMonthTextAppearance
headerDayOfMonthTextAppearance
headerYearTextAppearance
headerSelectedTextColor
yearListItemTextAppearance
yearListSelectorColor
calendarTextColor
calendarSelectedTextColor

Jika Anda tidak ingin banyak kontrol (kustomisasi), Anda tidak perlu mengganti datePickerStyle. colorAccentmengontrol sebagian besar DatePicker'swarna. Jadi, mengesampingkan just colorAccentinside MyDatePickerDialogThemeseharusnya berfungsi:

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

Mengganti colorAccentmemberi Anda manfaat tambahan dari mengubah OK& CANCELwarna teks juga. Tidak buruk.

Dengan cara ini Anda tidak perlu memberikan informasi gaya apa pun ke DatePickerDialog'skonstruktor. Semuanya telah terhubung dengan benar:

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
Terima kasih atas penjelasan yang baik dan lengkap tentang cara kerjanya dan bagaimana itu harus diganti dalam gaya
Warpzit

Penjelasan yang sangat bagus @Vikram bagaimana kita bisa mengubah ok, batalkan warna teks?
Dilip

1
@Vikram calendarSelectedTextColor tidak ditemukan.
Akhilesh Dhar Dubey

7
Apakah mungkin untuk kompatibel ke belakang untuk android <21 the datePicker?
RoCk RoCk

1
@RoCk Tidak yakin apa yang Anda maksud, tetapi saya membangun perpustakaan untuk mem-porting pemetik Tanggal & Waktu dari Android versi 23 ke versi 14. Proyek ini di-host di: https://github.com/vikramkakkar/SublimePicker .
Vikram

68

Cobalah ini.

Kode

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

Style Dalam file styles.xml Anda

EDIT - Mengubah tema menjadi Theme.AppCompat.Light.Dialog seperti yang disarankan

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

2
Ya ungu, tapi juga full screen :) tapi mungkin kalau saya taruh di dalam fragment itu akan terisi. Ada saran sebelum saya mulai bermain-main dengannya lagi?
Warpzit

Saya akan melihat apakah saya dapat menemukan solusi yang lebih tepat yang tidak membuatnya menjadi layar penuh
Neil

9
Cukup gunakan parent="Theme.AppCompat.Light.Dialog"sebagai penggantiparent="Theme.AppCompat.Light"
Chupik

@Neil terima kasih atas jawabannya, mengarahkan saya ke arah yang benar dan ini adalah solusi tercepat yang tepat tetapi saya mencari pendekatan semua gaya / tema :)
Warpzit

Tidak berfungsi di Android 6, ini adalah layar penuh dan warna tidak berubah
Jemshit Iskenderov

16

Ciptakan gaya baru

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

Kode Java:

Tema induk adalah kuncinya di sini. Pilih colorAccent Anda

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

Hasil:

masukkan deskripsi gambar di sini


6

coba ini, bekerjalah untukku

Letakkan dua opsi, colorAccentdanandroid: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>

Jawaban ini tidak memerlukan v24 apis dan di atasnya 💪
Michael

3

Sekadar menyebutkan, Anda juga dapat menggunakan default tema seperti android.R.style.Theme_DeviceDefault_Light_Dialog.

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

Anda tidak perlu membuat tema, cukup tulis di objek pembuatan dialog Anda

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

ikuti ini itu akan memberi Anda semua jenis gaya pemetik tanggal itu benar-benar berfungsi

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


Bekerja seperti Permata, bro!
sam

AlertDialog.THEME_HOLO_LIGHT tidak digunakan lagi .. tidak berfungsi
Yash

1

Saya memiliki masalah bahwa tombol pemilih waktu belum terlihat di layar untuk API 24 di android. (API 21+) diselesaikan dengan

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

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

Untuk mengubah warna teks item daftar Tahun (KHUSUS UNTUK ANDROID 5.0)

Cukup atur warna teks tertentu dalam gaya dialog pemilih tanggal Anda. Untuk beberapa alasan, pengaturan bendera yearListItemTextAppearancetidak mencerminkan perubahan apa pun pada daftar tahun.

<item name="android:textColor">@android:color/black</item>
Dengan menggunakan situs kami, Anda mengakui telah membaca dan memahami Kebijakan Cookie dan Kebijakan Privasi kami.
Licensed under cc by-sa 3.0 with attribution required.