Jetpack Compose中DatePickerDialog颜色自定义方法

你当前使用的是传统的DatePickerDialog（非Compose原生DatePicker组件），要自定义它的颜色，核心是通过自定义Theme样式 + ContextThemeWrapper覆盖默认颜色属性，具体步骤如下：

1. 定义自定义样式（res/values/styles.xml） #

在资源文件中创建继承自基础Dialog主题的自定义样式，覆盖DatePicker相关颜色属性：

<style name="CustomDatePickerDialogTheme" parent="Theme.AppCompat.Light.Dialog">
    <!-- 对话框标题文字颜色 -->
    <item name="android:titleTextColor">#FF4081</item>
    <!-- 选中日期的高亮颜色、按钮强调色 -->
    <item name="colorAccent">#FF4081</item>
    <!-- 确认/取消按钮文字颜色 -->
    <item name="android:textColorPrimary">#FF4081</item>
    <!-- 日历头部背景色 -->
    <item name="android:colorBackground">#F5F5F5</item>
    <!-- 未选中日期的默认文字颜色 -->
    <item name="android:textColorSecondary">#757575</item>
</style>

注：如果项目使用Material Design 3，可将父样式改为Theme.Material3.Light.Dialog，并替换为Material3对应属性（比如用colorPrimary代替colorAccent）。

2. 修改DatePickerDialog初始化代码 #

在showDatePickerDialog函数中，用ContextThemeWrapper包裹原Context并传入自定义样式，再传给DatePickerDialog：

private var dateFormat = "dd/MM/yyyy"
fun showDatePickerDialog(context: Context, dateOfBirth: MutableState<TextFieldValue>, onValueChanged: () -> Unit) {
    val calendar = getCalendar(dateOfBirth.value.text)
    // 用ContextThemeWrapper包裹上下文，应用自定义样式
    val themedContext = ContextThemeWrapper(context, R.style.CustomDatePickerDialogTheme)
    DatePickerDialog(
        themedContext,
        { _, year, month, day ->
            dateOfBirth.value = TextFieldValue(getPickedDateAsString(year, month, day))
            onValueChanged.invoke()
        },
        calendar.get(Calendar.YEAR),
        calendar.get(Calendar.MONTH),
        calendar.get(Calendar.DAY_OF_MONTH)
    )
        .show()
}

// 以下原有函数保持不变
private fun getCalendar(dateOfBirth: String): Calendar {
    return if (dateOfBirth.isEmpty()) {
        Calendar.getInstance()
    } else {
        getLastPickedDateCalendar(dateOfBirth)
    }
}

private fun getLastPickedDateCalendar(dateOfBirth: String): Calendar {
    val dateFormat = SimpleDateFormat(dateFormat, Locale.getDefault())
    val calendar = Calendar.getInstance()
    calendar.time = dateFormat.parse(dateOfBirth)
    return calendar
}

private fun getPickedDateAsString(year: Int, month: Int, day: Int): String {
    val calendar = Calendar.getInstance()
    calendar.set(year, month, day)
    val dateFormat = SimpleDateFormat(dateFormat, Locale.getDefault())
    return dateFormat.format(calendar.time)
}

关键属性说明 #

• colorAccent：控制选中日期的高亮色、按钮的强调色
• android:titleTextColor：修改对话框标题文字颜色
• android:textColorPrimary：控制确认/取消按钮的文字颜色
• android:textColorSecondary：控制未选中日期的默认文字颜色
• android:colorBackground：修改日历头部的背景色

内容的提问来源于stack exchange，提问作者R0ck