PDM Activities, Layouts e Múltiples pantallas. Introdución
Revisión del 10:13 30 sep 2018 de Wiki (discusión | contribuciones) (→Píxeles independentes da densidade (dp))
Sumario
Introdución
- Neste apartado vanse describir:
- Que son as Activities.
- Como indicar o tipo de deseño (distribución) que van ter os elementos gráficos na Activity.
Nota: Para entender esta parte teremos que ter creado un proxecto Android como está indicado neste punto.
Activities
- Imos dar unha breve descrición do que é un Activity. Estas veranse máis adiante.
- Unha Activity é unha pantalla única coa cal o usuario poderá interactuar a través dos elementos que nela se dispoñan.
- Unha aplicación estará composta dunha ou varias Activities.
- Incluso se pode saltar da Activity dunha aplicación á unha Activity calquera de outra aplicación. Por exemplo, cando se usa WhatsApp e se accede a consultar os datos dun contacto.
- Unha Activity pode ser chamada cando se inicia unha aplicación, dende outra aplicación, ou cando se recupera a aplicación.
- Unha Activity pode ser destruída pola propia aplicación, cando se preme o botón Back do dispositivo ou polo sistema porque está na pila de aplicacións (Stack) en segundo plano e se necesitan os recursos que está consumindo.
- As Activities teñen un ciclo de vida como se expón dun xeito simple na seguinte imaxe:
Nun punto posterior afondarase sobre as Activities.
- Referencias:
Layout
- Un layout é un panel onde se definen os elementos gráficos que compoñen unha Activity: botóns, listas depregables, etiquetas, etc.
- Un Layout pode declararse en ficheiros XML ou en tempo de execución. Comezaremos polos ficheiros XML.
- Un Layout poden ser de varios tipos: lineais, táboa, grid, etc. Como se verá no seguinte apartado.
- Referencias:
Soporte múltiples pantallas
- Como sabemos no mercado hai distintos dispositivos: teléfonos, tablets, etc. e agora ... coa nova versión Lollipop: reloxos, pulseiras, TVs, etc.
- Cada un ten os seus tamaños e resolucións.
- Android proporciona ferramentas para adaptarse a toda esa variedade. Por exemplo, poderíamos deseñar unha aplicación cuxa Interface Gráfica fose distinta dun teléfono a unha tablet, o se está en apaisado o teléfono ou en vertical.
- O sistema tamén trata de escalar a aplicación para adaptala aos distintos tipos (Tamaños/resolucións) de pantalla, pero se usamos pixels para definición dos elementos que compoñen unha pantalla pode pasar o seguinte:
- Os dispositivos teñen o mesmo tamaño de pantalla,
- A resolución dos dispositivos vai de menor a maior (de esquerda á dereita).
- Observar como ao definir que un obxecto ocupa X*Y píxeles estes obxectos son máis pequenos a medida que a resolución da pantalla é maior.
- Observar que se ven afectados os tipos de recursos gráficos:
- Os creados polo usuario na aplicación: por exemplo o botón.
- Os engadidos polo usuario á aplicación (debuxos/imaxes): por exemplo a imaxe de Android.
- O obxectivo sería, que independentemente da resolución da pantalla se obtivera o seguinte resultado: os obxectos vense do mesmo tamaño aínda tendo resolucións distintas.
- Imos ver antes de nada unha serie de conceptos:
Tamaños de pantalla e densidade (puntos por pulgada: dpi)
Ata versión 3.2
- Tamaño da pantalla: tamaño da diagonal da pantalla física do dispositivo.
- Por simplicidade Android divide as pantallas, até a versión Android 3.2 en : pequenas (small), normales, grandes (large) e extra largas (extra large).
- Densidade de pantalla (Screen density): puntos por pulgada (ppp / (dot per inch (dpi))). Unha pantalla de baixa resolución terá poucos dpis comparada cunha pantalla normal ou de alta resolución.
- Por simplicidade Android agrupaba as densidades :
- ldpi: baixa (low, 120 dpi)
- mdpi: media (medium, 160 dpi)
- hdpi: alta (high, 240 dpi)
- xhdpi: extra alta (extra high, 320 dpi)
- xxhdpi: extra extra alta (extra-extra high, 480 dpi)
- xxxhdpi: extra extra extra alta (extra-extra-extra high, 640 dpi)
- nodpi: Recursos para calquera densidade.
Dende a versión 3.2
- Máis información neste enlace.
- A partir desta versión a opción recomendada é a de definir os layouts en función do dp.
- Así, por exemplo, podo ter un deseño no que necesito 600dp para que se vexa ben. Calquera dispositivo con dita resolución collerá este deseño.
Orientación e resolución
- Orientación: dende o punto de vista do usuario indica se o dispositivo está en apaisado ou en vertical. Ao rotar a pantalla cambia a relación de altura e ancho.
- Resolución: indica o número total de píxeles que ten a pantalla. Cando se desenvolven aplicacións para distintas pantallas débese traballar coa densidade e co tamaño da pantalla e non coa resolución total.
Píxeles independentes da densidade(dp ou dip) e Escala independente(sp)
- Antes de ler esta sección debemos de ter claro varios conceptos.
- Imos coller como referencia un teléfono calquera, por exemplo un NEXUS 6P:
- Píxeles: Son o número de 'puntos' que caben nunha pantalla. Ven ser a resolución. No exemplo 2560 x 1440 píxeles.
- Tamaño en polgadas da pantalla: É o tamaño da diagonal da pantalla en polgadas. Cada polgada equivale a 2,54cm. No exemplo, 5.7'
- A primeira idea que temos que ter claro é que maior tamaño non implica maior resolución. Poderíamos ter unha pantalla de 10' cunha resolución de 1024x768
- Podemos relacionar os dous parámetros (tamaño e píxeles) para obter cantos píxeles por polgada temos (ppp).
- No exemplo:
- Calculamos os píxeles da diagonal: 2937,21
- Dividimos polo número de polgadas: 2937,21 / 5.7 = 515ppp
- Podedes consultar como calcular los ppp neste enlace.
- A primeira reflexión que debemos preguntarnos é:
- En caso de dous teléfonos de igual tamaño de pantalla deberemos escoller o que ten maior ppp ?
- A primeira vista é si, pero temos que ter en conta que o ollo humano a partir dun tamaño determinado xa non é quen de distinguir os píxeles, polo que ter máis densidade non vai traducirse en unha mellor imaxe tendo como contrapartidas que o consumo da batería será moito maior.
- Píxel independente da densidade (Density-independent pixel (dp/dip)): é un píxel virtual que debe ser usado cando se definen elementos gráficos nun layout, tanto para expresar tamaño dun obxecto, como a súa posición.
- Unha pantalla media(medium) ten 160 dpi. Quero isto dicir que 1px = 1dp nunha pantalla de 160dpi.
- Nunha pantalla media 1dp=1dpi. Isto é nunha pantalla media o píxel virtual coincide co píxel real.
- En tempo de execución é cando se fai a conversión de unidades dp a píxeles físicos (px).
- O factor de conversión é: px= dp * (dpi / 160).
- Por exemplo 1 dp nunha pantalla de densidade:
- 120dpi: 1dp sería igual a 0,75 px (píxeles físicos) => px = 1 * (120/160) => 1px = 0,75
- 160dpi: 1dp sería igual a 1 px (píxeles físicos).
- 240dpi: 1dp sería igual a 1,5 px (píxeles físicos) => px = 1 * (240/160) => 1px = 1,5
- 320dpi: 1dp sería igual a 2 px (píxeles físicos).
- 480dpi: 1dp sería igual a 3 px (píxeles físicos).
- 640dpi: 1dp sería igual a 4 px (píxeles físicos).
- Deste xeito se defininos sempre as dimensións e posicións en dp sempre se vai realizar unha conversión en tempo de execución ao número de píxeles físicos equivalentes.
- Scale-independent Pixels (sp): esta unidade é igual a dp, pero é usada para tamaños de texto. Estes tamaños poden se axustados pola densidade da pantalla e polas preferencias do usuario.
Nota importante:
- No caso das imaxes, debemos sempre empregar unidades en dp para o seu tamaño.
- No caso dos texto, debemos sempre empregar unidades en sp para o seu tamaño.
A seguinte imaxe amosa os rangos entre que se moven os distintos tamaños de pantalla e os distintos tipos de densidade:
- AS IMAXES
- Pero aínda nos falta saber que facer coas imaxes que pode incorporar un usuario a unha aplicación.
- Pódese prover para cada imaxe un ficheiro distinto adaptado ás distintas densidades.
- Se non se provén ficheiros para as distintas densidades o sistema escalará o ficheiro proporcionado para a densidade media (mdpi) e adaptarao a densidade da pantalla. Pero sempre será mellor proporcionar distintas versións da imaxe.
- Para proporcionar distintas versións de densidade dunha imaxe debemos seguir a regra: 3(ldpi):4(mdpi):6x(hdpi):8(xhdpi). Isto é, se collemos como referencia unha imaxe densidade media (mdpi) de tamaño X+Y píxeles, debemos crear novas imaxes que garden a seguinte relación en tamaño (número de píxeles): ldpi(x0.75), mdpi(x1), hdpi(x1,5) e xhdpi(x2).
- Exemplo se temos unha imaxe de 48x48 píxeles (tamaño dunha icona de lanzamento dunha aplicación) e esta é para unha densidade mdpi, debemos crear versións cos seguintes tamaños en píxeles:
- ldpi: 36x36
- mdpi: 48x48
- hdpi: 72x72
- xhdpi: 96x96
- Visto todo o anterior agora volvamos a ver de novo as imaxes onde se usan os píxeles para os tamaños e as posicións:
- E a que usa dp e distintas versións dunha mesma imaxe:
- Observar como coinciden para os dous casos na densidade media.
- Referencias:
-- Ángel D. Fernández González e Carlos Carrión Álvarez -- (2015).