Programación Android, Recursos XML II

Share if you like...Share on Facebook0Tweet about this on TwitterShare on Google+0Share on LinkedIn0

android_resources
En esta entrada vamos a continuar con el anterior ejemplo sobre recursos XML, en el que empezamos a definir y utilizar diversos recursos de nuestro proyecto.

El siguiente paso sería crear un estilo para uno de los botones, un shape para el otro, y tendremos que definir las dimensiones de altura y anchura para el tercero.

Empecemos con la parte más sencilla, que en parte ya vimos en la anterior entrada, vamos a definir las dimensiones del botón. Para ello añadiremos los siguientes valores en el archivo dimens.xml:

<dimen name="btn_height">60dp</dimen>
<dimen name="btn_width">150dp</dimen>

Y en el XML de nuestro layout utilizaremos esas dimensiones en las propiedades height y width del botón btnDimens:

android:layout_width="@dimen/btn_width"
android:layout_height="@dimen/btn_height"

De esta manera, veremos que el botón btnDimens habrá aumentado su tamaño, adoptando las medidas que previamente habíamos definido. La ventaja de utilizar este método para definir las dimensiones de un botón (o de cualquier otro componente) es el hecho de que podremos acceder a estas dimensiones en los demás botones de nuestra aplicación, sin tener que recordar el valor exacto que hemos utilizado en cualquier propiedad, por lo que obtendremos una apariencia más homogénea en nuestra aplicación. Otra ventaja, aún más importante, es que si en el futuro queremos variar esas dimensiones no tendremos que estar buscando en todas nuestras vistas dónde tenemos que modificar los valores, pues sólo tendremos que modificar los valores de nuestro archivo dimens.xml.

Definir estilos

Una vez definidas las dimensiones del botón, vamos a definir un estilo para el btnStyle, para ello vamos a ir al archivo styles.xml, que se ha debido crear automáticamente con nuestro proyecto. en él vamos a añadir un nuevo estilo. En principio encontraremos que el archivo contiene algo similar a esto:

<resources xmlns:android="http://schemas.android.com/apk/res/android">

    <!--
        Base application theme, dependent on API level. This theme is replaced
        by AppBaseTheme from res/values-vXX/styles.xml on newer devices.
    -->
    <style name="AppBaseTheme" parent="android:Theme.Light">
        <!--
            Theme customizations available in newer API levels can go in
            res/values-vXX/styles.xml, while customizations related to
            backward-compatibility can go here.
        -->
    </style>

    <!-- Application theme. -->
    <style name="AppTheme" parent="AppBaseTheme">
        <!-- All customizations that are NOT specific to a particular API-level can go here. -->
    </style>

</resources>

Aquí podemos ver el tema que nuestra aplicación está utilizando (que se define en el manifiest.xml), que no es otra cosa que un estilo, al que por defecto se le da el nombre “AppTheme“. También vemos otro estilo que se llama “AppBaseTheme“, y en ambos casos podemos ver que las etiquetas style contienen los atributos parent. Estos atributos lo que indican es la herencia de estos estilos, es decir, el estilo AppTheme hereda de AppBaseTheme, que a su vez ha heredado de android:Theme.Light, que es un tema por defecto de Android.

Esto significa que podemos definir estilos base, sobre los que basar los demás estilos de nuestra aplicación. Por ejemplo, podríamos crear un estilo que defina las dimensiones de nuestros botones, y si en cada Activity de nuestra aplicación queremos definir que el color del botón sea distinto, crearemos un estilo para cada Activity, en el que definiremos el color que queremos que tengan los botones. Pero no tendremos que definir las dimensiones, pues heredaremos de un estilo que ya los define.

En este caso sólo vamos a definir el estilo de un botón, por lo que crearemos un nuevo estilo, y le daremos diferentes valores, en este caso dimensiones, color, y estilo de letra:

    <style name="btnStyle">
        <item name="android:width">100dp</item>
        <item name="android:height">35dp</item>
        <item name="android:background">#33B5E5</item>
    </style>

El valor que estamos dando a cada item afectará al atributo del botón que indica el atributo name de dicho item. En el primer item del estilo podemos ver que el name apunta al atributo android:width, y el valor que tomará será 130dp..

Como podemos ver, en realidad definir los recursos de nuestra aplicación a través de los archivos XML siempre es igual, en un archivo XML escribimos una etiqueta <resources> , y dentro de esta irán los recursos que queremos que contenga el archivo, bien colores, strings, dimensiones, etc.

Ahora sólo nos falta aplicar el estilo que hemos creado, al botón btnStyle, para ello utilizaremos el atributo style del botón, que quedará de la siguiente manera:

<Button
    style="@style/btnStyle"
    android:id="@+id/btnStyle"
    android:layout_width="wrap_content"
    android:layout_height="wrap_content"
    android:layout_below="@+id/btnDimens"
    android:layout_centerHorizontal="true"
    android:layout_marginTop="@dimen/btn_margin_top"
    android:text="@string/btn_style" />

La apariencia de los botones ahora debería ser:
ResourcesMain

En la siguiente entrada definiremos el shape para el botón y se explicará cómo podremos llegar a acceder a estos recursos definidos en XML desde el código Java.

Descargas

Puedes ver el resultado del ejemplo en tu móvil descargando nuestra aplicación desde Google Play.

Share if you like...Share on Facebook0Tweet about this on TwitterShare on Google+0Share on LinkedIn0
The following two tabs change content below.
Reborn as IT Developer. Desarrollador Android y fundador de Proyecto Simio. "En realidad, yo no puedo enseñar nada a nadie, sólo puedo hacerles pensar." - Sócrates.

Deja un comentario