Cách thay đổi màu hộp thoại DatePicker cho Android 5.0


111

Có thể thay đổi bảng màu (và cả bộ chọn thời gian) cho android 5.0 không?

Tôi đã thử đặt màu nhấn, nhưng điều này không hoạt động (cả khi có và không có 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>

Từ bản gốc: nhập mô tả hình ảnh ở đây

Đối với một cái gì đó như thế này: nhập mô tả hình ảnh ở đây


Màu sắc nổi bật của bạn được đặt thành màu gì trong các kiểu chủ đề ứng dụng của bạn
Neil

@Neil Tôi đã thêm mã mà tôi đã cố gắng sử dụng để tạo kiểu cho đến nay.
Warpzit

Câu trả lời:


322

Lý do tại sao đề xuất của Neil dẫn đến toàn màn hình DatePickerlà do lựa chọn chủ đề chính:

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

Hơn nữa, nếu bạn đi theo con đường này, bạn phải chỉ định chủ đề trong khi tạo 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();

Điều này, theo tôi, là không tốt. Bạn nên cố gắng giữ kiểu dáng bên ngoài java và bên trong styles.xml / themes.xml.

Tôi đồng ý rằng đề xuất của Neil, với một chút thay đổi (thay đổi chủ đề chính để nói, Theme.Material.Light.Dialog ) sẽ mang lại cho bạn kết quả mong muốn. Nhưng, đây là cách khác:

Trong lần kiểm tra đầu tiên, chúng tôi bắt gặp datePickerStylenhững thứ xác định những thứ như: headerBackground(những gì bạn đang cố gắng thay đổi) dayOfWeekBackground, và một số màu văn bản và kiểu văn bản khác.

Ghi đè thuộc tính này trong chủ đề ứng dụng của bạn sẽ không hoạt động. DatePickerDialogsử dụng một chủ đề riêng biệt có thể chỉ định bởi thuộc tính datePickerDialogTheme. Vì vậy, để các thay đổi của chúng tôi có hiệu lực, chúng tôi phải ghi đè datePickerStylebên trong một ghi đèdatePickerDialogTheme .

Chúng ta bắt đầu:

Ghi đè datePickerDialogThemebên trong chủ đề cơ sở của ứng dụng của bạn:

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

Xác định MyDatePickerDialogTheme. Việc lựa chọn chủ đề chính sẽ phụ thuộc vào chủ đề cơ sở của ứng dụng của bạn: nó có thể là một trong hai Theme.Material.Dialoghoặc Theme.Material.Light.Dialog:

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

Chúng tôi đã ghi đè datePickerStylevới phong cách MyDatePickerStyle. Lựa chọn của phụ huynh một lần nữa sẽ phụ thuộc vào chủ đề cơ sở của ứng dụng của bạn là gì: hoặc Widget.Material.DatePickerhoặc Widget.Material.Light.DatePicker. Xác định nó theo yêu cầu của bạn:

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

Hiện tại, chúng tôi chỉ ghi đè headerBackgroundtheo mặc định được đặt thành ?attr/colorAccent(đây cũng là lý do tại sao đề xuất Neil hoạt động trong việc thay đổi nền). Nhưng có thể tùy chỉnh khá nhiều:

dayOfWeekBackground
dayOfWeekTextAppearance
headerMonthTextAppearance
headerDayOfMonthTextAppearance
headerYearTextAppearance
headerSelectedTextColor
yearListItemTextAppearance
yearListSelectorColor
calendarTextColor
calendarSelectedTextColor

Nếu bạn không muốn kiểm soát nhiều (tùy chỉnh) này, bạn không cần phải ghi đè datePickerStyle. colorAccentkiểm soát hầu hết các DatePicker'smàu. Vì vậy, chỉ ghi đè colorAccentbên trong MyDatePickerDialogThemesẽ hoạt động:

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

Ghi đè colorAccentmang lại cho bạn lợi ích bổ sung của việc thay đổi OK&CANCEL màu văn bản. Không tệ.

Bằng cách này, bạn không phải cung cấp bất kỳ thông tin kiểu dáng nào cho hàm DatePickerDialog'stạo. Mọi thứ đã được nối dây đúng cách:

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
Cám ơn một tốt và mô tả đầy đủ về cách hoạt động và làm thế nào nó đã được overriden trong phong cách
Warpzit

Giải thích tuyệt vời @Vikram làm thế nào chúng ta có thể thay đổi ok, hủy bỏ màu văn bản?
Dilip

1
Không tìm thấy @Vikram calendarSelectedTextColor.
Akhilesh Dhar Dubey

7
Có thể tương thích ngược cho android <21 the datePicker không?
RoCk RoCk

1
@RoCk Không chắc ý bạn là gì, nhưng tôi đã xây dựng một thư viện để sao lưu bộ chọn Ngày & Giờ từ phiên bản Android 23 sang phiên bản 14. Dự án được lưu trữ tại: https://github.com/vikramkakkar/SublimePicker .
Vikram

68

Hãy thử cái này.

Mật mã

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

Kiểu trong tệp styles.xml của bạn

EDIT - Đã thay đổi chủ đề thành Theme.AppCompat.Light.Dialog theo đề xuất

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

2
Vâng, nó có màu tím, nhưng cũng toàn màn hình :) nhưng có lẽ nếu tôi đặt nó bên trong một mảnh vỡ thì nó sẽ bị chứa. Bất kỳ đề xuất nào trước khi tôi bắt đầu chơi lại với nó?
Warpzit

Tôi sẽ xem liệu tôi có thể tìm ra giải pháp thích hợp hơn mà không khiến nó ở chế độ toàn màn hình hay không
Neil

9
Chỉ cần sử dụng parent="Theme.AppCompat.Light.Dialog"thay vìparent="Theme.AppCompat.Light"
Chupik

@Neil cảm ơn vì câu trả lời, đã chỉ cho tôi đúng hướng và đây đúng là giải pháp nhanh nhất nhưng tôi đang tìm kiếm một cách tiếp cận tất cả các phong cách / chủ đề :)
Warpzit

Không làm việc trên android 6, nó là toàn màn hình và màu sắc không thay đổi
Jemshit Iskenderov

16

Tạo một phong cách mới

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

Mã Java:

Chủ đề chính là chìa khóa ở đây. Chọn màu của bạn

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

Kết quả:

nhập mô tả hình ảnh ở đây


6

thử cái này, làm việc cho tôi

Đặt hai tùy chọn colorAccentandroid: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>

Câu trả lời này không yêu cầu v24 apis trở lên 💪
Michael

3

Chỉ cần đề cập, bạn cũng có thể sử dụng một chủ đề mặc định như thế android.R.style.Theme_DeviceDefault_Light_Dialogthay thế.

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

Bạn không có chủ đề tạo chỉ cần viết nó trong đối tượng tạo hộp thoại của bạn

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

làm theo điều này nó sẽ cung cấp cho bạn tất cả các kiểu chọn ngày, nó thực sự hoạt động

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


Hoạt động giống như Gem, anh bạn!
sam

AlertDialog.THEME_HOLO_LIGHT không được dùng nữa .. không hoạt động
Yash

1

Tôi đã gặp sự cố rằng các nút bộ chọn thời gian không được nhìn thấy trong màn hình cho API 24 trong Android. (API 21+) nó được giải quyết bằng

<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

Để thay đổi màu văn bản của mục danh sách Năm (CỤ THỂ CHO ANDROID 5.0)

Chỉ cần đặt màu văn bản nhất định trong kiểu hộp thoại chọn ngày của bạn. Vì một số lý do, cờ cài đặt yearListItemTextAppearancekhông phản ánh bất kỳ thay đổi nào trong danh sách năm.

<item name="android:textColor">@android:color/black</item>
Khi sử dụng trang web của chúng tôi, bạn xác nhận rằng bạn đã đọc và hiểu Chính sách cookieChính sách bảo mật của chúng tôi.
Licensed under cc by-sa 3.0 with attribution required.