[MaterialDatePicker] Switch-To-Keyboard Input Toggle Icon Background Never Changes (Same as Tint Color)

[dkiktenko]

Description: With the source code provided below, I am not able to set so that the background of the switch-to-keyboard input toggle icon is different from the icon's tint (i.e., outline of the pencil is one color and the fill within the same is a different color)

Expected behavior: Tint applies to the pencil icon's outline color and Background applies to the pencil icon's shape fill color.

NOTE: It may be entirely possible here that I am misunderstanding the purpose of Tint and Background and what I am trying to achieve is simply not possible. If so, please let me know and sincere apologies for wasting time.

Source code:

In a module's styles.xml file, I have the following defined:

<style name="SomeFragmentDatePicker" parent="ThemeOverlay.Material3.MaterialCalendar">
        <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>
        <item name="materialCalendarHeaderToggleButton">@style/SomeFragmentDatePicker.InputTypeIcon</item>
    </style>

    <style name="SomeFragmentDatePicker.InputTypeIcon" parent="@style/Widget.Material3.MaterialCalendar.HeaderToggleButton">
        <item name="android:background">@color/white</item>
        <item name="android:tint">@color/green</item>
    </style>

In my fragment:

  if (datePickerDialog == null) {
      datePickerDialog =
          MaterialDatePicker.Builder.datePicker()
              .setTheme(R.style.SomeFragmentDatePicker)
              .setSelection(MaterialDatePicker.todayInUtcMilliseconds())
              .build();
      datePickerDialog.addOnPositiveButtonClickListener(
          selection -> {
            // TODO
          });
    }
    datePickerDialog.show(getParentFragmentManager(), "SomeFragment");

Android API version: Android API 28 and 33

Material Library version: Material Android Library version 1.8.0

Device: Pixel 4, Pixel 6

[afohrman]

You're correct, using android:background and android:tint won't get you the pencil icon you're describing with different stroke colors and background colors. Android:background is generally used to change the actual drawable that is used for the view, or toggle button in this case, so I think it would just override the actual pencil icon (if it takes effect at all).

I think you can get the look you're describing by setting the icon to a custom VectorDrawable and setting android:fillColor and android:strokeColor, but I'm passing this along to @paulfthomas who is more familiar with date picker who can weigh in and maybe suggest a better approach.