DISPOSITIVOS MÓVILES: LAYOUTS

PROGRAMACIÓN MULTIMEDIA
Y
DISPOSITIVOS MÓVILES

PROGRAMACIÓN MULTIMEDIA Y DISPOSITIVOS MÓVILES
COMENZANDO A PROGRAMAR
© J.D.CABRERA
COMENZANDO A
PROGRAMAR

© J.D.CABRERA
LA CLASE VIEWGROUPS

© J.D.CABRERA
LAYOUTS

© J.D.CABRERA
LAYOUTS
Son elementos no visuales destinados a controlar la
distribución, posición y dimensiones de los controles
que se insertan en su interior. Estos componentes
extienden a la clase base ViewGroup.

© J.D.CABRERA
FRAMELAYOUTS

© J.D.CABRERA
LAYOUTS: FRAMELAYOUTS
Coloca todos sus controles hijos alineados con su
esquina superior izquierda, de forma que cada control
quedará oculto por el control siguiente

© J.D.CABRERA
<FrameLayout
xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width=“math_parent"
android:layout_height=“math_content“ />
…//…
</FrameLayout>

© J.D.CABRERA
android:layout_height
android:layout_width

© J.D.CABRERA
match_parent: el control hijo tome la dimensión
de su layout contenedor, hay que usar fill_parent
es API’s inferiores

© J.D.CABRERA
“wrap_content”: se utiliza para que el control hijo
tome la dimensión de su contenido.

© J.D.CABRERA
LINEARLAYOUT

© J.D.CABRERA
LAYOUTS: LINEARLAYOUT
Este layout apila uno tras otro todos sus elementos
hijos de forma horizontal o vertical según se
establezca su propiedad android:orientation.

© J.D.CABRERA
<LinearLayout
android:layout_height=“math_content“
android:orientation=“vertical“ />
…//…
</LinearLayout>

© J.D.CABRERA
android:orientation
android:layout_weight
android:layout_height
android:layout_width

© J.D.CABRERA
layout_weight :Esta propiedad nos va a permitir
dar a los elementos contenidos en el layout unas
dimensiones proporcionales entre ellas.

© J.D.CABRERA
layout_weight=1
layout_weight=3
layout_weight=2
layout_weight=1
layout_weight=4
layout_weight=1
layout_weight=1
layout_weight=1
layout_weight=2
layout_weight=2
layout_weight=1

© J.D.CABRERA
TABLELAYOUT

© J.D.CABRERA
LAYOUTS: TABLELAYOUT
Permite distribuir sus elementos hijos de forma
tabular, definiendo las filas y columnas necesarias, y
la posición de cada componente dentro de la tabla.

© J.D.CABRERA
<TableLayout
android:layout_height=“math_content“/>
<TableRow>
<TextView android:text="Celda 1.1" />
</TableRow>
…//…
<TableRow>
<TextView android:text="Celda n.1" />
</TableRow>
</TableLayout>

© J.D.CABRERA
android:layout_margin
android:layout_span
android:collapseColumns
android:shrinkColumns
android:stretchColumns

© J.D.CABRERA
android:stretchColumns: Indicará las columnas
que pueden expandir para absorber el espacio
libre dejado por las demás columnas a la derecha
de la pantalla.

© J.D.CABRERA
android:stretchColumns=“*”
android:stretchColumns=“1,2,3”

© J.D.CABRERA
android:shrinkColumns: Indicará las columnas que
se pueden contraer para dejar espacio al resto de
columnas que se puedan salir por la derecha de la
pantalla.

© J.D.CABRERA
android:shrinkColumns =“*”
android:shrinkColumns =“1,2,3”

© J.D.CABRERA
android:collapseColumns: Indicará las columnas de
la tabla que se quieren ocultar completamente.

© J.D.CABRERA
android:layout_span: posibilita que una celda
determinada pueda ocupar el espacio de varias
columnas de la tabla.

© J.D.CABRERA
android:layout_margin: marca el margen a partir del
cual se distribuirán los objetos que en están
contenidos en el Layout

© J.D.CABRERA
GRIDLAYOUT

© J.D.CABRERA
LAYOUTS: GRIDLAYOUT
incluido a partir de la API 14 (Android 4.0), simila al
TableLayout, utiliza un interfaz de forma tabular,
distribuidos en filas y columnas.

© J.D.CABRERA
LAYOUTS: GRIDLAYOUT
A diferencia del TableLayout indicaremos el número
de filas y columnas como propiedades del layout,
mediante android:rowCount y android:columnCount.

© J.D.CABRERA
<GridLayout
android:rowCount="2"
android:columnCount="3"
android:orientation="horizontal” >
…//…
</GridLayout t>
LAYOUTS: GRIDLAYOUT

© J.D.CABRERA
android:layout_column
android:layout_row
android:layout_columnSpan
android:layout_rowSpan
android:orientation
android:columnCount
android:rowCount
LAYOUTS: GRIDLAYOUT

© J.D.CABRERA
LAYOUTS: GRIDLAYOUT
android:layout_orientation: marca la forma de
colocar los elementos hijos, por filas o columnas.

© J.D.CABRERA
LAYOUTS: GRIDLAYOUT
android:layout_columnSpan: posibilita que una
celda determinada pueda ocupar el espacio de
varias columnas de la tabla.

© J.D.CABRERA
LAYOUTS: GRIDLAYOUT
android:layout_rowSpan: posibilita que una celda
determinada pueda ocupar el espacio de varias filas
de la tabla.

© J.D.CABRERA
RELATIVELAYOUT

© J.D.CABRERA
LAYOUTS: RELATIVELAYOUT
Este layout permite especificar la posición de cada
elemento de forma relativa a su elemento padre o a
cualquier otro elemento incluido en el propio layout.

© J.D.CABRERA
<RelativeLayout
<TextView android:text=“@+id/TxtNombre”/>
<Button android:id="@+id/BOTON“
android:layout_below="@id/TxtNombre"
android:layout_alignParentRight="true" />
</RelativeLayout t>

© J.D.CABRERA
android:layout_toRightOf
android:layout_toLeftOf
android:layout_below
android:layout_above
POSICIÓN RELATIVA AL CONTROL

© J.D.CABRERA
android:layout_alignBaseline
android:layout_alignBottom
android:layout_alignTop
android:layout_alignRight
android:layout_alignLeft
ALINEACIÓN CON RESPECTO AL CONTROL

© J.D.CABRERA
android:layout_centerInParent
android:layout_centerVertical
android:layout_centerHorizontal
android:layout_alignParentBottom
android:layout_alignParentTop
android:layout_alignParentRight
android:layout_alignParentLeft
POSICIÓN RELATIVA AL LAYOUT PADRE

© J.D.CABRERA
android:layout_marginRight
android:layout_marginLeft
android:layout_marginTop
android:layout_marginBottom
android:layout_margin
OPCIONES DE MARGEN (COMUNES A TODOS)

© J.D.CABRERA
android:paddingRight
android:paddingLeft
android:paddingBottom
android:paddingTop
android:padding
OPCIONES DE ESPACIADO (COMUNES A TODOS)

© J.D.CABRERA
LAYOUTS: ABSOLUTELAYOUT
Permite indicar las coordenadas (x,y) donde queremos
que se visualice cada elemento. No es recomendable
por variar según los tamaños de pantalla. ha sido
marcado como obsoleto.

© J.D.CABRERA
<AbsoluteLayout
<Button android:id="@+id/BOTON“
android:layout_x=“130dp"
android:layout_y=" 60dp " />
</AbsoluteLayout>

© J.D.CABRERA
LAYOUTS: FRAMELAYOUT
Posiciona las vistas usando todo el contenedor, sin
distribuirlas espacialmente. Este Layout suele
utilizarse cuando queremos que varias vistas ocupen
un mismo lugar. Podemos hacer que solo una sea
visible, o superponerlas. Para modificar la visibilidad
de un elemento utilizaremos la propiedad visibility.

© J.D.CABRERA
<FrameLayout
android:layout_width=“fill_parent"
android:layout_height=“fill_parent“
<TextView android:text=“@+id/TxtNombre”/>
<Button android:id="@+id/BOTON“/>
</FrameLayout t>

© J.D.CABRERA
<FrameLayout
android:layout_height=“math_content“ />
…//…
<FrameLayout
…//…
</FrameLayout>
</FrameLayout>
LAYOUTS: ANIDADOS

© J.D.CABRERA
<layoutAnimation
android:delay=“1"
android:animationOrder=“normal“ /> (random, reverse)
android:animation="@layout/animacion"
</>

© J.D.CABRERA
import android.view.animation.LayoutAnimationController;
import android.view.animation.TranslateAnimation;
import android.widget.LinearLayout;
LAYOUTS: ANIMANDO LAYOUTS DESDE JAVA

© J.D.CABRERA
TranslateAnimation traslacion
=new TranslateAnimation(rp,1f,rp,0f,rp,0f,rp,0f);
traslacion.setDuration(3000);
LayoutAnimationController la= new LayoutAnimationController(traslacion);
la.setDelay(1);
la.setOrder(LayoutAnimationController.ORDER_NORMAL);
LinearLayout ll=(LinearLayout) findViewById(R.id.layout);
ll.setLayoutAnimation(la);
LAYOUTS: ANIMANDO LAYOUTS DESDE JAVA

DISPOSITIVOS MÓVILES: LAYOUTS

DISPOSITIVOS MÓVILES: LAYOUTS

Recomendados

Recomendados

Mais conteúdo relacionado

Semelhante a DISPOSITIVOS MÓVILES: LAYOUTS

Semelhante a DISPOSITIVOS MÓVILES: LAYOUTS (20)

Mais de Jacinto Cabrera Rodríguez

Mais de Jacinto Cabrera Rodríguez (20)

DISPOSITIVOS MÓVILES: LAYOUTS