
Applying local styles and global themes
Themes are Android's mechanism for applying a consistent style to an app or activity. A style specifies the visual properties of the elements that make up your user interface, such as color, height, padding, and font size.
How to do it...
- We can create styles for views using the various attributes:
<TextView style="@android:style/TextAppearance.Medium" android:layout_width="match_parent" android:layout_height="wrap_content" android:textColor="#7F3300" android:typeface="monospace" android:gravity="center" android:text="Inline Styles" />
- These styles can be extracted into a separate file so that they can be reused across views, as with string resources. In this case, we inherit from the Android style
TextAppearance.Medium
, but this is not always necessary. Let's take a look at the following code snippet:<?xml version="1.0" encoding="UTF-8"?> <resources> <style name="MyStyle" parent="@android:style/TextAppearance.Medium"> <item name="android:layout_width">match_parent</item> <item name="android:layout_height">wrap_content</item> <item name="android:textColor">#7F3300</item> <item name="android:typeface">monospace</item> <item name="android:gravity">center</item> </style> </resources>
- Using styles in a layout resource is done by using the
style
attribute:<TextView style="@style/MyStyle" android:text="Styled" />
- This can also be done for the actual activities, but in this case, we inherit from an activity style,
Theme.Light
:<?xml version="1.0" encoding="UTF-8"?> <resources> <color name="mycolor">#007F0E</color> <style name="MyTheme" parent="android:Theme.Light"> <item name="android:windowBackground">@color/mycolor </item> <item name="android:colorBackground">@color/mycolor</item> </style> </resources>
How it works...
A style is a collection of properties that specify the look and format for a view or window. A theme is a style applied to an entire activity or application, rather than an individual view.
Note
Styles and themes are saved in the values
resource folder with the .xml
extension.
Styles can be inherited and extended, meaning we can take an existing style and add a few additional attributes and customizations. Inheritance is achieved by using the parent
XML attribute on the <style>
element.
There is also a shortcut for inheriting our own styles by using a special naming system. If we were to create a style named MyStyle.Bigger
, this new style would inherit all the attributes from the MyStyle
style. This only applies to local styles and not Android styles.
Due to inheritance and the ability to have same-name resources in different folders, we can create advanced styling that is based on various device configuration options, such as orientation, screen size, or Android version. For example, we could have a larger padding for larger screens and use new features on newer devices.