How to change dialog Colors of DatePickerDialog/TimePickerDialog when Material Visual is enabled?

KaiEhret

Hi,

i was playing around with David Ortinaus "TheLittleThingsPlayground" to try out the Material Visuals.
What I noticed is, that the DatePickerDialog does not use the colorAccent defined in the styles.xml

<style name="AppCompatDialogStyle" parent="Theme.AppCompat.Light.Dialog">
        <item name="colorAccent">#FF4081</item>
</style>

but just uses black as header color.

When i remove the Visual="Material" property from the ContentPage Tag, the picker that gets opend uses the defined Color.

So how to change the Accent Color for the DatePickerDialog (and TimePicker as well) when the Material Visual is enabled?

Thanks & Cheers

Kai

Jarvan

The Visual property can be set to any type that implements IVisual, with the VisualMarker class providing the following IVisual properties:

• Default – indicates that the view should render using the default renderer.
• MatchParent – indicates that the view should use the same renderer as its direct parent.
• Material – indicates that the view should render using a material renderer.

Check the Tutorial and sample code.
https://docs.microsoft.com/en-us/xamarin/xamarin-forms/user-interface/visual/material-visual
https://docs.microsoft.com/zh-cn/samples/xamarin/xamarin-forms-samples/userinterface-visualdemos/

KaiEhret

Thanks for the Links, but they don't give me any hint on how to customize the color of the DatePickerDialog when using Visual="Material" which I wan't to do to have consistent look of the UI Elements on the Page.

From what I learned via google research it that it should be possible to customize the color of the DatePickerDialog by creating a Style in the styles.xml file in the Android Project but it seems like this style isn't working anymore when using a Material Renderer. I guess the parent property of the style needs to be set to something else but I have no idea to which value...

Jarvan

To set style for datePickerDialogThemes, you should set Visual to Default. Default indicates that the views should render using the default renderer, it'll renderer the view in native style. But for Visual.Material, the views will render material style. The style code set for the views in styles.xml will not be called.

<style name="AppCompatDialogStyle" parent="Theme.AppCompat.Light.Dialog">
        <item name="colorAccent">#FFFF00</item>
</style>

KaiEhret

I understud that I could use Visual="Default" to have the DatePicker using the Style "AppCompatDialogStyle" but in that case i lose the Material Style of the control itself.

I just created an Image to show what I want to Achive

Don't get me wrong. I don't insist on the "style" Tag, I'm just looking for a Way to change the Dialogs AccentColor when using Material Visual.