如何对Android MaterialCalendars各个组件进行风格化处理？

Posted 2023-02-03

我正尝试着把这个 MaterialCalendar但我没有得到任何帮助，任何帮助将是感激的。styles.xml 看起来类似于下面的。

 <style name="AppTheme" parent="Theme.MaterialComponents">
    <item name="materialCalendarTheme">@style/ThemeMaterialCalendar</item>
</style>

<style name="ThemeMaterialCalendar" parent="ThemeOverlay.MaterialComponents.MaterialCalendar">
    <item name="buttonBarPositiveButtonStyle">@style/AlterDialogButtonStyle</item>
    <item name="buttonBarNegativeButtonStyle">@style/AlterDialogButtonStyle</item>
    <item name="materialButtonStyle">@style/ThemeMaterialCalendarTextButton</item>
    <item name="android:colorAccent">@color/accent</item>
</style>

<style name="ThemeMaterialCalendarTextButton" parent="Widget.MaterialComponents.Button.TextButton.Dialog.Flush">
    <item name="android:textColor">?attr/colorAccent</item>
</style>

<style name="AlterDialogButtonStyle" parent="Widget.MaterialComponents.Button.TextButton">
    <item name="android:textColor">?attr/colorAccent</item>
</style>

呈现的是这样的：

非常轻的蓝燕是我的 colorAccent 头部是紫色的颜色。这些都很好。我可以用上面的方法来改变它们 styles.xml.

然而，我也想改变深灰色背景下的 MaterialCalendar 为白色，然后当然将文字从白色改为黑色或灰色（这样就可以看到了），以及为月份和年份的选择做箭头。任何被选中的年份或日期都应该用重音色高亮显示。

本质上我想要类似于这样的东西（请忽略下面的截图是旧的 DatePickerDialog 而不是新的 MaterialCalendar):

任何帮助都将是非常感激的。

PS：我不想改变我的主色、次色或整个应用程序的重点颜色（因为它会破坏其余的配色方案）。

答案

自定义颜色的最好方法是在 MaterialDatePicker 是为了覆盖它们。

<style name="MaterialCalendarThemeBackground" parent="ThemeOverlay.MaterialComponents.MaterialCalendar">
    <item name="colorSurface">@color/....</item>
    <item name="colorOnSurface">@color/....</item>
    <item name="colorPrimary">@color/....</item>      
    <item name="colorOnPrimary">@color/....</item>
</style>

然后使用。

MaterialDatePicker.Builder<Long> builder = MaterialDatePicker.Builder.datePicker();
builder.setTheme(R.style.MaterialCalendarThemeBackground);

这个 背景色 的 MaterialDatePicker 是基于 colorSurface 属性。

<style name="MaterialCalendarThemeBackground" parent="ThemeOverlay.MaterialComponents.MaterialCalendar">
    <item name="colorSurface">@color/....</item>
</style>

相反，如果你想改变其他颜色，使用自定义样式，你可以做到。

• 天：它的基础是 colorOnSurface. 你可以定义。

    <style name="MaterialCalendarThemeBackground" parent="ThemeOverlay.MaterialComponents.MaterialCalendar">
        <item name="materialCalendarStyle">@style/CustomMaterialCalendar</item>
    </style>

与：

<style name="CustomMaterialCalendar" parent="Widget.MaterialComponents.MaterialCalendar">
    <item name="dayStyle">@style/CustomWidget_Day</item>
</style>

<style name="CustomWidget_Day" parent="Widget.MaterialComponents.MaterialCalendar.Day">
    <item name="itemTextColor">@color/...</item>
    <item name="itemStrokeColor">@color/....</item>
</style>

• 选定日期：它的基础是 colorPrimarycolorOnPrimary. 你可以定义。

    <style name="CustomMaterialCalendar" parent="Widget.MaterialComponents.MaterialCalendar">
       <item name="daySelectedStyle">@style/CustomSelected</item>
    </style>

与：

  <style name= "CustomSelected" parent="Widget.MaterialComponents.MaterialCalendar.Day.Selected">
    <item name="itemFillColor">...</item>
    <item name="itemTextColor">...</item>
  </style>