Curso de Android | Estilos en una aplicación

Por 9.99€ al mes tendrás acceso completo a todos los cursos. Sin matrícula ni permanencia.

Ejercicio – Cambiar dinámicamente el color o la imagen de fondo de un layout

LinearLayout milayout= findViewById(R.id.miLayout); 
milayout.setBackgroundColor(Color.rgb(151, 19, 19)); 

Ejercicio – Poner un degradado a un layout

res/drawable/degradado.xml
En el .java
View mlayout = findViewById(R.id.main_layout);
mlayout.setBackgroundResource(R.drawable.degradado);

Ejercicio: Maquetar un botón

res/drawable/rect.xml

<?xml version="1.0" encoding="utf-8"?>
<shape xmlns:android="http://schemas.android.com/apk/res/android"
	android:shape="rectangle">
	<gradient
		android:startColor="#FFFF0000"
		android:endColor="#80FF00FF"
		android:angle="45"/>
	<!--  Este es el padding para colocar el texto -->
	<padding
		android:left="7dp"
		android:top="7dp"
		android:right="7dp"
		android:bottom="7dp" />		
	<corners android:radius="10dp" />
</shape>
main.xml
<Button android:text="Button"
 android:id="@+id/button1"
 android:layout_width="wrap_content"
 android:layout_height="wrap_content"
 android:background="@drawable/rect" />
<Button android:text="Button"
 android:id="@+id/button1"
 android:layout_width="wrap_content"
 android:layout_height="wrap_content" 
 android:background="@drawable/rect" />

Ejercicio; usar colores predefinidos

res/layout/main.xml
<TextView  
    android:layout_width="fill_parent" 
    android:layout_height="wrap_content" 
    android:text="@string/hello"
    android:textSize="30dp"
    android:textColor="@color/red"
    />
res/values/colors.xml (o loquesea.xml)
<?xml version="1.0" encoding="utf-8"?>
<resources>
	<color name="red">#ff0000</color>
	<color name="green">#00ff00</color>
	<color name="blue">#0000ff</color>
</resources>

Ejercicio: Cargar las propiedades de un elemento desde un xml

es/layout/main.xml
<TextView  
    android:layout_width="fill_parent" 
    android:layout_height="wrap_content" 
    android:text="@string/hello" 
    style="@style/code"/>

Creamos el xml:
New → Android XML file → what type of resource would you like to create? → Values

res/values/styles.xml (o loquesea.xml)
<?xml version="1.0" encoding="utf-8"?>
<resources>
	<style name="code" parent="@android:style/TextAppearance">
		<item name="android:textSize">40sp</item>
		<item name="android:typeface">monospace</item>
		<item name="android:textColor">#0000FF</item>
	</style>    
</resources>

Ejercicio: Crear un estilo que sobrescriba el anterior

res/layout/loquesea.xml
<TextView 
    android:text="TextView" 
    android:id="@+id/textView1" 
    style="@style/code.red" 
    android:layout_width="wrap_content" 
    android:layout_height="wrap_content"></TextView>
res/values/styles.xml (o loquesea.xml)
<?xml version="1.0" encoding="utf-8"?>
<resources>
	<style name="code" parent="@android:style/TextAppearance">
			<item name="android:textSize">40sp</item>
			<item name="android:typeface">monospace</item>
			<item name="android:textColor">#0000FF</item>
	</style>
	<style name="code.red">
		<item name="android:textColor">#FF0000</item>
	</style>    
</resources>

Ejercicio Cargar un theme de los que vienen por defecto en android

Para aplicar un theme a toda la aplicación añado la línea en rojo en el AndroidManifest.xml:

<application android:icon="@drawable/icon" android:label="@string/app_name"
android:theme="@style/Base.Theme.AppCompat.Light">

Lo que no hacemos es aplicar el tema en el xml del layout.

No todos los temas son compatibles con todos los activities.

Para aplicarlo a un activity en concreto:

<activity android:name=".AcercaDe"
	android:label="@string/app_name"
	android:theme="@style/Base.Theme.AppCompat.Light"/>

Ejercicio: Cargar mi propio theme

New → Android XML file → what type of resource would you like to create? → Values

<?xml version="1.0" encoding="utf-8"?>
<resources>
    <style parent="@android:style/Theme.Dialog" name="myTheme">
    	<item name="android:textColor">#FF0000</item>
    </style>
</resources>

Cargamos el theme creado por nosotros utilizando el código pintado de rojo en el AndroidManifest.xml:


<application android:icon="@drawable/icon" android:label="@string/app_name"
android:theme="@style/myTheme">

Ejercicio : theme.dialog

Crear un theme que herede de Theme.Dialog y hacer que toda la aplicación lo implemente.

El tema tendrá los siguientes estilos:

android:textColor="#00FF00"
android:typeface="monospace"

Iconos

Recomendaciones sobre cómo hacer los iconos en Android

Por 9.99€ al mes tendrás acceso completo a todos los cursos. Sin matrícula ni permanencia.