Layout es un término de la lengua inglesa que no forma
parte del diccionario de la Real Academia Española (RAE). El concepto puede traducirse como “disposición”
o “plan” y tiene un uso extendido en el ámbito de la tecnología.
La noción de layout suele utilizarse para nombrar al esquema de distribución de los elementos dentro un diseño. Es habitual que un diseñador que se dedica a la
creación de páginas web desarrolle un layout y se lo presente a su cliente
para que éste lo apruebe y decida sobre la distribución de los contenidos.
El
layout, en este sentido, puede ser una especie de plantilla que
presenta tablas o espacios en blanco. La idea es que, a partir del layout, la
página web comience a desarrollarse con sus contenidos específicos. El layout
puede estar compuesto, por ejemplo, por un rectángulo a modo de cabezal y por tres columnas. Dicho esquema es genérico y puede usarse para
desarrollar múltiples sitios web.
Por ejemplo: en el cabezal puede incluirse el encabezado de la página (como el
nombre de una empresa o de una publicación); en la columna de la izquierda, las
secciones del sitio (Quiénes
somos, Qué hacemos, etc.); en la columna del medio se pueden desarrollar de los
contenidos; la columna de la derecha puede destinarse a los anuncios
publicitarios.
VISTAS
Todos los elementos que aparecen en la pantalla
de una aplicación de Android son vistas. Desde los elementos sueltos como
textos o botones, a los contenedores como los grupos de vistas.
Grupos de vistas
- LinearLayout
- Agrupa los elementos en una
sola línea, que puede ser vertical u horizontal.
- RelativeLayout
- Los elementos se disponen
en relación entre ellos y los márgenes. Es la más flexible, y la más
utilizada.
- ScrollView
- Se utiliza para vistas que
no caben en pantalla. Sólo puede contener una vista o grupo de vistas, y
añade automáticamente las barras de desplazamiento.
- TableLayout
- Agrupa los elementos en
filas y columnas. Contiene elementos TableRow, que a su vez contienen los
elementos de cada celda.
- FrameLayout
- Está pensada para contener
una sola vista. Si se añaden más, todas se alinean en la esquina superior
izquierda, solapándose.
- AbsoluteLayout
- Está desaprobado desde la
versión 1.5 de Android. En este contenedor, los elementos se referencian
con coordenadas absolutas partiendo de la esquina superior izquierda. Se
ha desaprobado porque no se adapta a pantallas de diferentes tamaños, que
se popularizaron justamente a partir de Android 1.5.
- EditText
- Contiene un texto editable.
- ImageButton
- Este botón permite mostrar
una imagen en vez de un texto
- ToggleButton
- Botón que puede mantener su
estado de pulsado hasta que se pulsa otra vez.
- CheckBox
- Botón similar a
ToggleButton que funciona como una caja de verificación.
ESTILOS Y
TEMAS
Un estilo es una
colección de propiedades que definen el formato y apariencia que tendrá una
vista. Podemos especificar cosas como tamaño, márgenes, color, fuentes, etc. Un
estilo se define en ficheros XML, diferente al fichero XML Layout
que lo utiliza.
Veamos un ejemplo. El
siguiente código:
1.
<TextView
2. android:layout_width="match_parent"
3. android:layout_height="wrap_content"
4.
android:textColor="#00FF00"
5.
android:typeface="monospace"
6.
android:text="Un texto" />
Es
equivalente a escribir:
1.
<TextView
2.
style="@style/MiEstilo"
3.
android:text="Un texto" />
Habiendo
creado en el fichero res/values/styles.xml con el
siguiente código:
1.
<?xml version="1.0"
encoding="utf-8"?>
2.
<resources>
3.
<style name="MiEstilo"
4.
parent="@android:style/TextAppearance.Medium">
5. <item
name="android:layout_width">match_parent</item>
6. <item
name="android:layout_height">wrap_content</item>
7. <item
name="android:textColor">#00FF00</item>
8. <item
name="android:typeface">monospace</item>
9.
</style>
10.
</resources>
Observa como un estilo puede heredar todas las propiedades de un padre
(parámetro parent) y a partir de estas propiedades realizar modificaciones.
Heredar de un estilo propio
Si vas a heredar de un
estilo definido por ti no es necesario utilizar el atributo parent. Por el contrario, puedes utilizar el mismo nombre
de un estilo ya creado y completar el nombre con un punto más un sufijo.Por
ejemplo:
1.
<style
name="MiEstilo.grande">
2. <item
name="android:textSize">18pt</item>
3.
</style>
Crearía un nuevo estilo que sería igual a MiEstilo más la nueva
propiedad indicada. A su vez puedes definir otro estilo a partir de este:
1.
<style name="MiEstilo.grande.negrita">
2. <item
name="android:textStyle">bold</item>
3.
</style>
Los
temas
Un
tema es un estilo aplicado a toda una actividad o aplicación, en lugar de a una
vista individual. Cada elemento del estilo solo se aplicará a aquellos elementos
donde sea posible. Por ejemplo, CodeFont solo
afectará al texto.
Para
aplicar un tema a toda una aplicación edita el fichero AndroidManifest.xml y
añade el parámetro android:theme en la
etiqueta <application>:
<application android:theme="@style/MiTema">
También puedes aplicar un tema a una actividad en concreto:
<activity android:theme="@style/MiTema">
