Android Kotlin项目自定义Material TimePicker样式求助

我是Android Kotlin项目开发者，想要把Material TimePicker的样式调整为指定设计（参考样式：深色背景、自定义字体/颜色的数字选择器、底部操作按钮样式），但复刻过程中遇到了阻碍，尤其是不知道怎么调整布局、颜色和字体来匹配目标设计。查了不少资料都没找到合适方案，希望能得到自定义该样式的具体指导或方法。

补充说明 #

已经找到修改标题栏的方法，现在需要其他组件的修改方式，现有代码如下：

<style name="CustomMaterialTimePicker" parent="ThemeOverlay.MaterialComponents.TimePicker">
    <item name="materialTimePickerTitleStyle">@style/TextAppearance.App.TimePicker.Title</item>
</style>
<style name="TextAppearance.App.TimePicker.Title" parent="TextAppearance.MaterialComponents.TimePicker.Title">
    <item name="android:textSize">12sp</item>
    <item name="android:fontFamily">@font/red_hat_display_bold</item>
</style>

一、整体背景与基础颜色调整 #

在自定义主题中添加属性，修改弹窗背景、分割线颜色：

<style name="CustomMaterialTimePicker" parent="ThemeOverlay.MaterialComponents.TimePicker">
    <!-- 已有标题样式 -->
    <item name="materialTimePickerTitleStyle">@style/TextAppearance.App.TimePicker.Title</item>
    <!-- 弹窗背景色 -->
    <item name="android:background">@color/dark_background</item>
    <!-- 时间选择器与按钮栏之间的分割线颜色 -->
    <item name="materialTimePickerDividerColor">@color/divider_color</item>
</style>

二、*数字选择器（时钟/分钟滚轮）*样式修改 #

通过覆盖文本样式和选择器属性，调整滚轮的字体、颜色及选中状态：

<!-- 自定义滚轮数字的文本样式 -->
<style name="TextAppearance.App.TimePicker.Digit" parent="TextAppearance.MaterialComponents.BodyLarge">
    <item name="android:textSize">28sp</item>
    <item name="android:fontFamily">@font/your_custom_font</item>
    <item name="android:textColor">@color/white</item>
    <!-- 选中数字的高亮颜色 -->
    <item name="android:textColorHighlight">@color/accent_color</item>
</style>

<!-- 更新主题，关联滚轮样式 -->
<style name="CustomMaterialTimePicker" parent="ThemeOverlay.MaterialComponents.TimePicker">
    <!-- 已有属性 -->
    <item name="materialTimePickerTitleStyle">@style/TextAppearance.App.TimePicker.Title</item>
    <item name="android:background">@color/dark_background</item>
    <item name="materialTimePickerDividerColor">@color/divider_color</item>
    <!-- 绑定滚轮文本样式 -->
    <item name="textAppearanceMaterialBodyLarge">@style/TextAppearance.App.TimePicker.Digit</item>
    <!-- 滚轮选中项的背景高亮色 -->
    <item name="materialTimePickerClockSelectorColor">@color/selector_background</item>
</style>

三、AM/PM切换按钮样式调整 #

修改切换按钮的文本样式和选中态颜色：

<!-- 自定义AM/PM按钮文本样式 -->
<style name="TextAppearance.App.TimePicker.AmPm" parent="TextAppearance.MaterialComponents.TimePicker.AmPm">
    <item name="android:textSize">16sp</item>
    <item name="android:fontFamily">@font/your_custom_font</item>
    <item name="android:textColor">@color/unselected_ampm_color</item>
    <!-- 选中状态的文本颜色 -->
    <item name="android:textColorPrimary">@color/selected_ampm_color</item>
</style>

<!-- 主题中添加AM/PM样式 -->
<style name="CustomMaterialTimePicker" parent="ThemeOverlay.MaterialComponents.TimePicker">
    <!-- 已有属性 -->
    <item name="materialTimePickerTitleStyle">@style/TextAppearance.App.TimePicker.Title</item>
    <item name="android:background">@color/dark_background</item>
    <item name="materialTimePickerDividerColor">@color/divider_color</item>
    <item name="textAppearanceMaterialBodyLarge">@style/TextAppearance.App.TimePicker.Digit</item>
    <item name="materialTimePickerClockSelectorColor">@color/selector_background</item>
    <!-- 绑定AM/PM文本样式 -->
    <item name="materialTimePickerAmPmStyle">@style/TextAppearance.App.TimePicker.AmPm</item>
</style>

四、底部操作按钮样式修改 #

通过覆盖按钮样式，调整确认/取消按钮的字体、颜色：

<!-- 自定义底部按钮样式 -->
<style name="Widget.App.TimePicker.Button" parent="Widget.MaterialComponents.Button.TextButton">
    <item name="android:textSize">14sp</item>
    <item name="android:fontFamily">@font/your_custom_font</item>
    <item name="android:textColor">@color/button_text_color</item>
    <!-- 按钮点击涟漪效果颜色 -->
    <item name="rippleColor">@color/button_ripple_color</item>
</style>

<!-- 主题中绑定底部按钮样式 -->
<style name="CustomMaterialTimePicker" parent="ThemeOverlay.MaterialComponents.TimePicker">
    <!-- 已有属性 -->
    <item name="materialTimePickerTitleStyle">@style/TextAppearance.App.TimePicker.Title</item>
    <item name="android:background">@color/dark_background</item>
    <item name="materialTimePickerDividerColor">@color/divider_color</item>
    <item name="textAppearanceMaterialBodyLarge">@style/TextAppearance.App.TimePicker.Digit</item>
    <item name="materialTimePickerClockSelectorColor">@color/selector_background</item>
    <item name="materialTimePickerAmPmStyle">@style/TextAppearance.App.TimePicker.AmPm</item>
    <!-- 绑定底部按钮样式 -->
    <item name="buttonBarButtonStyle">@style/Widget.App.TimePicker.Button</item>
</style>

五、应用自定义主题到TimePicker #

在Kotlin代码中创建TimePicker时，设置自定义主题：

val timePicker = MaterialTimePicker.Builder()
    .setTimeFormat(TimeFormat.CLOCK_12H)
    .setHour(12)
    .setMinute(0)
    .build()
// 应用自定义主题
timePicker.setTheme(R.style.CustomMaterialTimePicker)
timePicker.show(supportFragmentManager, "TIME_PICKER")

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