Android Studio - Dimensione schermo

Abbiamo visto in alcuni articoli che è possibile modificare il layout e altri aspetti della propria app in base alle dimensioni dello schermo utilizzando Smallest Screen Width.

In questo articolo approfondiremo l'uso di Smallest Screen Width e del suo significato.

Maggiori informazioni si possono trovare a questo indirizzo ed anche a questo indirizzo (in inglese)

I dispositivi Android sono disponibili in diverse dimensioni dello schermo (telefoni, tablet, TV e così via), ma i loro schermi hanno anche diverse dimensioni di pixel.
Se non si considerano queste variazioni nella densità dei pixel, il sistema potrebbe ridimensionare le immagini o le immagini potrebbero apparire con dimensioni completamente errate.

Per preservare la dimensione visibile dell'interfaccia utente su schermi con densità diverse, è necessario progettare l'interfaccia utente utilizzando pixel indipendenti dalla densità (dp) come unità di misura.
Un dp è un'unità di pixel virtuale che è circa uguale a un pixel su uno schermo a media densità (160 dpi è la densità "base"). Android traduce questo valore nel numero appropriato di pixel reali per ogni altra densità.
Questi sono i valori standard di densità in Android:

• 120 dpi - 0,75 volte la densità "base" - ldpi
• 160 dpi - densità "base" - mdpi
• 240 dpi - 1,5 volte la densità "base" - hdpi
• 320 dpi - 2 volte la densità "base" - xhdpi
• 480 dpi - 3 volte la densità "base" - xxhdpi
• 640 dpi - 4 volte la densità "base" - xxxhdpi

Questi valori di densità sono molto utili quando abbiamo a che fare con le immagini perché dovremmo creare la stessa immagine per ogni tipo di densità schermo. Ad esempio una immagine 48x48 pixel per mdpi devono essere create tutte le altre immagini per le diverse densità.

• 36x36 - 0,75 volte la densità "base" - ldpi
• 48x48 - densità "base" - mdpi
• 72x72 - 1,5 volte la densità "base" - hdpi
• 96x96 - 2 volte la densità "base" - xhdpi
• 144x144 - 3 volte la densità "base" - xxhdpi
• 192x192 - 4 volte la densità "base" - xxxhdpi

Ora vediamo un semplice codice per capire meglio questi numeri:

	val dm = applicationContext.resources.displayMetrics
	//la variabile dm conterrà le informazioni del display date da
	// applicationContext.resources.displayMetrics
	val density = dm.density
	/*La densità logica del display. Questo è un fattore di ridimensionamento per
	l'unità DPI, in cui un DIP è un pixel su uno schermo di circa 160 dpi
	(ad esempio uno schermo 240x320, 1,5 "x2"), che fornisce la base del display
	del sistema. Quindi su uno schermo da 160 dpi questo valore di densità sarà 1;
	su uno schermo da 120 dpi sarebbe .75; eccetera.*/
	/*Questo valore non segue esattamente le dimensioni reali dello schermo
	(come indicato da xdpi e ydpi, ma piuttosto viene utilizzato per ridimensionare la
	dimensione dell'interfaccia utente globale in passaggi basati su cambiamenti
	grossolani nel dpi di visualizzazione. Ad esempio, uno schermo 240x320 avrà un
	densità di 1 anche se la sua larghezza è 1,8 ", 1,3", ecc. Tuttavia, se la
	risoluzione dello schermo viene aumentata a 320x480 ma la dimensione dello schermo
	rimane 1,5 "x2", la densità verrebbe aumentata (probabilmente a 1,5).*/
	val xdpi = dm.xdpi
	//I pixel fisici esatti per pollice dello schermo nell'asse X.
	val ydpi = dm.ydpi
	//I pixel fisici esatti per pollice dello schermo nell'asse Y.
	val widthPixel = dm.widthPixels
	//La larghezza assoluta della dimensione di visualizzazione disponibile in pixel.
	val heightPixel = dm.heightPixels
	//L'altezza assoluta della dimensione di visualizzazione disponibile in pixel.
	val screenWidth = dm.widthPixels / dm.density
	//La larghezza relativa della dimensione di visualizzazione disponibile in pixel.
	val screenHeight = dm.heightPixels / dm.density
	//L'altezza relativa della dimensione di visualizzazione disponibile in pixel.

view raw screen1.kt hosted with ❤ by GitHub

• applicationContext.resources.displayMetrics - contiene le informazioni principali dello schermo attuale
• density - è il rapporto di densità dello schermo
• xdpi - sono i pixel fisici esatti per pollice dello schermo nell'asse X
• ydpi - sono i pixel fisici esatti per pollice dello schermo nell'asse Y
• widthPixel - è la larghezza assoluta della dimensione di visualizzazione disponibile in pixel
• heightPixels - è l'altezza assoluta della dimensione di visualizzazione disponibile in pixel
• screenWidth - è larghezza relativa della dimensione di visualizzazione disponibile in pixel tenendo conto del rapporto di densità
• screenHeight - è l'altezza relativa della dimensione di visualizzazione disponibile in pixel tenendo conto del rapporto di densità

Altro aspetto importante per definire il layout di una applicazione è Smallest Screen Width che è possibile ricavare utilizzando queste righe di codice:

	//Smallest Screen Width in dp
	val config: Configuration = resources.configuration
	val ssw = config.smallestScreenWidthDp

view raw screen2.kt hosted with ❤ by GitHub

Il valore della variabile ssw è quello che può essere usato quando creiamo dei file resources utilizzando l'attributo identificativo Smallest Screen Width.

Ecco come altri valori di larghezza schermo (Smallest Screen Width) corrispondono alle dimensioni tipiche di schermo:

• 320dp: un tipico schermo di telefono (240x320 ldpi, 320x480 mdpi, 480x800 hdpi, ecc.)
• 480dp: un grande schermo di telefono ~ 5"(480x800 mdpi)
• 600dp: un tablet da 7 "(600x1024 mdpi)
• 720dp: un tablet da 10 "(720x1280 mdpi, 800x1280 mdpi, ecc.)

Fonte: Andorid Studio

Ecco l'esempio pratico:

Aspetto del testo su uno schermo:

• Density factor = 0,75x
• dpi = 120 dpi (0,75 volte densità "base")
• Smallest Screen Width = 320dp

• Density factor = 3,5x
• dpi = 560 dpi (3,5 volte densità "base")
• Smallest Screen Width = 411dp

Aspetto del testo su uno schermo:

• Density factor = 2x
• dpi = 320 dpi (2 volte densità "base")
• Smallest Screen Width = 360dp

Aspetto del testo su uno schermo:

• Density factor = 2x
• dpi = 320 dpi (2 volte densità "base")
• Smallest Screen Width = 600dp

Questo esempio è stato fatto per capire meglio come funziona la gestione dello schermo in Android. Ho creato tre file di tipo dimens.xml differenziandoli con l'attributo Smallest Screen Width in questo modo:

• dimens.xml - è il file che contiene la dimensione del testo su uno schermo con Smallest Screen Width fino a 359dp
• dimens.xml (sw360dp) - è il file che contiene la dimensione del testo su uno schermo con Smallest Screen Width = 360dp in poi
• dimens.xml (sw400dp) - è il file che contiene la dimensione del testo su uno schermo con Smallest Screen Width = 400dp in poi

Ecco come si presenta il file dimens.xml

	<?xml version="1.0" encoding="utf-8"?>
	<resources>
	<dimen name="txtSize">10sp</dimen>
	</resources>

view raw dimens_sz1.xml hosted with ❤ by GitHub

Ecco come si presenta il file dimens.xml (sw360dp)

	<?xml version="1.0" encoding="utf-8"?>
	<resources>
	<dimen name="txtSize">14sp</dimen>
	</resources>

view raw dimens_sz2.xml hosted with ❤ by GitHub

Ecco come si presenta il file dimens.xml (sw400dp)

	<?xml version="1.0" encoding="utf-8"?>
	<resources>
	<dimen name="txtSize">18sp</dimen>
	</resources>

view raw dimens_sz3.xml hosted with ❤ by GitHub

Importante sapere che questo concetto di Smallest Screen Width può essere applicato a qualsiasi tipo di file contenuto all'interno della cartella res come a desempio:

• drawable
• layout
• menu
• colors
• dimens
• styles

Download Project
Download file APK