Layouts en Android LSUB, GSYC, URJC

Transcripción

1 Layouts en Android LSUB, GSYC, URJC

2 Layouts Son Views Para organizar la pantalla Organizados en una jerarquía

3 Layouts View ViewGroup LinearLayout... GridLayout TableLayout TableRow

4 Layouts Normalmente declarados en XML res/layouts/foo_layout.xml Pero tenemos las clases en Java correspondientes Y los atributos

5 LinearLayout Una única fila o columna android:orientation horizontal vertical android:gravity top bottom,...

6 LinearLayout android:layout_width match_parent wrap_content android:layout_height match_parent wrap_content

7 Ejemplo <?xml version="1.0" encoding="utf-8"?> <LinearLayout xmlns:android=" xmlns:tools=" android:layout_width="match_parent" android:layout_height="match_parent" android:orientation="vertical" tools:context=".mainactivity"> <LinearLayout android:orientation="horizontal" android:layout_width="match_parent" android:layout_height="wrap_content"> <EditText android:layout_height="wrap_content" android:hint="escribe aqui" /> android:layout_height="wrap_content" android:text="boton1" /> </LinearLayout>...

8 Ejemplo <LinearLayout android:orientation="horizontal" android:layout_width="match_parent" android:layout_height="wrap_content" > android:layout_height="wrap_content" android:text="boton2" /> android:layout_height="wrap_content" android:text="boton3" /> android:layout_height="wrap_content" android:text="boton4" /> </LinearLayout> </LinearLayout>

9 Ejemplo

10 Ejemplo <?xml version="1.0" encoding="utf-8"?> <LinearLayout xmlns:android=" xmlns:tools=" android:layout_width="match_parent" android:layout_height="match_parent" android:orientation="vertical" tools:context=".mainactivity"> <LinearLayout android:orientation="horizontal" android:layout_width="match_parent" android:layout_height="match_parent"> <EditText android:layout_height="wrap_content" android:hint="escribe aqui" /> android:layout_height="wrap_content" android:text="boton1" /> </LinearLayout>...

11 Ejemplo Dónde está el segundo layout?

12 Ejemplo <LinearLayout xmlns:android=" xmlns:tools=" android:layout_width="match_parent" android:layout_height="match_parent" android:orientation="vertical" tools:context=".mainactivity"> <LinearLayout android:orientation="horizontal" android:gravity="center" android:layout_width="match_parent" android:layout_height="wrap_content"> <EditText android:layout_height="wrap_content" android:hint="escribe aqui" /> android:layout_height="wrap_content" android:text="boton1" /> </LinearLayout>

13 Ejemplo

14 Usando Pesos <LinearLayout android:orientation="horizontal" android:layout_width="match_parent" android:layout_height="wrap_content" > android:layout_width="0dp" android:layout_weight="25" android:layout_height="match_parent" android:text="boton2" /> android:layout_width="0dp" android:layout_weight="50" android:layout_height="match_parent" android:text="boton3" /> android:layout_width="0dp" android:layout_weight="25" android:layout_height="match_parent" android:text="boton4" /> </LinearLayout>

15 Ejemplo

16 Usando Pesos Asignamos pesos que suman 100 en total Fijamos tamaño a 0dp O... Fijamos un peso 1 en uno de ellos Y el tamaño en el resto

17 Usando Pesos <LinearLayout android:orientation="horizontal" android:layout_width="match_parent" android:layout_height="wrap_content" > android:layout_width="0dp" android:layout_weight="1" android:layout_height="match_parent" android:text="boton2" /> android:layout_height="match_parent" android:text="boton3" /> android:layout_height="match_parent" android:text="boton4" /> </LinearLayout>

18 Layout

19 Layouts relativos <RelativeLayout xmlns:android=" xmlns:tools=" android:layout_width="match_parent" android:layout_height="match_parent" android:orientation="vertical" tools:context=".mainactivity"> android:text="boton1" android:layout_height="wrap_content" /> android:text="a la drcha" android:layout_height="wrap_content" /> android:text="debajo de" android:layout_height="wrap_content" /> </RelativeLayout>

20 Layouts relativos

21 Tablas <TableLayout xmlns:android=" xmlns:tools=" android:layout_width="match_parent" android:layout_height="match_parent" android:orientation="vertical" android:stretchcolumns="0,1,2" tools:context=".mainactivity"> <TableRow > android:text="boton11" android:layout_height="wrap_content" />... android:text="boton13" android:layout_height="wrap_content" /> </TableRow> <TableRow >...

22 Tablas

23 Tablas <TableLayout xmlns:android=" xmlns:tools=" android:layout_width="match_parent" android:layout_height="match_parent" android:orientation="vertical" android:stretchcolumns="1,2" tools:context=".mainactivity"> <TableRow > android:text="boton11" android:layout_height="wrap_content" /> android:layout_span="2" android:text="boton12" android:layout_height="wrap_content" /> </TableRow>

24 Tablas <TableRow > android:text="boton21" android:layout_height="match_parent" /> <TableLayout android:layout_span="2" android:stretchcolumns="0,1" > <TableRow> android:text="boton22" android:layout_height="wrap_content" /> android:text="boton23" android:layout_height="wrap_content" /> </TableRow> <TableRow> android:text="boton32" android:layout_height="wrap_content" /> android:text="boton33" android:layout_height="wrap_content" /> </TableRow> </TableLayout> </TableRow>

25 Tablas

26 Layouts/Views desde Java Se controlar sus propiedades de tamaño con el objeto LayoutParams (uno por layout), ej: TableRow row = new TableRow(this); TableRow.LayoutParams lr = new TableRow.LayoutParams(TableRow.LayoutParams.WRAP_CONTENT, TableRow.LayoutParams.WRAP_CONTENT); row.setlayoutparams(lr);