如何在 android 中更改 Material DateRangePicker 颜色?
How can I change Material DateRangePicker color in android?
dateLI.setOnClickListener(new View.OnClickListener() {
@Override
public void onClick(View view) {
MaterialDatePicker.Builder<Pair<Long, Long>> builder = MaterialDatePicker.Builder.dateRangePicker();
CalendarConstraints.Builder constraintsBuilder = new CalendarConstraints.Builder();
builder.setTheme(R.style.DateRangePickerTheme);
builder.setCalendarConstraints(constraintsBuilder.build());
MaterialDatePicker picker = builder.build();
assert getFragmentManager() != null;
picker.show(getFragmentManager(), picker.toString());
}
});
我想要这个输出:
我从上面的代码得到这个输出:
使用绿色勾号解决方案后,我得到了这个输出
enter image description here
我提到了日期选择器的样式:
<style name="DateRangePickerTheme" parent="Theme.MaterialComponents.Light.DarkActionBar.Bridge">
<item name="materialCalendarStyle">@style/Custom_MaterialCalendar.Fullscreen</item>
<item name="android:orientation">horizontal</item>
</style>
<style name="Custom_MaterialCalendar.Fullscreen" parent="@style/Widget.MaterialComponents.MaterialCalendar.Fullscreen">
<item name="android:windowFullscreen">false</item>
</style>
由于您使用的是 Bridge
主题,因此您必须在您的应用主题中添加这些属性:
<style name="AppTheme" parent="Theme.MaterialComponents.Light.DarkActionBar.Bridge">
<!-- ...... -->
<item name="materialCalendarStyle">@style/Widget.MaterialComponents.MaterialCalendar</item>
<item name="materialCalendarFullscreenTheme">@style/ThemeOverlay.MaterialComponents.MaterialCalendar.Fullscreen</item>
<item name="materialCalendarTheme">@style/ThemeOverlay.MaterialComponents.MaterialCalendar</item>
</style>
然后您可以在 MaterialDatePicker
中应用主题覆盖:
builder.setTheme(R.style.CustomThemeOverlay_MaterialCalendar_Fullscreen)
其中:
<style name="CustomThemeOverlay_MaterialCalendar_Fullscreen"
parent="@style/ThemeOverlay.MaterialComponents.MaterialCalendar.Fullscreen">
<item name="materialCalendarStyle">@style/Custom_MaterialCalendar.Fullscreen</item>
</style>
<style name="Custom_MaterialCalendar.Fullscreen"
parent="@style/Widget.MaterialComponents.MaterialCalendar.Fullscreen">
<item name="android:windowFullscreen">false</item>
</style>
颜色基于您的应用主题中定义的 colorPrimary
、colorOnPrimary
、colorOnPrimary
。您可以在 CustomThemeOverlay_MaterialCalendar_Fullscreen
:
中覆盖主题
<style name="CustomThemeOverlay_MaterialCalendar_Fullscreen"
parent="@style/ThemeOverlay.MaterialComponents.MaterialCalendar.Fullscreen">
<item name="materialCalendarStyle">@style/Custom_MaterialCalendar.Fullscreen</item>
<item name="colorPrimary">@color/...</item>
<item name="colorOnSurface">@color/...</item>
</style>
`<style name="DateRangePickerTheme"parent="Theme.MaterialComponents.Light.DarkActionBar.Bridge">
<item name="materialCalendarFullscreenTheme">@style/ThemeOverlay.MaterialComponents.MaterialCalendar.Fullscreen</item></style>`
试试这个....
其实你不必使用这一行:
builder.setTheme(R.style.CustomThemeOverlay_MaterialCalendar_Fullscreen)
您可以这样设置您的应用主题:
<!-- Base application theme. -->
<style name="AppTheme" parent="Theme.MaterialComponents.Light.Bridge">
<!-- Customize your theme here. -->
<item name="colorPrimary">@color/colorPrimary</item>
<item name="colorSecondary">@color/colorSecondary</item>
<!-- Picker styles and themes. -->
<item name="materialCalendarStyle">@style/Widget.MaterialComponents.MaterialCalendar</item>
<item name="materialCalendarFullscreenTheme">@style/CustomThemeOverlay_MaterialCalendar_Fullscreen</item>
<item name="materialCalendarTheme">@style/ThemeOverlay.MaterialComponents.MaterialCalendar</item>
</style>
然后这样设置 CustomThemeOverlay_MaterialCalendar_Fullscreen:
<style name="CustomThemeOverlay_MaterialCalendar_Fullscreen"
parent="@style/ThemeOverlay.MaterialComponents.MaterialCalendar.Fullscreen">
<item name="colorPrimary">@color/yourcolor</item>
<item name="colorOnSurface">@color/yourcolor</item>
</style>
就是这样。构建器将自动设置为应用程序的主题,其中日历主题设置为设计的主题。只有当我在应用程序中使用不同的日历(每个日历都有不同的主题)时,我才会使用 setTheme
。
dateLI.setOnClickListener(new View.OnClickListener() {
@Override
public void onClick(View view) {
MaterialDatePicker.Builder<Pair<Long, Long>> builder = MaterialDatePicker.Builder.dateRangePicker();
CalendarConstraints.Builder constraintsBuilder = new CalendarConstraints.Builder();
builder.setTheme(R.style.DateRangePickerTheme);
builder.setCalendarConstraints(constraintsBuilder.build());
MaterialDatePicker picker = builder.build();
assert getFragmentManager() != null;
picker.show(getFragmentManager(), picker.toString());
}
});
我想要这个输出:
我从上面的代码得到这个输出:
使用绿色勾号解决方案后,我得到了这个输出 enter image description here
我提到了日期选择器的样式:
<style name="DateRangePickerTheme" parent="Theme.MaterialComponents.Light.DarkActionBar.Bridge">
<item name="materialCalendarStyle">@style/Custom_MaterialCalendar.Fullscreen</item>
<item name="android:orientation">horizontal</item>
</style>
<style name="Custom_MaterialCalendar.Fullscreen" parent="@style/Widget.MaterialComponents.MaterialCalendar.Fullscreen">
<item name="android:windowFullscreen">false</item>
</style>
由于您使用的是 Bridge
主题,因此您必须在您的应用主题中添加这些属性:
<style name="AppTheme" parent="Theme.MaterialComponents.Light.DarkActionBar.Bridge">
<!-- ...... -->
<item name="materialCalendarStyle">@style/Widget.MaterialComponents.MaterialCalendar</item>
<item name="materialCalendarFullscreenTheme">@style/ThemeOverlay.MaterialComponents.MaterialCalendar.Fullscreen</item>
<item name="materialCalendarTheme">@style/ThemeOverlay.MaterialComponents.MaterialCalendar</item>
</style>
然后您可以在 MaterialDatePicker
中应用主题覆盖:
builder.setTheme(R.style.CustomThemeOverlay_MaterialCalendar_Fullscreen)
其中:
<style name="CustomThemeOverlay_MaterialCalendar_Fullscreen"
parent="@style/ThemeOverlay.MaterialComponents.MaterialCalendar.Fullscreen">
<item name="materialCalendarStyle">@style/Custom_MaterialCalendar.Fullscreen</item>
</style>
<style name="Custom_MaterialCalendar.Fullscreen"
parent="@style/Widget.MaterialComponents.MaterialCalendar.Fullscreen">
<item name="android:windowFullscreen">false</item>
</style>
颜色基于您的应用主题中定义的 colorPrimary
、colorOnPrimary
、colorOnPrimary
。您可以在 CustomThemeOverlay_MaterialCalendar_Fullscreen
:
<style name="CustomThemeOverlay_MaterialCalendar_Fullscreen"
parent="@style/ThemeOverlay.MaterialComponents.MaterialCalendar.Fullscreen">
<item name="materialCalendarStyle">@style/Custom_MaterialCalendar.Fullscreen</item>
<item name="colorPrimary">@color/...</item>
<item name="colorOnSurface">@color/...</item>
</style>
`<style name="DateRangePickerTheme"parent="Theme.MaterialComponents.Light.DarkActionBar.Bridge">
<item name="materialCalendarFullscreenTheme">@style/ThemeOverlay.MaterialComponents.MaterialCalendar.Fullscreen</item></style>`
试试这个....
其实你不必使用这一行:
builder.setTheme(R.style.CustomThemeOverlay_MaterialCalendar_Fullscreen)
您可以这样设置您的应用主题:
<!-- Base application theme. -->
<style name="AppTheme" parent="Theme.MaterialComponents.Light.Bridge">
<!-- Customize your theme here. -->
<item name="colorPrimary">@color/colorPrimary</item>
<item name="colorSecondary">@color/colorSecondary</item>
<!-- Picker styles and themes. -->
<item name="materialCalendarStyle">@style/Widget.MaterialComponents.MaterialCalendar</item>
<item name="materialCalendarFullscreenTheme">@style/CustomThemeOverlay_MaterialCalendar_Fullscreen</item>
<item name="materialCalendarTheme">@style/ThemeOverlay.MaterialComponents.MaterialCalendar</item>
</style>
然后这样设置 CustomThemeOverlay_MaterialCalendar_Fullscreen:
<style name="CustomThemeOverlay_MaterialCalendar_Fullscreen"
parent="@style/ThemeOverlay.MaterialComponents.MaterialCalendar.Fullscreen">
<item name="colorPrimary">@color/yourcolor</item>
<item name="colorOnSurface">@color/yourcolor</item>
</style>
就是这样。构建器将自动设置为应用程序的主题,其中日历主题设置为设计的主题。只有当我在应用程序中使用不同的日历(每个日历都有不同的主题)时,我才会使用 setTheme
。