Siguiendo el tutorial de Developer Android podemos ver las diferentes resoluciones
de pantallas existentes, asi como su dentidad, el siguiente grafico es muy
ilustrativo.
Por lo que para hacer aplicaciones que se autoajusten al terminal debemos crear la
siguiente estructura de directorios para los layaout. En el caso de no crearse
alguno Android cargaria por defecto la carpeta "layout"
res/layout/ // layout for normal screen size ("default")
res/layout-small/ // layout for small screen size
res/layout-large/ // layout for large screen size
res/layout-xlarge/ // layout for extra large screen size
res/layout-xlarge-land/ // layout for extra large in landscape orientation
Una vez creado la estructura de carpetas, creariamos el layout (xml) y lo
copiariamos a todas las carpetas modificando para cada tamaño (small,normal..etc)
los parametros que queramos ajustar a cada pantalla, indicando el tamaño dp.
Pongamos un ejemplo:
Para una pantalla Small
<WebView android:id="@+id/webview"
android:layout_width="533dp"
android:layout_height="fill_parent">
</WebView>
Para una normal es:
<WebView android:id="@+id/webview"
android:layout_width="400dp"
android:layout_height="fill_parent">
</WebView>
Estos son los tamaños que tendrían las pantallas en unidades dp.
Una formula de calculo de los pixel en cada resolucion es la siguiente
px= dpi/160
Por lo que con px calculado
dp=tamaño px total/px (calculados de antes)
Siguiendo el ejemplo anterior, para una pantalla small de 240dpi de ancho habría
una proporción de 1.5px reales por cada 1px de la pantalla del terminal, para una
normal de 400 dpi habría 2px por cada 1px.
Por lo que Si la imagen que queremos colocar en el ejemplo es de 800 x 600,
calcularemos el ancho para cada pantalla así:
small --> dp=800/1.5 = 533dp
normal --> dp=800/2 = 400dp
Que son los datos que se pueden ver se usarón en el ejemplo
De la misma manera para adaptar las imagenes habria que crear la siguiente
estructura y copiar
a cada una las imagenes adecuadas:
res/drawable-mdpi/my_icon.png // bitmap for medium density
res/drawable-hdpi/my_icon.png // bitmap for high density
res/drawable-xhdpi/my_icon.png // bitmap for extra high density
Articulo original
No hay comentarios:
Publicar un comentario