04.04.2015 Views

Curso de Desarrollo en Android - docencia de la ETSIT-URJC

Curso de Desarrollo en Android - docencia de la ETSIT-URJC

Curso de Desarrollo en Android - docencia de la ETSIT-URJC

SHOW MORE
SHOW LESS

You also want an ePaper? Increase the reach of your titles

YUMPU automatically turns print PDFs into web optimized ePapers that Google loves.

<strong>Curso</strong> <strong>de</strong> <strong>Desarrollo</strong> <strong>en</strong> <strong>Android</strong><br />

Layouts<br />

Roberto Calvo Palomino<br />

rocapal@libresoft.es<br />

GSyC/Libresoft<br />

January 23, 2013<br />

Roberto Calvo Palomino<br />

<strong>Curso</strong> <strong>de</strong> <strong>Desarrollo</strong> <strong>en</strong> <strong>Android</strong>


(cc) 2012 Roberto Calvo Palomino.<br />

Some rights reserved. This docum<strong>en</strong>t is distributed un<strong>de</strong>r the Creative<br />

Commons Attribution-ShareAlike 3.0 lic<strong>en</strong>ce, avai<strong>la</strong>ble in<br />

http://creativecommons.org/lic<strong>en</strong>ses/by-sa/3.0/<br />

Roberto Calvo Palomino<br />

<strong>Curso</strong> <strong>de</strong> <strong>Desarrollo</strong> <strong>en</strong> <strong>Android</strong>


In<strong>de</strong>x<br />

Roberto Calvo Palomino<br />

<strong>Curso</strong> <strong>de</strong> <strong>Desarrollo</strong> <strong>en</strong> <strong>Android</strong>


Medición <strong>en</strong> Pantal<strong>la</strong><br />

px (píxeles)<br />

dip (píxeles in<strong>de</strong>p<strong>en</strong>di<strong>en</strong>tes <strong>de</strong>l dispositivo)<br />

sp (píxeles esca<strong>la</strong>dos, mejor para tamaños <strong>de</strong> texto)<br />

pt (puntos)<br />

in (inches)<br />

mm (miĺımetros)<br />

Roberto Calvo Palomino<br />

<strong>Curso</strong> <strong>de</strong> <strong>Desarrollo</strong> <strong>en</strong> <strong>Android</strong>


Difer<strong>en</strong>tes Pantal<strong>la</strong><br />

Tamaño<br />

D<strong>en</strong>sidad (<strong>de</strong>p<strong>en</strong>di<strong>en</strong>te o no <strong>de</strong>l pixel)<br />

Aspecto <strong>de</strong> Ratio<br />

Versión <strong>de</strong> p<strong>la</strong>taforma<br />

Scre<strong>en</strong>s Support (Link)<br />

Roberto Calvo Palomino<br />

<strong>Curso</strong> <strong>de</strong> <strong>Desarrollo</strong> <strong>en</strong> <strong>Android</strong>


In<strong>de</strong>x<br />

Roberto Calvo Palomino<br />

<strong>Curso</strong> <strong>de</strong> <strong>Desarrollo</strong> <strong>en</strong> <strong>Android</strong>


Introduccion<br />

Unidad elem<strong>en</strong>tal <strong>de</strong> <strong>la</strong> interfaz gráfica.<br />

Cont<strong>en</strong>edores <strong>de</strong> widgets que ocupan <strong>la</strong> pantal<strong>la</strong><br />

Re<strong>la</strong>ción fuerte <strong>en</strong>tre <strong>la</strong>youts para conseguir <strong>la</strong> interfaz <strong>de</strong>seada<br />

fill par<strong>en</strong>t / match par<strong>en</strong>t (API level +8): Ocupa <strong>la</strong> anchura o<br />

altura máximo que le <strong>de</strong>je su padre<br />

wrap cont<strong>en</strong>t: Ocupa <strong>la</strong> anchua o altura mínima necesaria<br />

Roberto Calvo Palomino<br />

<strong>Curso</strong> <strong>de</strong> <strong>Desarrollo</strong> <strong>en</strong> <strong>Android</strong>


FrameLayout<br />

Está diseñado para ocupar un area <strong>de</strong> <strong>la</strong> pantal<strong>la</strong> para mostrar<br />

un solo elem<strong>en</strong>to<br />

Pue<strong>de</strong>s añadir muchos hijos a este FrameLayout, pero todos<br />

los hijos aparecerán alineados arriba a <strong>la</strong> izquierda <strong>de</strong> este<br />

cont<strong>en</strong>edor.<br />

En este grupo <strong>de</strong> vistas no se pue<strong>de</strong> especificar <strong>la</strong> posición <strong>de</strong><br />

los hijos<br />

No son los <strong>la</strong>youts más utilizados<br />

Roberto Calvo Palomino<br />

<strong>Curso</strong> <strong>de</strong> <strong>Desarrollo</strong> <strong>en</strong> <strong>Android</strong>


1 <br />

<br />

<br />

13 <br />

19 <br />

Roberto Calvo Palomino<br />

<strong>Curso</strong> <strong>de</strong> <strong>Desarrollo</strong> <strong>en</strong> <strong>Android</strong>


LinearLayout<br />

Dispone sus hijos <strong>en</strong> una so<strong>la</strong> columna o <strong>en</strong> una so<strong>la</strong> fi<strong>la</strong><br />

(configurable)<br />

La dirección <strong>de</strong> cada fi<strong>la</strong> pue<strong>de</strong> ser especificada mediante<br />

setOri<strong>en</strong>tation() <strong>en</strong> código o mediante android:ori<strong>en</strong>tation <strong>en</strong><br />

el XML. Por <strong>de</strong>fecto, es horizontal<br />

También pue<strong>de</strong>s especificar gravedad, <strong>la</strong> cual indica <strong>la</strong><br />

alineación <strong>de</strong> todos los elem<strong>en</strong>tos hijos<br />

Soporta asignar peso a los hijos <strong>de</strong> forma individual. Este<br />

valor permite a los hijos que se expandan hasta ll<strong>en</strong>ar<br />

cualquier espacio libre <strong>de</strong> <strong>la</strong> pantal<strong>la</strong>.<br />

Roberto Calvo Palomino<br />

<strong>Curso</strong> <strong>de</strong> <strong>Desarrollo</strong> <strong>en</strong> <strong>Android</strong>


1 <br />

<br />

9 <br />

<br />

<br />

Roberto Calvo Palomino<br />

<strong>Curso</strong> <strong>de</strong> <strong>Desarrollo</strong> <strong>en</strong> <strong>Android</strong>


Re<strong>la</strong>tiveLayout<br />

El más flexible <strong>de</strong> todos los tipos <strong>de</strong> <strong>la</strong>youts. Pue<strong>de</strong>s construir<br />

casi cualquier cosa con ellos.<br />

La posición <strong>de</strong> los hijos son re<strong>la</strong>tivas al padre e incluso a otros<br />

hijos.<br />

Nos permite realizar interfaces complejas y portables a<br />

difer<strong>en</strong>tes tamaños <strong>de</strong> pantal<strong>la</strong>.<br />

Roberto Calvo Palomino<br />

<strong>Curso</strong> <strong>de</strong> <strong>Desarrollo</strong> <strong>en</strong> <strong>Android</strong>


2 <br />

<br />

<br />

22 <br />


a n d r o i d : t e x t C o l o r= ’ ’ #000000 ’ ’<br />

38 a n d r o i d : t e x t= ’ ’ wrap ’ ’<br />

/><br />

40 <br />

50 <br />

Roberto Calvo Palomino<br />

<strong>Curso</strong> <strong>de</strong> <strong>Desarrollo</strong> <strong>en</strong> <strong>Android</strong>


TableLayout<br />

Layout específico para mostrar tab<strong>la</strong>s<br />

Se pue<strong>de</strong> realizar también con Re<strong>la</strong>tiveLayouts<br />

Columas y Fi<strong>la</strong>s son sus principales propieda<strong>de</strong>s<br />

Roberto Calvo Palomino<br />

<strong>Curso</strong> <strong>de</strong> <strong>Desarrollo</strong> <strong>en</strong> <strong>Android</strong>


2 <br />

6 <br />

<br />

10 <br />

<br />

14<br />

<br />

16 <br />

<br />

22 <br />

<br />

Roberto Calvo Palomino<br />

<strong>Curso</strong> <strong>de</strong> <strong>Desarrollo</strong> <strong>en</strong> <strong>Android</strong>


In<strong>de</strong>x<br />

Roberto Calvo Palomino<br />

<strong>Curso</strong> <strong>de</strong> <strong>Desarrollo</strong> <strong>en</strong> <strong>Android</strong>


HierarchyViewer y LayoutOpt<br />

Herrami<strong>en</strong>tas para <strong>de</strong>purar nuestras interfaces<br />

Útil para po<strong>de</strong>r optimizar recursos <strong>en</strong> nuestras aplicaciones<br />

Se <strong>en</strong>cu<strong>en</strong>tra <strong>en</strong> $DIR SDK ANDROID/tools/<br />

Depurar Interfaces (Link)<br />

Roberto Calvo Palomino<br />

<strong>Curso</strong> <strong>de</strong> <strong>Desarrollo</strong> <strong>en</strong> <strong>Android</strong>


Optimización<br />

Nunca usar AbsoluteLayout<br />

Usar el mínimo número <strong>de</strong> vistas posibles<br />

Nunca más <strong>de</strong> 80 <strong>la</strong>youts <strong>en</strong> una misma vista, y nunca más <strong>de</strong><br />

10 <strong>la</strong>youts anidados<br />

Pantal<strong>la</strong>s y vistas s<strong>en</strong>cil<strong>la</strong>s<br />

Utilizar recursos apropiados para cada tipo <strong>de</strong> pantal<strong>la</strong><br />

Roberto Calvo Palomino<br />

<strong>Curso</strong> <strong>de</strong> <strong>Desarrollo</strong> <strong>en</strong> <strong>Android</strong>

Hooray! Your file is uploaded and ready to be published.

Saved successfully!

Ooh no, something went wrong!