MaterialDatePicker RTL month pagination buttons

Question

anyone knows how to make the android MaterialDatePicker support RTL including the arrows for month pagination?

you can see that the should be facing the opposite way.. any suggestions how to mirror the arrow buttons?

EDIT:

my custom theme which I declared the View to be RTL:

    <style name="datePickerTheme" parent="@style/ThemeOverlay.MaterialComponents.MaterialCalendar">
        <item name="materialCalendarHeaderTitle">@style/materialCalendarTitle</item>
        <item name="android:layoutDirection">rtl</item>
    </style>

the locale that I am using in my app (hebrew Israel):

        val languageToLoad = "iw_IL"
        val locale = Locale(languageToLoad)
        Locale.setDefault(locale)
        baseContext.resources.configuration.setLocale(locale)

my MaterialDatePicker initialization :

            val datePickerBuilder =
                MaterialDatePicker.Builder.datePicker()
            val constraints = CalendarConstraints.Builder()
                .setValidator(object : CalendarConstraints.DateValidator {
                    override fun describeContents(): Int {
                        return 0
                    }

                    override fun writeToParcel(p0: Parcel?, p1: Int) {

                    }

                    override fun isValid(date: Long): Boolean {
                        //checks if date is more than 3 months
                        if (Calendar.getInstance().timeInMillis - date > 90 * daysInMilli
                            || Calendar.getInstance().timeInMillis < date
                        ) {
                            return false
                        }
                        return true
                    }
                })
            datePickerBuilder
                .setTitleText("החל מתאריך")
                .setTheme(R.style.datePickerTheme)
                .setSelection(MaterialDatePicker.todayInUtcMilliseconds() - 3 * daysInMilli)
                .setCalendarConstraints(constraints.build())
            val datePicker = datePickerBuilder.build()

R.style.datePickerTheme:

    <style name="materialCalendarTitle">
        <item name="android:textSize">18dp</item>
        <item name="android:textColor">@color/white</item>
    </style>

    <style name="datePickerTheme" parent="@style/ThemeOverlay.MaterialComponents.MaterialCalendar">
        <item name="materialCalendarHeaderTitle">@style/materialCalendarTitle</item>
    </style>

MatPag · Answer 1 · 2021-06-09T23:10:08.890

1

Based on my knowledge, this bug has been fixed with this commit which is available updating material library to version 1.3.0-alpha03 and above. I would try updating to at least 1.3.0 if you can.

UPDATE: I've run the material sample app catalog here: https://github.com/material-components/material-components-android

Then I've added this method to programmatically change locale in the MainActivity:

@RequiresApi(api = Build.VERSION_CODES.JELLY_BEAN_MR1)
public static void setLocale(Activity activity, String languageCode) {
    Locale locale = new Locale(languageCode);
    Locale.setDefault(locale);
    Resources resources = activity.getResources();
    Configuration config = resources.getConfiguration();
    config.setLocale(locale);
    resources.updateConfiguration(config, resources.getDisplayMetrics());
}

And used it like this in the onCreate:

//wrapped in build check just to hide warnings
if (Build.VERSION.SDK_INT >= Build.VERSION_CODES.JELLY_BEAN_MR1) {
    setLocale(this, "iw_IL");
}

This was the result when navigating to DatePicker sample page and pressing "launch material date picker".

As you see month arrows are fine so the problem is in your implementation. You should check the sample app to find it or start removing your customizations step by step until it works.

edited Jun 09 '21 at 23:10

answered Jun 09 '21 at 17:31

MatPag

41,742
14
105
114

I just updated to `1.4.0-beta01` but it still looks the same.. what am I missing? how would you make your materialDatePIcker RTL anyway? maybe I am doing it wrong – Yarin Shitrit Jun 09 '21 at 17:46
MaterialDatePicker should use RTL by default based on current locale, without expliciting it in the style. Can you update your answer adding the MaterialDatePicker initialization code and the locale you are using to test it? – MatPag Jun 09 '21 at 19:36
I added those details above, is there anything related there? thanks – Yarin Shitrit Jun 09 '21 at 19:45
I tried replacing my function of Locale changing to yours and the arrows work well, but `resources.updateConfiguration()` is deprecated... any replacement? – Yarin Shitrit Jun 10 '21 at 06:53
There are a lot of alternatives (but not easy ones), check here: https://stackoverflow.com/questions/40221711/android-context-getresources-updateconfiguration-deprecated – MatPag Jun 10 '21 at 08:56
@YarinShitrit don't forget to flag an answer as accepted if it helped you. – MatPag Jun 11 '21 at 09:26

MaterialDatePicker RTL month pagination buttons

1 Answers1