【问题标题】:How can I change Material DateRangePicker color in android?如何在 android 中更改 Material DateRangePicker 颜色?
【发布时间】:2020-12-07 13:06:28
【问题描述】:
    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>

【问题讨论】:

    标签: android material-design android-datepicker material-components-android materialdatepicker


    【解决方案1】:

    由于您使用的是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>
    

    【讨论】:

    • 好的,我改变了它,但我怎样才能改变日期选择器的颜色,就像我在问题中附加选择器一样?我有黑白日期选择器。
    • @aartifoxdeveloper 检查更新的答案。颜色基于您的应用主题中定义的colorPrimary、colorOnPrimary、colorOnPrimary。您可以在CustomThemeOverlay_MaterialCalendar_Fullscreen 中覆盖主题。
    • 您对图像有任何想法,请先附上我的问题,我如何才能将这个日期选择器与日期的编辑文本附加在一起
    【解决方案2】:
     `<style name="DateRangePickerTheme"parent="Theme.MaterialComponents.Light.DarkActionBar.Bridge">
        <item name="materialCalendarFullscreenTheme">@style/ThemeOverlay.MaterialComponents.MaterialCalendar.Fullscreen</item></style>`
    

    试试这个....

    【讨论】:

      【解决方案3】:

      其实你不必使用这一行:

      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。

      【讨论】:

        猜你喜欢
        • 1970-01-01
        • 2020-09-03
        • 2021-07-01
        • 2020-07-16
        • 1970-01-01
        • 2021-10-10
        • 2020-12-26
        • 2021-10-15
        • 2019-10-16
        相关资源
        最近更新 更多