This document discusses styles and themes in Android development. It explains that styles define the format and look of UI elements, and can be applied to individual views or whole activities. Themes are similar to styles but apply formatting to an entire layout or activity. The document provides examples of defining styles and themes in XML files, extending existing styles, and applying themes in the Android manifest. It also covers best practices for style hierarchy and customizing default themes.

1. ANDROID STYLES AND
DESIGNS
Sourabh Sahu

2. STYLES
 A resource that defines format and look for a UI.
 Can be applied to individual entities or to activities as a
whole.
 It is a .XML file.

3. Defining Styles
 The XML file resides under res/values/ directory
of your project and will have <resources> as the
root node which is mandatory for the style file.
 <style> tag is used to define a style.
 Each style is uniquely identified by it’s name.
 Style attributes can be set using the <item> tag.

4. Sample code to create a style
<resources>
<stylename="GreenText"parent="TextAppearance.AppCompat
”>
<item name="android:textColor">#00FF00</item>
</style>
</resources>

5. Extending a Style
 To create your own style, you should always
extend it from the framework or support library.
 This is to maintain compatibility with platform UI
styles.
 Use the ‘parent’ attribute to extend a style.
 You can also inherit styles by extending a style's
name with a dot notation, instead of using
the parent attribute.

6. Sample code to extend an existing style
<style name="GreenText"
parent="@android:style/TextAppearance">
<item name="android:textColor">#00FF00</item>
</style>

7. THEME
 A theme is similar to style, but it is applied to a
layout or an activity as a whole.
 It is applied to child views of each component as
well.
 Use the android:theme attribute on either
the <application>tag or an <activity> tag in
the AndroidManifest.xml file.

8. Sample Code-Applying a theme
<manifest ... >
<application
android:theme="@style/Theme.AppCompat" ... >
</application>
</manifest>

9. Customizing the Default Theme
 By default the theme is defined in
the styles.xml file.
 You may change this as per your desire.
 The colors may be changed from the colors.xml
file under res/values/colors.xml.

10. STYLE HIERARCHY
 While styling an app, you must be mindful of
Android’s style hierarchy.
 Use themes in general, for consistency.
 If you've specified the same attributes in multiple
places, the list below determines which attributes
are ultimately applied.

11. STYLE HIERARCHY
1. Applying character- or paragraph-level styling via
text spans to TextView-derived classes
2. Applying attributes programmatically
3. Applying individual attributes directly to a View
4. Applying a style to a View
5. Default styling
6. Applying a theme to a collection of Views, an
activity, or your entire app
7. Applying certain View-specific styling, such as
setting a TextAppearance on a TextView

12. Changing Styles
<resources>
<style name="AppTheme"
parent="Theme.AppCompat.Light.DarkActionBar">
<item
name="colorPrimary">@color/colorPrimary</item>
<item
name="colorPrimaryDark">@color/colorPrimaryDark
</item>
<item
name="colorAccent">@color/colorAccent</item>
</style>
</resources>

13. Changing Styles
<resources>
<style name="AppTheme"
parent="Theme.AppCompat.Light.NoActionBar"
>
<item
name="colorPrimary">@color/colorPrimary</ite
m>
<item
name="colorPrimaryDark">@color/colorPrimaryD
ark</item>
<item
name="colorAccent">@color/colorAccent</item
>
</style>
</resources>
Used When No Action Bar at the top is
required.

14. Changing Styles
<resources>
<style name="AppTheme"
parent="Theme.AppCompat.Light.Dialog.Alert">
<item
name="colorPrimary">@color/colorPrimary</ite
m>
<item
name="colorPrimaryDark">@color/colorPrimaryD
ark</item>
<item
name="colorAccent">@color/colorAccent</item
>
</style>
</resources>
Used when an Alert Messages is required.

15. Changing Styles
<resources>
<style name="AppTheme"
parent="Theme.AppCompat.Dark.ActionBar">
<item
name="colorPrimary">@color/colorPrimary</ite
m>
<item
name="colorPrimaryDark">@color/colorPrimaryD
ark</item>
<item
name="colorAccent">@color/colorAccent</item
>
</style>
</resources>
Used when a Dark theme is required.

16. Changing Styles
<resources>
<style name="AppTheme"
parent="Theme.AppCompat.Dark.ActionBar">
<item
name="colorPrimary">@color/colorPrimary</ite
m>
<item
name="colorPrimaryDark">@color/colorPrimaryD
ark</item>
<item
name="colorAccent">@color/colorAccent</item
>
</style>
</resources>
Used when a Dark theme is required.

17. Changing Colors
 Colors can be changed using the colors.xml file under res/values.
<resources>
<color name="colorPrimary">#008577</color>
<color name="colorPrimaryDark">#00574B</color>
<color name="colorAccent">#D81B60</color>
</resources>

18. Changing colors of Different Attributes
 Go to corresponding xml code of
the attribute.
 Use android:background or
android:textcolor to change to
desired colors.
 Sample Code
<Button
android:id="@+id/button"
android:background="@color/colorPr
imaryDark"
android:textColor="@color/colorPrim
aryDark” />