understand styles and themes

android Android

web Web

21-Mar-13 (Created: 21-Mar-13) | More in 'Themes and Styles'

understand styles and themes

satya - Friday, October 28, 2011 9:35:57 PM

theme guide

satya - Wednesday, November 02, 2011 9:10:47 AM

lets start with the basics


<TextView    
  style="@style/CodeFont"    
  android:text="@string/hello" />

satya - Wednesday, November 02, 2011 9:16:16 AM

Define styles then


<resources>    
<style name="CodeFont" parent="@android:style/TextAppearance.Medium">        
  <item name="android:layout_width">fill_parent</item>        
  <item name="android:layout_height">wrap_content</item>        
  <item name="android:textColor">#00FF00</item>        
  <item name="android:typeface">monospace</item>    
</style>
</resources>

satya - Wednesday, November 02, 2011 9:17:11 AM

a style can be applied to a


view,
activity,
or an application

satya - Wednesday, November 02, 2011 9:20:20 AM

another way to inherit your styles


<style name="CodeFont.Red">        
  <item name="android:textColor">#FF0000</item>    
</style>

satya - Wednesday, November 02, 2011 9:21:36 AM

Well you can do this only for your styles

This technique for inheritance by chaining together names only works for styles defined by your own resources. You can't inherit Android built-in styles this way. To reference a built-in style, such as TextAppearance, you must use the parent attribute.

satya - Wednesday, November 02, 2011 9:22:45 AM

Look for a class definition to see its styles: because they are object properties

The best place to find properties that apply to a specific View is the corresponding class reference

satya - Wednesday, November 02, 2011 9:27:53 AM

All style properties are available in R.attr

Note that this is a large web page. It may take a minute to load on a fast connection.

satya - Wednesday, November 02, 2011 9:28:26 AM

selective memory

if you apply a style to a View that does not support all of the style properties, the View will apply only those properties that are supported and simply ignore the others.

satya - Wednesday, November 02, 2011 9:29:28 AM

How to style background windows

Some style properties, however, are not supported by any View element and can only be applied as a theme. These style properties apply to the entire window and not to any type of View. For example, style properties for a theme can hide the application title, hide the status bar, or change the window's background. These kind of style properties do not belong to any View object. To discover these theme-only style properties, look at the R.attr reference for attributes that begin with window. For instance, windowNoTitle and windowBackground are style properties that are effective only when the style is applied as a theme to an Activity or application. See the next section for information about applying a style as a theme.

satya - Wednesday, November 02, 2011 9:30:38 AM

view styles are not inherited from viewgroup

If a style is applied to a ViewGroup, the child View elements will not inherit the style properties

satya - Wednesday, November 02, 2011 9:32:05 AM

applying a theme


<application android:theme="@style/CustomTheme">
or
<activity android:theme="@android:style/Theme.Dialog">

satya - Wednesday, November 02, 2011 9:33:45 AM

Custom theme


<color name="custom_theme_color">#b0b0ff</color>

<style name="CustomTheme" parent="android:Theme.Light">    

  <item name="android:windowBackground">@color/custom_theme_color</item> 
  <item name="android:colorBackground">@color/custom_theme_color</item>
</style>

annonymous - Wednesday, November 02, 2011 9:34:34 AM

So a theme is same as a style definition

When applied to an activity or application it becomes a theme. is that right??

annonymous - Wednesday, November 02, 2011 9:38:20 AM

R.styleable.theme

Satya - Wednesday, November 02, 2011 9:41:34 AM

Here is a clue to find out what themes are available: R.style

Here is a clue to find out what themes are available

Because themes are essentially resources of type "style" you should be able to look up docs for R.style and discover what is supported.

To use the styles listed here, replace all underscores in the style name with a period. For example, you can apply the Theme_NoTitleBar theme with "@android:style/Theme.NoTitleBar".

Satya - Wednesday, November 02, 2011 9:44:19 AM

In what XML file are android styles defined: styles.xml

This is a direct link to the android source code. You can use this pattern to your advantage to look up source code for other files as well.

Satya - Wednesday, November 02, 2011 9:44:47 AM

Apparently there is a themes.xml as well

See a local copy here as the android git location has changed.

satya - Wednesday, November 02, 2011 9:52:10 AM

a booboo

looks like the GIT links need some kind of a password to get in. I will post later if I can find a way to get to these files.

satya - Sat May 26 2012 09:19:05 GMT-0400 (Eastern Daylight Time)

I still don't have links to some of these files yet.

I do have them on my local drive as I used "git" to download them. I will try to post a link to online soon.

satya - Sat May 26 2012 09:20:49 GMT-0400 (Eastern Daylight Time)

So how many style/theme related constants I have?


R.attr
R.style
R.styleable

satya - Sat May 26 2012 09:23:12 GMT-0400 (Eastern Daylight Time)

R.style

A collection of named attributes that can be applied to a view, activity, application element. this is how you reuse xml based attributes for different views.

How? instead of indicating color, font, background on every view, your views could say "Hey! just use the evening style" which has certain complementing colors.

satya - Sat May 26 2012 09:31:46 GMT-0400 (Eastern Daylight Time)

So, what is the difference between a style and a styleable?

Search for: So, what is the difference between a style and a styleable?

satya - Sat May 26 2012 09:38:47 GMT-0400 (Eastern Daylight Time)

Before I ask google, let me put what a styleable is

A style is a collection of [attribute] values

A styleable is a collection of attribute names!!

satya - Sat May 26 2012 09:41:16 GMT-0400 (Eastern Daylight Time)

So what is the meaning of R.styleable.Theme??

Well, there is an array in Android's bowels in a file, possibly called, attrs.xml. In this file there is an array of attribute names collected under a namespace called "Theme". The attribute names are also described here as to what their type is. whether each attribute is a string or an int or an enumeration or a reference etc.

satya - Sat May 26 2012 09:49:34 GMT-0400 (Eastern Daylight Time)

A theme is essentially a 'name' for a particular style

satya - Sat May 26 2012 09:50:02 GMT-0400 (Eastern Daylight Time)

BaseTheme.SubTheme.SubberTheme.SubbestTheme :)

satya - Sat May 26 2012 10:28:45 GMT-0400 (Eastern Daylight Time)

You can checkout the themes that are defined in android: R.style namepace

satya - Sat May 26 2012 10:33:55 GMT-0400 (Eastern Daylight Time)

what is the difference between R.style.Theme and R.styleable.Theme

The former R.style.Theme is a base theme that defines values for all of the properties. R.styleable.Theme is just a list of attributes that could be themed.

quite likely, if one wants to know what attributes are set by R.style.theme, you can look them up using R.styleable.Theme namespace.

satya - Sat May 26 2012 10:41:31 GMT-0400 (Eastern Daylight Time)

what is one of the uses of R.styleable namespace?

Because this is a catalogue of all the attributes, all the components of Android may look for in their xml definitions, one could quickly look at the expected XML attributes and their types.

you can possible get to the same (close) information by looking at their corresponding class definitions.

satya - Sat May 26 2012 10:42:03 GMT-0400 (Eastern Daylight Time)

What is the difference between CSS like styling and Android styling?

Search for: What is the difference between CSS like styling and Android styling?

satya - Sat May 26 2012 10:48:20 GMT-0400 (Eastern Daylight Time)

An example of styles.xml from api samples


<?xml version="1.0" encoding="utf-8"?>
<!-- Copyright (C) 2007 The Android Open Source Project

     Licensed under the Apache License, Version 2.0 (the "License");
     you may not use this file except in compliance with the License.
     You may obtain a copy of the License at
  
          http://www.apache.org/licenses/LICENSE-2.0
  
     Unless required by applicable law or agreed to in writing, software
     distributed under the License is distributed on an "AS IS" BASIS,
     WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
     See the License for the specific language governing permissions and
     limitations under the License.
-->

<resources>
    <!-- A custom theme that is a variation on the light them with a different
         background color. -->
    <color name="custom_theme_color">#b0b0ff</color>
    <style name="CustomTheme" parent="android:Theme.Light">
        <item name="android:windowBackground">@color/custom_theme_color</item>
        <item name="android:colorBackground">@color/custom_theme_color</item>
    </style>

    <!-- This is a theme that will adjust itself depending on the API version.
         The default definition is the safe one, using a theme that has always
         been defined.  Look at values-11/styles.xml for a variation that is
         selected when the holographic theme is available. -->
    <style name="ThemeHolo" parent="android:Theme">
    </style>

    <!-- Base application theme is the default theme. -->
    <style name="Theme" parent="android:Theme">
    </style>

    <!-- Base application theme is the default theme. -->
    <style name="BadTheme" parent="@android:style/Theme.Holo.Light.NoActionBar">
    </style>

    <!-- Variation on our application theme that forces a plain
        text style. -->
    <style name="Theme.PlainText">
        <item name="android:textAppearance">@style/TextAppearance.Theme.PlainText</item>
    </style>

    <!-- Variation on our application theme that has a black
         background. -->
    <style name="Theme.Black">
        <item name="android:windowBackground">@drawable/screen_background_black</item>
    </style>

    <!-- A theme for a custom dialog appearance.  Here we use an ugly
         custom frame. -->
    <style name="Theme.CustomDialog" parent="android:style/Theme.Dialog">
        <item name="android:windowBackground">@drawable/filled_box</item>
    </style>

    <!-- A theme that has a wallpaper background.  Here we explicitly specify
         that this theme is to inherit from the system's wallpaper theme,
         which sets up various attributes correctly. -->
    <style name="Theme.Wallpaper" parent="android:style/Theme.Wallpaper">
        <item name="android:colorForeground">#fff</item>
    </style>

    <!-- A theme that has a translucent background.  Here we explicitly specify
         that this theme is to inherit from the system's translucent theme,
         which sets up various attributes correctly. -->
    <style name="Theme.Translucent" parent="android:style/Theme.Translucent">
        <item name="android:windowBackground">@drawable/translucent_background</item>
        <item name="android:windowNoTitle">true</item>
        <item name="android:colorForeground">#fff</item>
    </style>

    <!-- Variation on our application theme that has a transparent
         background; this example completely removes the background,
         allowing the activity to decide how to composite.  Also here we
         force the translucency ourself rather than making use of the built-in
         translucent theme. -->
    <style name="Theme.Transparent">
        <item name="android:windowIsTranslucent">true</item>
        <item name="android:windowAnimationStyle">@android:style/Animation.Translucent</item>
        <item name="android:windowBackground">@drawable/transparent_background</item>
        <item name="android:windowNoTitle">true</item>
        <item name="android:colorForeground">#fff</item>
    </style>
    
    <!-- Older platforms don't have Theme.Holo.DialogWhenLarge; we will define
         our own wrapper theme that uses it only when running on the appropriate
         platform version.  On older platforms, we always use the generic
         fullscreen theme, because they don't support some feature that help
         in correctly laying out an activity as a dialog. -->
    <style name="ThemeDialogWhenLarge" parent="android:style/Theme">
    </style>

    <style name="TextAppearance.Theme.PlainText" parent="android:TextAppearance.Theme">
        <item name="android:textStyle">normal</item>
    </style>

    <style name="ImageView120dpi">
        <item name="android:src">@drawable/stylogo120dpi</item>
        <item name="android:layout_width">wrap_content</item>
        <item name="android:layout_height">wrap_content</item>
    </style>

    <style name="ImageView160dpi">
        <item name="android:src">@drawable/stylogo160dpi</item>
        <item name="android:layout_width">wrap_content</item>
        <item name="android:layout_height">wrap_content</item>
    </style>

    <style name="ImageView240dpi">
        <item name="android:src">@drawable/stylogo240dpi</item>
        <item name="android:layout_width">wrap_content</item>
        <item name="android:layout_height">wrap_content</item>
    </style>
</resources>

satya - Sat May 26 2012 10:49:12 GMT-0400 (Eastern Daylight Time)

an example of attrs.xml from api samples


<?xml version="1.0" encoding="utf-8"?>
<resources>
    <!-- These are the attributes that we want to retrieve from the theme
         in app/PreferencesFromCode.java -->
    <declare-styleable name="TogglePrefAttrs">
        <attr name="android:preferenceLayoutChild" />
    </declare-styleable>
    
    <!-- These are the attributes that we want to retrieve from the theme
         in view/Gallery1.java -->
    <declare-styleable name="Gallery1">
        <attr name="android:galleryItemBackground" />
    </declare-styleable>
    
     <declare-styleable name="LabelView">
        <attr name="text" format="string" />
        <attr name="textColor" format="color" />
        <attr name="textSize" format="dimension" />
    </declare-styleable>

    <!-- These are attributes used with 'DraggableDot' drawables in
         view/DragAndDropActivity.java and view/DraggableDot.java -->
    <declare-styleable name="DraggableDot">
        <attr name="radius" format="dimension" />
        <attr name="legend" format="string" />
        <attr name="anr">
            <enum name="none" value="0" />
            <enum name="thumbnail" value="1" />
            <enum name="drop" value="2" />
        </attr>
    </declare-styleable>

    <!-- These are the attributes that we want to retrieve for
         app/FragmentArguments.java -->

    <declare-styleable name="FragmentArguments">
        <attr name="android:label" />
    </declare-styleable>

</resources>

satya - Sat May 26 2012 10:49:38 GMT-0400 (Eastern Daylight Time)

The declare-styleable turns into R.styleable namespace

satya - Sat May 26 2012 10:53:13 GMT-0400 (Eastern Daylight Time)

Understand styleables and R.styleable name space

satya - Sat May 26 2012 12:33:45 GMT-0400 (Eastern Daylight Time)

So what is defined where, one more time?


styles are defined in styles.xml
general attributes are defined in attrs.xml
styleables are also defined in attrs.xml

satya - Sat May 26 2012 12:34:11 GMT-0400 (Eastern Daylight Time)

Hey! did you not forget themes??


well themes are styles. so look in styles.xml

satya - Sat May 26 2012 21:18:52 GMT-0400 (Eastern Daylight Time)

the use of '?' mark in android layouts


<EditText id="text"    
  android:layout_width="fill_parent"    
  android:layout_height="wrap_content"    
  android:textColor="?android:textColorSecondary"
  android:text="@string/hello_world" />

The "?" is used to say pick the value from the current theme that is in use.

satya - Sat May 26 2012 23:56:01 GMT-0400 (Eastern Daylight Time)

Here is an example of theme on an activity from api samples


<activity android:name=".app.DialogActivity"
                android:label="@string/activity_dialog"
                android:theme="@android:style/Theme.Holo.Dialog">

The style for this dialog is coming from android package.

satya - Sat May 26 2012 23:56:28 GMT-0400 (Eastern Daylight Time)

Here is a local style


<activity android:name=".app.CustomDialogActivity"
                android:label="@string/activity_custom_dialog"
                android:theme="@style/Theme.CustomDialog">

satya - Sat May 26 2012 23:58:28 GMT-0400 (Eastern Daylight Time)

Here is how the local theme is set in the local styles.xml


<!-- Base application theme is the default theme. -->
    <style name="Theme" parent="android:Theme">
    </style>

satya - Sat May 26 2012 23:59:13 GMT-0400 (Eastern Daylight Time)

Look at the styles.xml above for a quick reference

satya - Wed May 30 2012 12:03:57 GMT-0400 (Eastern Daylight Time)

How is R.styleable.Theme used?

Search for: How is R.styleable.Theme used?

satya - Wed May 30 2012 12:05:39 GMT-0400 (Eastern Daylight Time)

Here is one use in ContactListItemView.java


TypedArray
a = getContext().obtainStyledAttributes(android.R.styleable.Theme);

mSecondaryTextColor = a.getColorStateList(android.R.styleable.Theme_textColorSecondary);

a.recycle();

satya - Wed May 30 2012 12:07:41 GMT-0400 (Eastern Daylight Time)

Here is another example: PhoneWindow.java


void setStyle(Context context) {
    TypedArray a = context.obtainStyledAttributes(com.android.internal.R.styleable.Theme);
    background = a.getResourceId(
            com.android.internal.R.styleable.Theme_panelBackground, 0);
    fullBackground = a.getResourceId(
            com.android.internal.R.styleable.Theme_panelFullBackground, 0);
    windowAnimations = a.getResourceId(
            com.android.internal.R.styleable.Theme_windowAnimationStyle, 0);
    isCompact = a.getBoolean(
            com.android.internal.R.styleable.Theme_panelMenuIsCompact, false);
    listPresenterTheme = a.getResourceId(
            com.android.internal.R.styleable.Theme_panelMenuListTheme,
            com.android.internal.R.style.Theme_ExpandedMenu);
    a.recycle();
}

satya - Wed May 30 2012 12:16:15 GMT-0400 (Eastern Daylight Time)

Take a look at the /res/values/themes.xml again

satya - Wed May 30 2012 12:16:52 GMT-0400 (Eastern Daylight Time)

Couple of highlights. At top it says


<!-- The default system theme. This is the theme used for activities
         that have not explicitly set their own theme.
         
         <p>You can count on this being a dark
         background with light text on top, but should try to make no
         other assumptions about its appearance. In particular, the text
         inside of widgets using this theme may be completely different,
         with the widget container being a light color and the text on top
         of it a dark color.
    -->

satya - Wed May 30 2012 12:21:08 GMT-0400 (Eastern Daylight Time)

themes_device_defaults.xml

Search for: themes_device_defaults.xml

satya - Wed May 30 2012 12:24:00 GMT-0400 (Eastern Daylight Time)

This file says

This file contains the themes that are the Device Defaults. If you want to edit themes to skin your device, do it here. We recommend that you do not edit themes.xml and instead edit this file.

Editing this file instead of themes.xml will greatly simplify merges for future platform versions and CTS compliance will be easier.

satya - Wed May 30 2012 12:26:58 GMT-0400 (Eastern Daylight Time)

Instructions on the Holo theme

New Honeycomb holographic theme. Dark version. The widgets in the holographic theme are translucent on their brackground, so applications must ensure that any background they use with this theme is itself dark; otherwise, it will be difficult to see the widgets. The new UI style also includes a full action bar by default.

Styles used by the Holo theme are named using the convention Type.Holo.Etc. (For example, Widget.Holo.Button, TextAppearance.Holo.Widget.PopupMenu.Large.) Specific resources used by Holo are named using the convention @type/foo_bar_baz_holo with trailing _dark or _light specifiers if they are not shared between both light and dark versions of the theme.

satya - Wed May 30 2012 12:28:05 GMT-0400 (Eastern Daylight Time)

quick peek at Holo theme in themes.xml


<style name="Theme.Holo">
        <item name="colorForeground">@android:color/bright_foreground_holo_dark</item>
        <item name="colorForegroundInverse">@android:color/bright_foreground_inverse_holo_dark</item>

satya - Wed May 30 2012 12:28:30 GMT-0400 (Eastern Daylight Time)

If themes are in themes.xml what is in styles.xml??

satya - Wed May 30 2012 12:36:52 GMT-0400 (Eastern Daylight Time)

So what is in styles.xml

It appears that styles.xml defines modular styles that are reused by themes.xml.

satya - Wed May 30 2012 12:37:19 GMT-0400 (Eastern Daylight Time)

At the top of styles.xml it says

The Holo themes must not be modified in order to pass CTS. Many related themes and styles depend on other values defined in this file. If you would like to provide custom themes and styles for your device, please see styles_device_defaults.xml.

satya - Wed May 30 2012 12:37:43 GMT-0400 (Eastern Daylight Time)

So you have: styles_device_defaults.xml as well

satya - Wed May 30 2012 12:38:24 GMT-0400 (Eastern Daylight Time)

In short we have located now


themes.xml
themes_device_defaults.xml
styles.xml
styles_device_defaults.xml

satya - Wed May 30 2012 12:41:44 GMT-0400 (Eastern Daylight Time)

So where are styleables defined fro style based attribtues??


In /core/res/values/attrs.xml

satya - Wed May 30 2012 12:45:27 GMT-0400 (Eastern Daylight Time)

A key observation

Although a style gathers many attributes together, there is no styleable declared at each style level!! instead there is a single styleable that aggregates all names for style attributes. It is called


R.styleable.Theme

You can see this definition in /core/res/values/attrs.xml

satya - Wed May 30 2012 13:02:32 GMT-0400 (Eastern Daylight Time)

You can access the relevant files here

I have copied the following files from the android 4.0 source distribution for quick reference.

styles.xml
themes.xml
device default styles.xml
device default themes.xml

satya - Wed May 30 2012 15:25:22 GMT-0400 (Eastern Daylight Time)

working with android theme

Search for: working with android theme

satya - Wed May 30 2012 15:26:58 GMT-0400 (Eastern Daylight Time)

Here is a nice article from androidengineer.com

satya - Wed May 30 2012 22:43:14 GMT-0400 (Eastern Daylight Time)

Start by inheriting from the base android theme


<style name="MyTheme" parent="android:Theme">
  <item name="android:some-attribute-name" value="some-value"/>
  <item name="MyCustomAttribute" value="some-value"/>
</style>

satya - Wed May 30 2012 22:49:21 GMT-0400 (Eastern Daylight Time)

To be a citizen of a style it has to be a defined attribute

A style is a collection of attributes. The attributes may belong to all kinds of views or other components. Example is a text view, or a list view or a window for that matter.

So in sense a style is a pretty open ended collection of attributes, as long as they are attributes.

This "requirement" forces you to define your custom attributes in your attrs.xml to start with.

satya - Wed May 30 2012 22:51:49 GMT-0400 (Eastern Daylight Time)

If I dont have a custom view why do I need a custom attribute?

Usually a custom attribute or attributes are defined so that you can use them to alter the behavior of your own custom views. So if you don't have a custom view why do you ever need to define a custom attribute?

what component will recognize it??

satya - Wed May 30 2012 23:00:32 GMT-0400 (Eastern Daylight Time)

Apparently you can do this


<attr name="MyColor" format="color"/>
<style name="mystyle">
   <item name="MyColor" value="@color/red"/>
</style>

<TextView
   android:color="?MyColor"/>

This is a pattern where we give a symbolic name for a value and reuse that name in a number of places through the "?" format

satya - Wed May 30 2012 23:09:10 GMT-0400 (Eastern Daylight Time)

You can apply theme dynamically to an activity in its oncreate method

before setting the view.

satya - Wed May 30 2012 23:25:46 GMT-0400 (Eastern Daylight Time)

A theme applied to your application or activity cascades but not the one applied to a viewgroup

satya - Fri Jun 01 2012 15:05:48 GMT-0400 (Eastern Daylight Time)

Android Style/Theme Predicates

1. Objects have attributes (ex: TextView)

2. You can declare attributes for an object in xml files (ex: layouts)

3. attributes need to be declared through "attr" tag in the values sub directory.

4. attributes are usually declared in /res/values/attrs.xml

5. an attribute definition has a name and a format (like boolean, string etc)

6. Attribute formats can be combined (Ex: reference|color)

7. A style is a collection of an arbitrary set of attributes that may pertain to more than on type of object.

8. A style contains values for set of attributes

9. A style has a name

10. An object can subscribe to a style using its name and a special object attribute called "style" (ex: style="@style/mystyle")

11. Many objects can subscribe to the same style

12. When an activity or an application subscribe to a style it is called a theme.

13. A style applied to a view group doesn't descend the hieararchy

14. A style applied to an activity does descend to the views that the activity holds. Same is true when that theme is applied to the application as a whole.

15. A style is defined through a value tag called "style"

16. Styles are usually defined in /res/values/styles.xml

17. When you intend to apply styles at an activity or application level, then one can use /res/values/themes.xml instead.

18. A style can have a parent theme.

19. A parent theme (when it is an android parent theme) is indicated through a "parent" attribute on a style element

20. A parent theme in your own package uses a dot structure to indicate parentage (ex: BaseTheme.SpecialTheme)

21. You should start your own theme by first inheriting the base android theme

22. You should see a copy of android themes.xml and styles.xml to know how to specialize the portions that you need

23. If you define your own custom attributes for custom objects you can include them in your specialized theme

25. You can dynamically set a theme for your activity in the oncreate callback prior to setting the view for that activity

26. It is entirely possible to define an attribute and specify a value for it (in a style spec) and refer to that value by its attribute name using a "?" mark.

27. The value of an attribute can use a "?" to de-reference another value's attribute (ex: attrib1="?attrib2" Use the value of attrib2 as the value of attrib1)

28. while a style is a collection of attribute values, a styleable is a collection of attribute names/definitions/types. Styleables are defined in attrs.xml as they are closely related to attributes.

29. Styleables don't play a big role in XML definitions

30. Styleables are useful in Java code and used by objects to read a set of attributes that those objects care about

31. TypedArray is used in conjunction with styleables to read a set of attributes pertaining to a custom component

32. Context.obtainStyledAttribues() is used in conjunction with TypedArray and styleables

33. Attributes are represented by R.attr.*

34. Styles and themes are represented by R.style.*

35. Styleable grouping are represented by R.styleable.* and R.styleable.group_attribute1, R.styleable.group_attribute2 etc.

36. The keys files to understand styles are attrs.xml, styles.xml, and possibly themes.xml if present.

satya - 3/17/2013 2:08:24 PM

textAppearance is defined in styles.xml

satya - 3/17/2013 2:13:34 PM

Few more notes


All valid Attributes are defined in attrs.xml
  this is the total domain of attributes
A style is a collection of attribute values
  values can come from values.xml
  value for an attribute can be another style
  so a value of one attribute can be a collection of attribute values
A theme is just a style with a LOT more collection of related attributes

satya - 3/19/2013 3:25:35 PM

Few known themes


Theme (original android)
  dark
  light
Holo (Honeycomb)
  dark
  light

satya - 3/19/2013 3:29:22 PM

Names of these themes


Theme
Theme.light
Theme.Holo
Theme.Holo.light

satya - 3/19/2013 3:29:37 PM

Holo is not available on 2.3 or below

satya - 3/19/2013 3:39:13 PM

Use R.styleable.theme to see the avaiable attributes to theme

See the link on top right of this page.

satya - 3/19/2013 3:43:50 PM

You can swap between different themes

using the same technique of resource swapping

satya - 3/19/2013 3:48:51 PM

Here is one explanation for how a textAppearance differs from text style

When applying styles that only modify a View?s text properties the style is applied via the Text Appearance property (XML attribute android:textAppearance). Styles that modify non-text properties are applied via the style property.

satya - 3/19/2013 3:49:16 PM

This is taken from the link here

satya - 3/19/2013 4:11:53 PM

Your best bet to know what are the attributes a theme defines see the attrs.xml

satya - 3/19/2013 4:30:39 PM

textColorTertiary

Search for: textColorTertiary

satya - 3/20/2013 11:41:31 AM

one aspect of attribtues, styles, and themes

satya - 3/21/2013 10:29:58 AM

Read Theme.java to understand the order of getting attributes

satya - 3/21/2013 10:31:04 AM

Summary here

Any attribute values in the given AttributeSet.

The style resource specified in the AttributeSet (named "style").

The default style specified by defStyleAttr and defStyleRes

The base values in this theme.

Each of these inputs is considered in-order, with the first listed taking precedence over the following ones.

satya - 3/21/2013 10:32:13 AM

Are there any attributes in base attrs.xml that are outside any styleables?

satya - 3/21/2013 10:35:24 AM

Yes. see the attrs.xml to realize the following


there are a whole bunch of attributes that are under theme.
Although theme is a styleable it doesnt belong to any one component.
There are things like
  textSize
  textColor
etc that are outside of all styleables
Then you have custom objects like
  window
  alertdialog 
  etc.

satya - 3/21/2013 10:39:30 AM

Also realize this: there are styleables for


View
...its inherited clases such as
AbsListView
TextView
etc..

The implication may be, the ADT tool can looking at the type hierarchy locate the total set of allowed attributes for a given control in the layout files!!! May be.

satya - 3/21/2013 1:04:54 PM

Question mark (?) in XML attributes for Android

Search for: Question mark (?) in XML attributes for Android

satya - 3/21/2013 1:05:26 PM

Above topic at At SOF

At SOF

satya - 3/21/2013 1:06:19 PM

This is the link I am looking for from android dev guide

satya - 3/21/2013 1:14:38 PM

Notice how TextView reuses other attributes in its styleable definition


<declare-styleable name="TextView">
    <attr name="bufferType">
      <enum name="normal" value="0"/>
      <enum name="spannable" value="1"/>
      <enum name="editable" value="2"/>
    </attr>
    <attr name="text" format="string" localization="suggested"/>
    <attr name="hint" format="string"/>
    <attr name="textColor"/>
    <attr name="textColorHighlight"/>
    <attr name="textColorHint"/>
    <attr name="textAppearance"/>
    <attr name="textSize"/>
    <attr name="textScaleX" format="float"/>
...
</declare-styleable>

Notice how this styleable reuses number of common attributes such as textColor, textSize etc while newly defining things like textScaleX

satya - 3/21/2013 1:17:02 PM

Attribues like textSize and textColor are non-themed and non-styleable attributes

meaning they exist in the attrs.xml file outside of any styleable definition including the theme.

satya - 3/21/2013 1:26:21 PM

attrs.xml is a file that contains every attribute and its format

this file is the total of all the possible attributes and their formats. It does not contain values. The values are provided in the values sub directory as style xml node.

satya - 3/21/2013 1:27:50 PM

attrs.xml has three types of attributes


Attribtutes that are grouped for each component: like Button, CheckBox etc.
Attributes that are grouped under a styleable called Theme
Attribtues that are open and global and have no grouping at all

satya - 3/21/2013 1:28:19 PM

Example of open attributes


textSize
textColor
etc.

satya - 3/21/2013 1:28:53 PM

Example of Component attributes


<declare-styleable name="TextView">
    <attr name="bufferType">
      <enum name="normal" value="0"/>
      <enum name="spannable" value="1"/>
      <enum name="editable" value="2"/>
    </attr>
    <attr name="text" format="string" localization="suggested"/>
    <attr name="hint" format="string"/>
    <attr name="textColor"/>
    <attr name="textColorHighlight"/>
    <attr name="textColorHint"/>
    <attr name="textAppearance"/>
    <attr name="textSize"/>
    <attr name="textScaleX" format="float"/>
...
</declare-styleable>

satya - 3/21/2013 1:30:37 PM

Themed attributes can be of two types


Singular Attributes pointing to singular values
  (like textPrimaryColor, textSecondaryColor)
Multi-valued attributes pointing to other styles
  (like buttonStyle, checkBoxStyle etc)

satya - 3/21/2013 1:57:44 PM

Singular Attribute examples from theme.xml


<declare-styleable name="Theme">
   <attr name="colorForeground" format="color"/>
   <attr name="colorForegroundInverse" format="color"/>

Values for these attributes are given in the themes.xml under a style named "Theme".

These attributes will use other resources like @android:color resources.

satya - 3/21/2013 2:00:53 PM

Who reads these singular attributes?

I was thinking that because "Theme" is styleable somewhere in the source code some class is going to be reading these values. But this happens rarely.

then who consumes values for these attributes?

as it turns out these are referenced by the multi-valued style resources used by various custom components like those derived from view or window etc.

So themes.xml gives these values. Then those values are referenced in the styles for various components. Then those components end up using these singular values indirectly through their style specifications.

yes. it is round about.

satya - 3/21/2013 2:03:55 PM

Multi-valued (or styled) theme attributes are a bit spinny

satya - 3/21/2013 2:06:48 PM

Take a look at the TextView styleable above

Clearly this declaration is outside of the "theme" styleable. However the default style to be used by TextView is most likely declared inside the theme as a single attribute.

we will see in a minute. I don't this for sure but I believe it is!

satya - 3/21/2013 2:06:59 PM

There it is


<attr name="spinnerStyle" format="reference"/>
<!--  Default dropdown Spinner style.  -->
<attr name="dropDownSpinnerStyle" format="reference"/>
<!--  Default ActionBar dropdown style.  -->
<attr name="actionDropDownStyle" format="reference"/>
<!--  Default action button style.  -->
<attr name="actionButtonStyle" format="reference"/>
<!--  Default Star style.  -->
<attr name="starStyle" format="reference"/>
<!--  Default TabWidget style.  -->
<attr name="tabWidgetStyle" format="reference"/>
<!--  Default TextView style.  -->
<attr name="textViewStyle" format="reference"/>
<!--  Default WebTextView style.  -->
<attr name="webTextViewStyle" format="reference"/>
<!--  Default WebView style.  -->
<attr name="webViewStyle" format="reference"/>
<!--  Default style for drop down items.  -->
<attr name="dropDownItemStyle" format="reference"/>
<!--  Default style for spinner drop down items.  -->
<attr name="spinnerDropDownItemStyle" format="reference"/>
<!--  Default style for drop down hints.  -->
<attr name="dropDownHintAppearance" format="reference"/>
<!--  Default spinner item style.  -->

satya - 3/21/2013 2:07:37 PM

Specifically isolating textViewStyle


<!--  Default TextView style.  -->
<attr name="textViewStyle" format="reference"/>

satya - 3/21/2013 2:10:10 PM

So here is the whole chain now


a custom object declares its attributes through styleable
the default style name is also an attribute and typically part of theme
the default style name is given a value by the theme.xml
the value given by the theme.xml is a style which is in style.xml
the values in the style.xml for the default style will use attributes
  from the styleable for that component. the values will be borrowed
  from the single attribute values defined by theme.xml

satya - 3/21/2013 2:11:45 PM

Now we know this...

how are singly valued attributes in the theme are utilized.

how the default style names of custom objects are names in the theme and how they indirectly point to the single values (or not and directly hard coded) of the theme or the global attributes outside.

satya - 3/21/2013 2:17:42 PM

In a sense attrs.xml and themes.xml work like confiuration files for Android

Of course you can override and specialize these configuration files based on device and environment and a whole host of things.

other than that they are like apache config files that control its behavior.

but it may take sometime to understand the connection between these configuration files and custom controls.

Although one might think of these as CSS files I seem to draw more parallels to configuration files!!

but again when I know more I might think otherwise.

satya - 3/21/2013 2:18:13 PM

I am hoping to draw a better visualization picture of this and I will soon