Diferencia entre revisiones de «Prog Android Adaptando o deseño»
Ir a la navegación
Ir a la búsqueda
(No se muestran 5 ediciones intermedias de otro usuario) | |||
Línea 120: | Línea 120: | ||
− | : Anteriormente, en el directorio 'res/' se ponía un sufijo (como res/layout-xlarge/) para indicar que se layout fuese cargado para un tamaño de pantalla grande (ver [http://wiki.cifprodolfoucha.es/index.php?title= | + | : Anteriormente, en el directorio 'res/' se ponía un sufijo (como res/layout-xlarge/) para indicar que se layout fuese cargado para un tamaño de pantalla grande (ver [http://wiki.cifprodolfoucha.es/index.php?title=PDM_Activities,_Layouts_e_M%C3%BAltiples_pantallas._Introduci%C3%B3n#Tama.C3.B1os_de_pantalla_e_densidade_.28puntos_por_pulgada:_dpi.29 este enlace] para consultar los diferentes tamaños de pantalla). |
: Ahora, el sufijo que se va a añadir va a indicar el espacio necesario en '''pp''' (puntos por pulgada) que se necesita para poder visualizar el layout. | : Ahora, el sufijo que se va a añadir va a indicar el espacio necesario en '''pp''' (puntos por pulgada) que se necesita para poder visualizar el layout. | ||
Línea 128: | Línea 128: | ||
: Este formato es independiente de que la pantalla esté en horizontal o vertical. | : Este formato es independiente de que la pantalla esté en horizontal o vertical. | ||
: Por lo tanto, refleja el tamaño mínimo posible en dp para que la interface de un determinado layout pueda ser visualizada correctamente. | : Por lo tanto, refleja el tamaño mínimo posible en dp para que la interface de un determinado layout pueda ser visualizada correctamente. | ||
+ | |||
+ | : <u>'''Esta es la opción que recomienda Android para el diseño de las Activities'''</u>. | ||
+ | : Ya vimos lo que eran los dp´s [https://wiki.cifprodolfoucha.es/index.php?title=PDM_Activities,_Layouts_e_M%C3%BAltiples_pantallas._Introduci%C3%B3n#P.C3.ADxeles_independentes_da_densidade.28dp_ou_dip.29_e_Escala_independente.28sp.29 en esta sección de la Wiki] | ||
Línea 147: | Línea 150: | ||
* Estos son algunos valores que puedes utilizar para tamaños de pantallas comunes: | * Estos son algunos valores que puedes utilizar para tamaños de pantallas comunes: | ||
− | :* | + | :* '''320dp''', para dispositivos con configuraciones de pantalla como las siguientes: |
::* 240 x 320 ldpi (teléfono celular QVGA) | ::* 240 x 320 ldpi (teléfono celular QVGA) | ||
::* 320 x 480 mdpi (teléfono celular) | ::* 320 x 480 mdpi (teléfono celular) | ||
::* 480 x 800 hdpi (teléfono celular de alta densidad) | ::* 480 x 800 hdpi (teléfono celular de alta densidad) | ||
− | + | :* '''480dp''', para pantallas de 480 x 800 mdpi (tablet/teléfono celular). | |
− | + | :* '''600dp''', para pantallas de 600 x 1024 mdpi (tablet de 7 pulgadas). | |
− | + | :* '''720dp''', para pantallas de 720 x 1280 mdpi (tablet de 10 pulgadas). | |
Línea 161: | Línea 164: | ||
+ | |||
+ | |||
+ | |||
+ | <br /> | ||
+ | '''[https://wiki.cifprodolfoucha.es/index.php?title=Programaci%C3%B3n_de_dispositivos_m%C3%B3biles#UNIDADE_2:_A_interface_de_usuario. Enlace a la página principal de la UD2]''' | ||
+ | <br /> | ||
+ | <br /> | ||
+ | '''[https://wiki.cifprodolfoucha.es/index.php?title=Programación_de_dispositivos_móbiles Enlace a la página principal del curso]''' | ||
+ | <br /> | ||
<br> -- [[Usuario:angelfg|Ángel D. Fernández González]] e [[Usuario:Carrion|Carlos Carrión Álvarez]] -- (2018). | <br> -- [[Usuario:angelfg|Ángel D. Fernández González]] e [[Usuario:Carrion|Carlos Carrión Álvarez]] -- (2018). |
Revisión actual del 12:59 21 nov 2020
Sumario
Introducción
- Debemos ter en conta que os dispositivos que 'corren' o S.O. Android son moi variados, en tamaño de pantalla e en puntos por polgada, polo que as resolucións a empregar poden variar considerablemente.
- Polo tanto, cando deseñamos unha aplicación, debemos poder adaptala aos diferentes tamaños, para que se visualice correctamente e se aproveite o espacio dispoñible.
- Para facer isto, android implementa un mecanismos de 'sufixos' ás carpetas onde se gardan os layouts.
- Cada un dos sufixos indica diferentes características físicas da pantalla (tamaño, orientación, dp,...)
- Tódolos layouts definidos en ditos cartafoles serán cargados cando os sufixos coincidan coas características físicas do dispositivo.
- Os sufixos 'non son excluintes' e se poden combinar, por exemplo, podemos ter un layout definido cando dispoñamos dunha tablet de 720dp e estea posicionada en apaisado.
- Tamén podemos limitar no AndroidManifiest.xml os dispositivos que poidan instalar a nosa aplicación en función da pantalla do mesmo, coa etiqueta 'supports-screens'.
- Máis información neste enlace.
En función de la orientación
Introdución
- Algúns dispositivos deixan rotar a pantalla, poñéndoa en posición horizontal-vertical (apaisado-retrato)
- Se queremos ter un deseño diferente para cada orientación, debemos de crear un cartafol dentro de ‘res’ de nome /res/layout-land.
- Aquí dentro poñemos os deseños que queiramos ter cunha orientación apaisada do dispositivo, mentres que deixaremos en /res/layout os deseños para unha orientación vertical.
Nota: no emulador, para cambiar a orientación debemos premer os botóns CTRL+F11 ou 7 no teclado numérico, sen estar activado o teclado numérico.
- Antes de continuar abre a calculadora nun AVD ou no dispositivo real e cambia a orientación do dispositivo/AVD. Notas algunha diferencia cando o dispositivo está en Vertical a cando o está en Horizontal?.
Veremos máis adiante, na sección Internacionalización, como podemos xerar estes 'sufixos' de forma automática cando creamos o arquivo de recurso.
- Referencias:
- Diferentes pantallas: http://developer.android.com/training/basics/supporting-devices/screens.html
Caso práctico
- Crear o proxecto: U2_40_Landscape
- Crear en /res o cartafol layout-land.
- Definir o XML vertical
- Copiar o XML vertical á nova carpeta e modificalo segundo as necesidades.
XML layout vertical
1 <LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
2 xmlns:tools="http://schemas.android.com/tools"
3 android:layout_width="match_parent"
4 android:layout_height="match_parent"
5 android:orientation="vertical"
6 android:gravity="center" >
7
8 <TextView
9 android:layout_width="wrap_content"
10 android:layout_height="wrap_content"
11 android:textColor="#00F"
12 android:textSize="18sp"
13 android:text="O dispositivo está en posición vertical" />
14
15 <Button
16 android:layout_width="wrap_content"
17 android:layout_height="wrap_content"
18 android:onClick="oMeuMetodo"
19 android:text="Botón 1" />
20
21 <TextView
22 android:layout_width="wrap_content"
23 android:layout_height="wrap_content"
24 android:gravity="center_horizontal"
25 android:text="Esta etiqueta só se amosa cando o dipositivo está en vertical" />
26
27 </LinearLayout>
XML layout horizontal
- Observar que falta unha etiqueta, a disposición e distinta, etc.
- Neste caso os botóns en Vertical e en Apaisado chaman ao mesmo método.
1 <LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
2 xmlns:tools="http://schemas.android.com/tools"
3 android:layout_width="match_parent"
4 android:layout_height="match_parent"
5 android:orientation="horizontal" >
6
7 <Button
8 android:layout_width="wrap_content"
9 android:layout_height="wrap_content"
10 android:onClick="oMeuMetodo"
11 android:text="Botón 1" />
12
13 <TextView
14 android:layout_width="wrap_content"
15 android:layout_height="wrap_content"
16 android:text="O dispositivo está en posición horizontal"
17 android:textColor="#F0F"
18 android:textSize="18sp" />
19
20 </LinearLayout>
En función del tamaño
- A partir de la versión de Android 3.2 se cambia la forma de indicarle al S.O. que layout tiene que coger en función del tamaño de la pantalla.
- Máis información neste enlace.
- Anteriormente, en el directorio 'res/' se ponía un sufijo (como res/layout-xlarge/) para indicar que se layout fuese cargado para un tamaño de pantalla grande (ver este enlace para consultar los diferentes tamaños de pantalla).
- Ahora, el sufijo que se va a añadir va a indicar el espacio necesario en pp (puntos por pulgada) que se necesita para poder visualizar el layout.
- Esto se implementó para dar una respuesta de diseño a las tablet's de 7' ya que dichas tablet's entraban dentro de la misma categoría que las de 5' pero el espacio es bastante mayor.
- El nombre que debe de tener la carpeta para que cargue el layout que se encuentre definido dentro de ella, debe de ser: nombre_carpeta-sw<N>dp siendo <N> el número de dp's necesario para que se pueda visualizar. Por ejemplo, 'res/clientes-sw600dp/
- Este formato es independiente de que la pantalla esté en horizontal o vertical.
- Por lo tanto, refleja el tamaño mínimo posible en dp para que la interface de un determinado layout pueda ser visualizada correctamente.
- Esta es la opción que recomienda Android para el diseño de las Activities.
- Ya vimos lo que eran los dp´s en esta sección de la Wiki
- Existen otros sufijos referidos solamente al ancho-alto de la pantalla:
- nombre_carpeta-w<N>dp: Ancho mínimo en dp. Por ejemplo: res/productos-w150dp/
- nombre_carpeta-h<N>dp: Alto mínimo en dp. Por ejemplo: res/productos-h300dp/
- Estos son algunos valores que puedes utilizar para tamaños de pantallas comunes:
- 320dp, para dispositivos con configuraciones de pantalla como las siguientes:
- 240 x 320 ldpi (teléfono celular QVGA)
- 320 x 480 mdpi (teléfono celular)
- 480 x 800 hdpi (teléfono celular de alta densidad)
- 480dp, para pantallas de 480 x 800 mdpi (tablet/teléfono celular).
- 600dp, para pantallas de 600 x 1024 mdpi (tablet de 7 pulgadas).
- 720dp, para pantallas de 720 x 1280 mdpi (tablet de 10 pulgadas).
- Más información en este enlace.
Enlace a la página principal de la UD2
Enlace a la página principal del curso
-- Ángel D. Fernández González e Carlos Carrión Álvarez -- (2018).