Make Dialogs Obey Your Material Theme

Posted by in Software

Material design is nice. Flat, with well determined contrast rules… and most applications I’ve seen look excellent. I wanted my application to loon nice too and it does (well, almost right now :) ).

One thing that is not in line is the dialog style. If you’re here, you know that if you only set up your main theme with your brand colours, they don’t get propagated to the dialog. Instead, you get the default material theme colours (gray + green-ish by default).

There are several solutions, from programmatic changes, to styling, to using a third party library (which looks very nice by the way). I ended up with styling, so without further ado…

In your colors.xml you define your custom colours. for the dialog box, the most important ones are:

  • The background colour (named windowBackgroundColor in my case) and
  • The accent colour (named accentColor)

In your themes.xml, you define your theme:

You notice the last lines where we define a MyDialogTheme style:

Now, your dialog’s backgrounds will be the same as your app’s background. The accent color looks to propagate down :).

My result is:

dialog

Bonus

All the other properties you can change for the dialog are:

To customise, in your MyDialogTheme style, you prepend an “android:” to the name property and put your custom value, like so:

HTH,


A little experiment: If you find this post and ad below useful, please check the ad out :-)