Un estilo es una colección de propiedades que especifican que aspecto ha de tener un objeto View o una ventana. Con los estilos podemos definir propiedades como la altura, relleno, color del texto, fondo etc. Los estilos en Android comparten la filosofía de las hojas de estílo en cascada (CSS), permitiendo separar el diseño del contenido.

Como podemos comprobar con este ejemplo, el código queda mucho más límpio usando estilos:



Sin estilos:

<textview android:layout_width="fill_parent" android:layout_height="wrap_content" android:textcolor="#00FF00" android:typeface="monospace" android:text="@string/hello">

Con estilos:

</textview><textview  android:text="@string/hello">

Definiendo estilos

Los estilos se definen en un fichero de recursos distinto al layout, colocado en el directorio /res/values. Éstos ficheros no tienen porqué tener un nombre en concreto, pero por convención se suelen llamar styles.xml ó themes.xml

El nodo raiz de estos archívos debe ser .

Para cada estilo que queramos definir, hay que añadir un elemento ***

y un atributo name para ese estílo (es obligatorio), después, añadiremos un elemento para cada propiedad del estilo, que debe tener obligatoriamente el atributo name que declara la propiedad del estilo y su valor. Los valores para pueden ser una palabra clave, valor hexadecimal, una referencia a un recurso u otro valor dependiendo de la propiedad del estilo. Veamos un ejemplo:


En tiempo de compilación, los elementos se convierten en un recurso que podremos referenciar posteriormente mediante el atributo name del estilo, como vimos en el primer ejemplo (@style/CodeFont).

El atributo parent es opcional y especifica el ID de otro estilo del cual queremos heredar sus propiedades, pudiendo así sobreescribirlas.

Herencia

Como acabamos de ver, el atributo parent sirve para heredar propiedades de otros estilos, podemos heredar tanto de estilos del sistema como de los nuestros propios:

Del sistema:


De nuestros propios estilos:


En este caso, no usamos el atributo parent, ya que estamos usando un estilo propio, también se puede apreciar que podemos heredar cuantas veces queramos, como es el caso de (CodeFont.Red.Big)

Aplicar estilos y temas a la interfaz gráfica

Hay dos formas de aplicar estilos a la UI:

Como vimos al principio, para aplicar un estilo a una View concreta usamos style=”@style/NombreDelEstilo

Para aplicar un tema a una actividad o aplicación usaremos:

<application android:theme="@style/CustomTheme">
</application>

Para aplicarlos sobre actividades, usamos:

<activity android:theme="@android:style/Theme.Dialog">
</activity><activity android:theme="@android:style/Theme.Translucent">
</activity>

En este caso, estos temas ya vienen predefinidos, y se ven así, respectivamente:

A continuación, dejo una captura del ejemplo que he hecho para esta entrada, que se puede descargar desde:

Download “EstilosyTemas” EstilosyTemas.zip – Downloaded 1629 times –

Para saber más acerca de los estilos y temas visite la página oficial: Applying Styles and Themes


Siguiente Tema: Programación Android: Recursos - Introducción

Índice

</textview>