post I use eclipse indigo 3.7 for J2EE, if your environment for android development is not yet set in anyway, you may want to deal with that first and then return.
You want to start
creating your own visual effects in android and don’t know how…
You’ve read so many
articles and posts about android themes and styles and the visual picture of
the whole idea is still not that helpful…
You’re comfortable with
android themes and styles but would casually like to find out anything knew to
add to your knowledge…
- what is android theme, style and the difference between
- How do I go about creating themes and styles in
whose values together define the visual representation of an android view. The way
any view or widget looks in andoid is defined in a style.
background, textColor,gravity, layout_length etc.
this but android has various default styles which work for you in the
together define the visual representation of your app or a single activity in
difference between a style and a theme. When you look at our code shortly, you
will see this more clearly.
affects at least an activity or the whole application.
together. It’s more like a parent child relationship but not quite. Because a
style can be applied to any view regardless of whether it belongs to a theme or
not. But a theme is only relevant when it contains styles.
the action and for now just do everything along with me and later, after
getting the fundamentals, you will be able to tweak things around.
project, with name ThemeAndStyle and package com.simplejavan.theme
ThemeAndStyleActivity as default and change the res/layout/main.xml to look
|current project structure
|current screen shot|
defined the same style attributes twice for both the text view and the button. Though
in the button case we changed text color.
apply a style to remove these attributes to a different resource(xml file) so
that our layout xml(main.xml) looks cleaner and secondly we will be able to
share the same resource across different views.
res/values folder and navigate new->android xml or click on it and then
click the android xml icon.
would you like to create”
selected by default since you had earlier focused the mouse on res/values
screen shots for the current main.xml and styles.xml and finally the android
|main.xml with style reference|
|current screen shot|
res/layout/main.xml file has been cleaned up and all style information is
hidden away in res/values/styles.xml.
left the textColor attribute of our custom button still in the layout xml. We shall
eliminate that in the inheritance section below.
idea of cascading style sheets in normal web programming and a typical example
of separation of concerns. We move all style information to it and only leave
attributes applying to the specific view in the layout xml. This gives us
cleaner code and helps in maintenance of our code in case you have to change an
attribute which is referenced in various places.
noticed that instead of defining style information for each view we have shared
style/myTextView across all TextView’s in our app, like wise all the buttons
are sharing style/myButton.
appreciate with our small app, but when developing a non-trivial app, the
number of similar view objects can increase to the hundreds and it’s not good
programming practice to keep defining style attributes for each of them.
basic steps in creating a style for our project. This is how you go about
applying custom style for every view in android, you just have to equip
yourself with the view names and attributes applying to each.
attributes are shared across most views such as layout_height and layout_width
but some are mutually exclusive.
look at another concept called inheritance.
encountered this concept in our object oriented programming. Its more or less
information from another style. Meaning, the child style use all the attributes
of the parent style.
does not explicitly define its own attribute values, a view using it will look
exactly like another which is referencing the parent child.
style has definitions for some attributes, they will override the attribute
values from the parent still retain those not defined explicitly.
Inheritance in android goes in 2 ways;
basic understanding of how style and theme inheritance works in android, we
shall now go back to our code.
the textColor attribute of our custom button from the layout xml and take it to
the styles xml. Keep in mind that the default style button and custom style
button both share all attributes apart from the textColor. This will clear our
minds on inheriting programmer created styles.
into inheriting system styles. Notice that we did not have to define all
attributes for our styles.xml, this is because android uses a certain theme by
default so if you don’t explicitely reference another system theme or your own
theme, android still has a default theme it inherits. So we shall go ahead and
make our myButton style inherit from the parent button style, which resides in
the android system.
you have created yourself, you use the following notations
the parent name delimited by a period.
this child from the layout, use
the styles.xml called
references in the main.xml, this is where we now remove our explicit color
attribute for the custom button style from layout xml and take it to the styles
for our new files and the app.
|styles.xml with inheritance|
|screenshot with inheritance|