Dar formato a un botón en #Android con un Shape Drawable

Mediante un shape podemos darle formato y manejar muchas de las propiedades de un botón. Entre ellas el color de fondo, de los bordes, la redondez de los bordes, el degradado del color de fondo, etc.


Los atributos que puede tener un shape son:

• Corner: te permite manejar la redondez del botón y tiene que ser un entero. El principal atributo es radius, aunque también permite TopLeftRadius, TopRightRadius, BottonLeftRadius y BottonRightRadius. Un ejemplo, si queremos quitar los bordes cuadrados que usa por defecto Android sería:

<corners                     android:radius="1dp" />

• Gradient: maneja el degradado. Tiene muchos atributos, como el ángulo de degradado, el tipo y los colores iniciales y finales. Para conseguir por ejemplo un degradado de arriba a abajo con un color inicial amarillo y color final blanco hacemos algo como sigue:
  

  <gradient
                  android:endColor="@color/blanco"
                  android:startColor="@color/yellow"
                  android:angle="270" />



La anterior imagen muestra el los efectos del corner y el gradient anterior donde blanco es #fffffff y yellow #b4b400

• Size: especificamos el tamaño del shape con width and height. Yo este nunca lo he usado.
• Solid: para indicar un color sólido para rellenar el shape. 
• Stroke: para indicar un tamaño del borde y un color. También podemos configurar si queremos hacer una línea punteada con dashGap y dashWidth. Con el el siguiente código conseguimos lo de la imagen siguiente:

 <stroke
                android:width="3dp"
                android:color="@color/yellow2"
                android:dashGap="5dp"
                android:dashWidth="5dp"
                 />

PORQUE TE LO MERECES!! VISITA LOS MÁS VENDIDOS  DE AMAZON EN MÓVILES

Con esto ya podemos comenzar a implementar nuestros botones con unos colores de fondo la mar de atractivos. Aunque nos falta como asignárselo al botón. Tenemos que crearnos un archivo /res/values/style.xml con el siguiente contenido:

<?xml version="1.0" encoding="utf-8"?>
<resources>
<style name="st_main_button">
    <item name="android:background">@drawable/shape_creditos </item>
</style>
</resources>

Además tenemos que crearnos un archivo con el shape con nombre shape_creditos y dentro todo lo que hemos visto antes. Para asignar el estilo al botón: style="@style/st_main_button" donde st_main_button es el nombre del estilo que hemos creado anteriormente.
Os dejo el código del shape_creditos.xml completo es:

<?xml version="1.0" encoding="utf-8"?>
<selector
    xmlns:android="http://schemas.android.com/apk/res/android">
    <item>       
        <shape>
             <corners
                android:radius="2dp" />
             <gradient   
                android:endColor="@color/blanco"
                android:startColor="@color/yellow2"
                android:angle="270" />
            <stroke
                android:width="3dp"
                android:color="@color/yellow2"
                android:dashGap="5dp"
                android:dashWidth="5dp"
                 />          
            <padding
                android:left="10dp"
                android:top="10dp"
                android:right="10dp"
                android:bottom="10dp" />
        </shape>
    </item>
</selector>

Pues a disfrutar y si te ha gustado compártelo!!
-----------------------------------------------------------------------------------------------------------


LIBRO RECOMENDADO PARA APRENDER ANDROID

Uno de los libros fundamientales y que recomiendo para aprender Android y llegar a hacer aplicaciones profesionales es: Android 2 Application Developement de Reto Meier