dimarts, 16 de febrer del 2016

Estilos y temas (Android)

Un estilo es un conjunto de propiedades que especifican el aspecto y el formato de un View o ventana, un estilo puede especificar propiedades como la altura, color de una fuente... se puede definir con un XML.
Los estilos de android comparten una filosofía similar en las hojas de estilo, permitiendo separar diseño del contenido.
Por ejemplo, podemos transformar:
<TextView
   android:layout_width="fill_parent"
   android:layout_height="wrap_content"
   android:textColor="#00FF00"
   android:typeface="monospace"
   android:text="@string/hello" />

En:

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

Todos los atributos relacionados con los estilos se han retirado del XML del diseño y puestos en una definición de estilo llamada CodeFont, que se aplica a continuación con el atributo style. Un tema es un estilo aplicado a toda una actividad o a una aplicación, en vez de a una única View (como el ejemplo anterior). Cuando se aplica un estilo como un tema, cada vista en la actividad o aplicación tendrán las propiedades del estilo.
Por ejemplo, se peude aplicar el mismo CodeFont estilo como un tema para una actividad y después todo el texto dentro de esta actividad tendrá una fuente senzilla de color verde.
Por lo tanto, se parecen mucho a los css, los hijos heredan los estilos, como tipografia color...
El tema se aplica automaticamente a todos los componentes, en cambio los estilos no. El tema se puede aplicar por actividades o por aplicación, por lo tanto esta definido mediante el android manifest. Si a parte de todo el tema aplicas un estilo, este prevalece.
Para definirlo se hace con un archivo xml que esta en recursos.
el nombre del fichero el que quieras, la raiz es recursos.
Para crear un conjunto de estilos, hace falta dejar un fichero XML en el directorio res/values/ del projecto, con un nombre cualquiera.
Para cada estilo que queramos crear, hará falta añadir un elemento <style> al archivo con un nombre que identifica de forma única el estilo. A continuación, hay que añadir un elemento <item> para cada propiedad de este estilo, con un nombre que declara la propiedad de estilos y un valor para asociar con ella. El valor para el <item> puede ser una cadena de palabras clave, un color hexadecimal, una referencia a otro tipo de recurso o a otro valor en función de la propiedad del estilo.
Por ejemplo:

<?xml version="1.0" encoding="utf-8"?>
<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>Los estilos por programación se pueden modificar. necesitaremos poner un identificador.
Nosotros podemos coger un estilo y como padre coge el textappareance, este ejemplo tenemos item android:textcolor que modificamos el color.

Todos los hijos de <resources> hacen un objeto de recurso de aplicación en tiempo de compilación, se puede hacer referencia por el nombre <style>
El atributo parent al elemento <style> es opcional y especifica la ID del recurso de otro estilo del cual este estilo tiene que heredar propiedades. A continuación puedes anular las propiedades de estilo heredadas si quieres.
Un estilo que se quiere utilizar como una actividad o un tema de aplicación se define en XML exactamente lo mismo para un estilo que para una vista. Un estilo como el que se ha definido antes se puede aplicar como un estilo para una vista única o tema de una actividad o aplicación entera.
Un ejemplo de la herencia de estilos:
<style name="textVerd" parent="@android:style/TextAppearance">
    <item name="android:textColor">#00FF00</item>
</style>
En el caso de heredar de un estilo propio, la sintaxis es algo diferente:
<style name="CodeFont.Rojo">
    <item name="android:textColor">#FF0000</item>
</style>
<style name="CodeFont.Rojo.Gran">
    <item name="android:textSize">30sp</item>
</style>
Permite crear un estilo propio, nombre codefont de tipo rojo, después tenemos un subtipo.
Para aplicar el estilo ponemos style y le aplicamos el código fuente. Si lo queremos hacer para toda la aplicación tiene que ser en nivel de theme, muchos estilos empaquetados definen un tema.
Por lo tanto, hay dos maneras de configurar un estilo:
  • Para vista individual, añadiendo el atributo style a un elemento View al XML por su diseño.
  • Para toda una actividad o aplicación, añadiendo el atributo android:theme al activity o element <application> en el manifest de Android.
<TextView style="@style/CodeFont" android:text="@string/hello" />
<application android:theme="@style/CustomTheme">
<activity android:theme="@android:style/Theme.Dialog">

Android también ofrece otros recursos incorporados, hay muchos temas predefinidos que se pueden utilizar para evitar escribir tu mismo.

<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>

En este caso, para crear un tema se hereda de un tema existente y se le hace las modificaciones que queremos.


Android, theme.Light es uno claro, con android studio se pueden ver los temas fácilmente, y podemos ver un color que esta predefinido. Los estilos se crean de la misma manera que los estilos de vista pero se usa el color standard.


Ejemplo.

Cap comentari :

Publica un comentari a l'entrada