Customizing MaterialTimePicker
I’ve been trying to customize MaterialTimePicker and couldn’t find proper documentation about it. So I decided to make one. I will try to explain as simple as possible.
If you find this blog post, I believe you already know about MaterialTimePicker. That’s why I am not going to explain what it is.
Still want to learn about more; overview documentation.
Get Mithat Sinan Sarı’s stories in your inbox
Join Medium for free to get updates from this writer.
This is what we are going to build. You can find demo app here.
Customizing Clock Face
Name of the attributes are pretty self explanatory;
Customizing Keyboard Icon
This one is a button. You can change tint, ripple, shape and stuff.
Customizing AM/PM Selection
This one is also a button;
Background is a simple selector;
Customizing Title
Simple TextView
Customizing Chip
Pretty much everything is self explanatory. There is one attribute we don’t see too much;
elevationOverlayEnabled: This Boolean is being used to make elevation more noticeable for Dark Mode. For detailed explanation, check here.
Chip background color;
Chip text color;
For EditText border and CANCEL & OK button colors, I had to override colorPrimary attribute. I believe this is kind of bug or something. Couldn’t find better solution for them. Also for EditText color, I had to override textColorPrimary attribute.
For more information; https://material.io/components/time-pickers
