Posted on

Understanding Android Style and Theme


android style and theme

One of the most frustrating parts of Android for me always has been styles. It’s not the attributes, most of them are pretty simple and easy to understand, it’s the enormous number of themes/styles names and some more stuff which I’m covering here

Style

There’s just one XML tag, which is style, it’s just a collection of attributes. It can inherit attributes from parent style and override them.

Now there’s a style attribute for views. By using it you save yourself from writing attributes on that view and maybe reuse that style for other views.

As I said, there’s lot’s of frustrating things about styles, especially for beginners, here’s first: style attribute has no namespace. If you try using android – lint will show you a hint and you’ll get Non-existing attribute during build. Same for app namespace,  but no lint hint in this case

Check explanation here

Theme

You can see theme attribute applied for application tag in manifest, some activities there again and even some views. What does it? Basically it links to the same style xml tag, so it’s using same principle: apply bunch of attributes once.

When you apply theme for application tag in manifest – those style attributes you declared and inherited from parent theme is used for all activities, views. Applying for activity narrows down scope to just this activity and when using for a view group – it applies for this view and all of it’s children.

So OK, if theme is just an XML attribute, then why I used this word when referring to parent style if everything there has just style tag? Style tag has some particular attributes that can’t be used outside of its scope, like colorPrimary/accent etc.

And second explanation is – names come from XML attribute that you use this <style/> with. If you use it with theme attribute – it’s called theme and style if you use with style attribute. I think it’s so messed up with names that it’s even more confusing

Difference

So the difference is style attribute applies for just this view, theme – for this view and all its children.

Now let’s look at the second most frustrating thing with styles for beginners: Toolbar. You can rely on templates pretty well, they generate most styles/themes of what you need, but when you make some changes or try to add Toolbar yourself – it’s good to understand how it works.

I found one of the sources of frustration is that there’s huge number of parents when you try to dig into the actual declaration of styles for parent theme of something like Theme.AppCompat.Light.DarkActionBar. But you can view theme overview with Ctrl + Q.

And with that theme if you just add Toolbar view – text will be black. That’s because text color is black for this theme and TextView is added inside Toolbar when you call

Without understanding how theme attribute works and that there’s a TextView inside of Toolbar you can put yourself into lot’s of pain. You can ether try to use android:textColor on Toolbar which is ignored or apply ThemeOverlay.AppCompat.Dark.ActionBar with style attribute instead of theme.

I definitely remember doing this and not understanding why things didn’t work. Also there’s could be some issues with coloring home Toolbar icons and more. But understanding stuff mentioned above it should be easier to fix it

So as you see there’s nothing that complicated in here. But with stuff that’s not clear at first time you just need to go through every confusing stuff and figure out why it’s this way. Check a cool post about layout building tricks and styles vs themes in more depth here