Material DatePicker Disable year option

Question

I've got the following code:

private void openDatePicker() {
    MaterialDatePicker picker =
            MaterialDatePicker.Builder.datePicker()
                    .setTitleText("Select date")
                    .setTheme(R.style.DatePickerTheme)
                    .setSelection(MaterialDatePicker.todayInUtcMilliseconds())
                    .build();
    picker.show(getParentFragmentManager(),"tag");
    picker.addOnPositiveButtonClickListener(new MaterialPickerOnPositiveButtonClickListener() {
        @Override
        public void onPositiveButtonClick(Object selection) {
            try {
                mtnRecDate.setText(sdf.format(selection));
            } catch (Exception e) {
                FancyToast.makeText(getContext(),"Setting Date failed!",FancyToast.LENGTH_LONG,FancyToast.ERROR,false).show();
            }

        }
    });
}

Style:

<!-- Picker styles and themes. -->
<style name="DatePickerTheme" parent="@style/ThemeOverlay.MaterialComponents.MaterialCalendar">
    <item name="materialCalendarStyle">@style/Widget.MaterialComponents.MaterialCalendar</item>
    <item name="materialCalendarFullscreenTheme">@style/ThemeOverlay.MaterialComponents.MaterialCalendar.Fullscreen</item>
    <item name="materialCalendarTheme">@style/Widget.MaterialComponents.MaterialCalendar.MonthNavigationButton</item>
    <item name="materialCalendarMonthNavigationButton">@style/Widget.MaterialComponents.MaterialCalendar.MonthNavigationButton</item>
</style>

I'm trying to hide the year option:

It should look more like this:

How can I achieve this. I tried changing the style theme (see above) with no results unfourtantly.

score 0 · Answer 1 · answered Dec 12 '21 at 22:15

You can check this documentation.

As mentioned google documentation code below can fulfill your intent:

<style name="Theme.App" parent="Theme.MaterialComponents.*">
...
<item name="materialCalendarTheme">@style/ThemeOverlay.App.DatePicker</item>
</style>

<style name="ThemeOverlay.App.DatePicker" 
parent="@style/ThemeOverlay.MaterialComponents.MaterialCalendar">
<item name="colorPrimary">@color/shrine_pink_100</item>
<item name="colorOnPrimary">@color/shrine_pink_900</item>
<item name="shapeAppearanceSmallComponent">@style/ShapeAppearance.App.SmallComponent</item>
<item name="shapeAppearanceMediumComponent">@style/ShapeAppearance.App.MediumComponent</item>
<!-- Customize text field of the text input mode. -->
<item name="textInputStyle">@style/Widget.App.TextInputLayout</item>

So you should change your style from MaterialCalendar to DatePicker.

Material DatePicker Disable year option

1 Answers1