时间戳

首页 > 解决方案 > 如何设置 Android MaterialCalendars 各种组件的样式

android - 如何设置 Android MaterialCalendars 各种组件的样式

问题描述

我正在尝试设计这个样式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：我不想更改整个应用程序的任何主要、次要或强调色（因为它会破坏其余的配色方案）

标签： androidandroid-stylesandroid-datepickermaterial-components-android

解决方案

为将来想要更多自定义 MaterialDatePicker 的人扩展@Gabriele Mariotti的答案。

（旁注）：我注意到平板电脑上的 MaterialDatePicker 恢复为默认颜色，我不知道为什么会这样。

MaterialDatePicker 大小可以通过使用此行从全屏更改为对话框大小

<item name="android:windowFullscreen">false</item>

设置 MaterialDatePicker 的主题：

builder.setTheme(R.style.CustomThemeOverlay_MaterialCalendar_Fullscreen);

如果您不确定，我建议您尝试使用样式并更改颜色以查看实际更改的内容。

<style name="AppTheme"  parent="Theme.MaterialComponents.Light">
   <item name="materialCalendarFullscreenTheme">@styleCustomThemeOverlay_MaterialCalendar_Fullscreen</item>
    </style>

    <style name="CustomThemeOverlay_MaterialCalendar_Fullscreen" parent="@style/ThemeOverlay.MaterialComponents.MaterialCalendar">
        <item name="materialCalendarStyle">@style/Custom_MaterialCalendar.Fullscreen</item>
        <item name="materialCalendarHeaderTitle">@style/customHeaderTitle</item>
        <item name="materialCalendarHeaderSelection">@style/CustomHeaderSelection</item>
        <item name="buttonBarPositiveButtonStyle">@style/Buttons</item>
        <item name="buttonBarNegativeButtonStyle">@style/Buttons</item>
        <item name="android:textColorPrimary">@color/...</item>
        <item name="colorPrimary">@color/...</item>
        <item name="colorSurface">@color/...</item>
        <item name="colorOnSurface">@color/...</item>
        <item name="colorOnPrimary">@color/...</item>
    </style>


    <style name="Custom_MaterialCalendar.Fullscreen" parent="@style/Widget.MaterialComponents.MaterialCalendar">
        <item name="android:windowFullscreen">false</item>
        <item name="rangeFillColor">@color/...</item>
        <item name="dayStyle">@style/CustomWidget_Day</item>
        <item name="daySelectedStyle">@style/CustomSelected</item>
    </style>
    <style name="customHeaderTitle" parent="@style/Widget.MaterialComponents.MaterialCalendar.HeaderTitle">
        <item name="android:textSize">24sp</item>
        <item name="android:textColor">@color/...</item>
        <item name="colorSurface">@color/...</item>
    </style>
    <style name="CustomHeaderSelection" parent="Widget.MaterialComponents.MaterialCalendar.HeaderSelection">
        <item name="android:textSize">18sp</item>
        <item name="android:textColor">@color/...</item>
    </style>
    <style name="CustomWidget_Day" parent="Widget.MaterialComponents.MaterialCalendar.Day">
        <item name="android:textSize">18sp</item>
        <item name="itemTextColor">@color/...</item>
    </style>
    <style name= "CustomSelected" parent="Widget.MaterialComponents.MaterialCalendar.Day.Selected">
        <item name="itemFillColor">@color/...</item>
        <item name="itemStrokeColor">@color/...</item>
    </style>
    <style name="Buttons" parent="Widget.MaterialComponents.Button.TextButton">
        <item name="android:textColor">@color/...</item>
    </style>

我能够使用以下代码做到这一点：

推荐阅读