Scheletro dell'applicazione per supportare più schermi


92

Come sappiamo, Android viene fornito con vari dispositivi che hanno diverse caratteristiche, risoluzione e dimensioni dello schermo, quindi durante lo sviluppo di un'applicazione che supporta schermi multipli (piccoli e grandi) c'è un ostacolo di dimensioni e layout.

Ciò porta a diverse combinazioni di dimensioni dello schermo, risoluzioni e DPI e crea una vera sfida durante la progettazione e lo sviluppo per dispositivi Android. Mentre alcuni altri produttori (non Android) hanno risoluzioni e DPI diversi, condividono le stesse dimensioni dello schermo e le risoluzioni seguono le stesse proporzioni. Pertanto, è possibile creare un'immagine per adattarsi ai dispositivi non Android.

La mia domanda è che esiste un flusso o un'architettura adeguati da seguire per soddisfare il requisito?

inserisci qui la descrizione dell'immagine

Ricorda che abbiamo tablet di dimensioni e risoluzione diverse.

Sono consapevole che Android Developer contiene queste informazioni, ma la mia opinione proviene dall'implementazione.

Dalla mia conoscenza quello che ho capito è che per progettare la grafica Android anche il Programmatore deve conoscere il concetto di progettazione.


13
Ragazzi, siete sicuri che questa domanda non sia costruttiva?
Mohammed Azharuddin Shaikh

6
Penso che sia molto costruttivo. Vorrei conoscere le ragioni dei voti negativi.
Lazy Ninja

11
@MKJParekh prendi MicroMax Funbook gsmarena.com/micromax_funbook_p300-4701.php 7", 480X800, Ldpi (133 dpi) puoi dirmi in quale categoria (drawble-large o Ldpi o se Android v3.0 sw-480) cadrà?
Mohammed Azharuddin Shaikh

1
@LazyNinja la ragione dei voti negativi sono pazzi e pazzi. Chi pensa di poter solo fare domande costruttive: p
AZ_

1
@AZ_ :) Abbiamo usato questa struttura res nella cartella res drawable drawable-hdpi drawable-hdpi-v11 drawable-hdpi-v9 drawable-large drawable-large-hdpi drawable-ldpi drawable-mdpi drawable-mdpi-v11 drawable-small drawable- xhdpi drawable-xhdpi-v11 drawable-xxhdpi drawable-xxhdpi-v11 layout layout-small layout-sw530dp layout-sw720dp layout-xlarge valori valori-sw530dp valori-sw720dp valori-v14 valori-xlarge e dimensioni ben definite utilizzate in XML dalla cartella valori . FYKI la nostra applicazione supporta più di 5k tipi di dispositivi.
MKJParekh

Risposte:


147

Infine ha creato una struttura che gestisce i layout e l'icona per più schermi.

Android generalizza i display dei dispositivi in ​​categorie in base a due parametri:

  • Dimensioni dello schermo, la dimensione fisica del display (misurata diagonalmente)
  • Densità dello schermo, la densità fisica dei pixel del display (in pixel per pollice o ppi) `

Per determinare rapidamente le dimensioni e la densità dello schermo, installa l' app " Qual è la mia dimensione " per Android.

Dimensione dello schermo

Android definisce quattro dimensioni dello schermo generalizzate:


 Qualifier           Size

 small               ~3 inches (approx) 
 normal              ~4 inches (approx) 
 large               Exceeds 4 inches    
 xlarge              Exceeds 7 inches  
  • La maggior parte dei telefoni è classificata come piccola o normale (circa 3-4 pollici in diagonale). Ma ora ci sono molti telefoni con schermo grande come Galaxy S4, HTC One, Xperia Z
  • Un tablet piccolo come il Samsung Galaxy Tab è classificato come grande (più grande di 4 pollici)
  • Extra-large si applica a dispositivi di grandi dimensioni, ad esempio tablet di grandi dimensioni

Android definisce quattro densità dello schermo generalizzate:


 Qualifier         Description         Nominal value

 ldpi              low density          120 ppi
 mdpi              medium density       160 ppi
 hdpi              high density         240 ppi
 xhdpi             extra high density   320 ppi

Tipicamente:

  • la dimensione dello schermo ha il maggiore impatto sui layout delle app
  • la densità dello schermo ha un impatto maggiore sull'immagine e sulle risorse grafiche

È elencata qui la differenza percentuale dello schermo del dispositivo

  • Ldpi- 75%
  • Mdpi- 100% (base secondo il sito degli sviluppatori Android)
  • Hdpi- 150%
  • XHdpi- 200%

inserisci qui la descrizione dell'immagine

Ma come sappiamo ora la maggior parte dei dispositivi viene fornito con 480X800, quindi lo considero un dispositivo basato, quindi il nostro nuovo calcolo piacerà

  • Ldpi- 50%
  • Mdpi - 66,67%
  • Hdpi- 100%
  • XHdpi - 133,33%

il che significa che la prima icona e il design verranno creati solo per 480X800 e poi per quelli restanti (cioè Ldpi, Mdpi, Xhdpi).

Ci sono immagini che sono comuni a tutti i layout e devono essere uniformi per colore e forma (nessuna forma complessa, nessuna curva) quindi per questo tipo di immagine stiamo creando 9patchquella da mettere nella cartella “drawable (no-suffix)”. Per creare un'immagine 9Patch puoi usare DrawNinePatch o BetterNinePatch

Ora rinomina le tue immagini in base agli standard di Android e completa l'applicazione con, hdpiquindi prendi la drawable-hdpicartella e apri Adode Photoshop (consigliato) crea un'azione di dimensioni multiple (cambia semplicemente la dimensione in base al rapporto percentuale) una volta creata l'azione per tutte le dimensioni, quindi fallo Automatizza in batch e fornisce origine (drawable-hdpi) e destinazione (drawable-ldpi, drawable-mdpi, drawable-xdpi).

Il motivo per cui insisto affinché utilizzi Photoshop perché ridimensionerà automaticamente la tua immagine con Azioni e un altro punto in più è che non è necessario rinominare il file (assegnerà lo stesso nome di quello originale).

una volta completata la creazione di tutte le immagini, aggiorna il progetto e provalo.

A volte può esserci la possibilità che il layout che supporta lo schermo (xhdpi, hdpi, mdpi) possa essere tagliato in small screen (ldpi), quindi per gestirlo basta creare una cartella Layout separata (layout-small) e aggiungere ScrollView(principalmente). Questo è tutto.

I tablet tablet sono suddivisi in due dimensioni.

  1. 7 "(1024X (600-48 (barra di navigazione))) = 1024X552 (drawable-large)
  2. 10 "(1280X (800-48 (barra di navigazione))) = 1280X752 (drawable-xlarge)

In questo dobbiamo creare un'immagine per entrambi lo schermo e inserirli di conseguenza

Quindi tutto sommato avremo questa cartella nella nostra applicazione per supportare più schermi.

drawable
drawable-ldpi
drawable-mdpi
drawable-hdpi
drawable-xhdpi
drawable-large
drawable-xlarge

sarà una combinazione più qualificante con Screen size and Screen density

drawable-large-ldpi
drawable-large-mdpi
drawable-large-hdpi
drawable-large-xhdpi

più qualificatore con Screen density and Version

drawable-ldpi-v11
drawable-mdpi-v11
drawable-hdpi-v11
drawable-xhdpi-v11

e altro qualificatore con Screen size and Version

drawable-large-v11
drawable-xlarge-v11

e altro qualificatore con Smallest width concept(SW)

 drawable-sw???dp

Inoltre in Android V3.0 Honeycomb hanno introdotto un nuovo concetto di SW(smallest width)in cui i dispositivi sono classificati in base alla larghezza dello schermo, quindi se stiamo creando una cartella denominatadrawable-sw360dp il dispositivo con 720dp (larghezza o altezza) utilizzerà la risorsa da questa cartella.

ad esempio per trovare il Samsung Galaxy S3 dp da suffisso a drawable-sw? dp
Con riferimento al calcolo DP , se si desidera supportare il layout o disegnare su S3, il calcolo dice

px = Larghezza del dispositivo = 720
dpi = Densità del dispositivo = 320

formula data

    px = dp * (dpi / 160)

formula di scambio perché abbiamo il valore di px

    dp = px / (dpi / 160)

ora mettendo valore,

     dp= 720 / (320/160);
     dp=360. 

così drawable-sw360dp farà il lavoro

Ottieni la configurazione del dispositivo da GsmArena Allo modo puoi anche creare una cartella in base alla versione dell'API Android del dispositivo, ovvero drawable-hdpi-v11`, quindi il dispositivo che ha API11 ed è Hdpi utilizzerà queste risorse.

Suggerimenti aggiuntivi:

  • Usa layout relativi, dp, sp e mm

    unità dp - pixel indipendenti dal dispositivo normalizzati a 1 pixel fisico su uno schermo da 160 ppi, ovvero densità media. Ridimensionato in fase di esecuzione. Utilizzare per le dimensioni degli elementi dello schermo

    unità sp - pixel scalati, specificati come valori in virgola mobile, basati sulle unità dp ma ulteriormente ridimensionati per l'impostazione della preferenza della dimensione del carattere dell'utente. Ridimensionato in fase di esecuzione. Utilizzare per le dimensioni dei caratteri

    dovresti sempre usare RelativeLayout per i layout; AbsoluteLayout è deprecato e non deve essere utilizzato.

  • Utilizza formati di immagine appropriati: PNG e JPEG

    Android "prefers" PNG for bitmap image files, "accepts" JPEG, and "discourages" GIF.

    Tuttavia, PNG e JPEG non sono equivalenti. Hanno diversi compromessi di qualità e PNG non è sempre il migliore:

    JPEG può offrire riduzioni delle dimensioni dei file fino al 50% rispetto a PNG, il che è significativo se la tua app utilizza molte immagini

    Un JPEG "lossy" di qualità superiore può avere un aspetto migliore di un PNG "lossless" altamente compresso, a parità di dimensione del file

  • Aggiungi etichette alle immagini e ai grafici per il debug

  • Usa l'elemento supporta-schermi

  • Configura i tuoi emulatori con valori reali del dispositivo

    Convenzionalmente, i sistemi desktop vengono visualizzati a 72ppi (Mac) o 96ppi (Windows, Linux). Rispetto ai dispositivi mobili, i display desktop sono sempre a bassa densità.

    Configura sempre i tuoi emulatori Android per imitare i valori reali del dispositivo e impostali sempre per la scalabilità per emulare la densità del dispositivo.

    In Eclipse, è facile creare più emulatori (dalla barra dei menu di Eclipse, selezionare Finestra> AVD Manager> Nuovo ) configurati con valori per dispositivi reali:

    Assegna un nome all'emulatore per il dispositivo reale che sta emulando Specifica la risoluzione, non utilizzare dimensioni generiche incorporate Imposta la densità del dispositivo in modo che corrisponda al dispositivo reale (nel riquadro Hardware imposta Proprietà LCD astratta alla densità reale, sempre un valore intero)

    Quando avvii il dispositivo, seleziona sempre Ridimensiona il display alle dimensioni reali e digita la dimensione reale dello schermo in pollici.

    Se non si imposta la densità del dispositivo, l'emulatore utilizza per impostazione predefinita la densità bassa e carica sempre le risorse specifiche di ldpi. La risoluzione (dimensioni in pixel) sarà corretta, ma le risorse dell'immagine dipendenti dalla densità non verranno visualizzate come previsto.

    Ovviamente, nulla di ciò che fai riprodurrà una qualità dell'immagine a densità maggiore su un display desktop a densità inferiore.

Di seguito sono riportati i dati raccolti durante un periodo di 7 giorni che termina il 1 ° ottobre 2012. Per visualizzare le statistiche più recenti sulla versione della piattaforma Android, fare clic qui

Basato sulle dimensioni dello schermo

inserisci qui la descrizione dell'immagine

Basato sulla densità dello schermo

inserisci qui la descrizione dell'immagine


2
Per samsung galaxy tab 7 "dobbiamo mantenere le immagini sotto drawable-large-hdpi altrimenti l'immagine verrà allungata o
rimpicciolita

@rajpara ci sono molte combinazioni e permutazioni, includeremo tutti questi casi in seguito.
Mohammed Azharuddin Shaikh

1
vedi @AlexBonel, sì, sono d'accordo con te, ma il mio motto principale è rendere consapevole di come le cose possono essere fatte quando si tratta di supporto multi-schermo. Si può modificare / manipolare questo flusso / concetto perché quanto sopra serve per chiarire il problema iniziale. Inoltre anch'io faccio modifiche in base al design dell'applicazione. Il tuo post mi dà la sensazione che tu abbia capito il concetto. Spero tu abbia capito il mio punto.
Mohammed Azharuddin Shaikh

1
Bella risposta. Dopo aver cercato tanto e tanti giorni perché si verificano queste eccezioni, ho ricevuto questo post come migliore risposta con un ottimo esempio e spiegazione. ad esempio, si consideri il tablet Halo Value da 7 pollici. PPI = 133. Risoluzione = 480 * 800. Dimensioni = 7 pollici. Se consideriamo mdpi come base, dovrebbe prendere la dimensione definita in values-sw480 ma sta prendendo la dimensione da values-sw600. Non ho capito perché sta succedendo. Grazie mille per il tuo post. Risparmia perdite di tempo e cancella la confusione. Penso che dovrebbe essere sul sito ufficiale di Android. Apprezzo il tuo impegno.
Incontro

1
Penso che questa sia la migliore risposta che abbia mai visto. Sto cercando una tale risposta da molto tempo. E finalmente ho capito. Grazie a tutti per aver contribuito a questa risposta per renderla più comprensibile.
Hiren Dixit

1

I progettisti dovrebbero creare modelli di base di

base size of mdpi devices * density conversion factor of highest supported density bucket
Le dimensioni dello schermo di base sono 320 X 480 px e i bucket di densità sono i seguenti:

  • ldpi: 0,75
  • mdpi: 1.0 (densità di base)
  • hdpi: 1.5
  • xhdpi: 2.0
  • xxhdpi: 3.0
  • xxxhdpi: 4.0

E per affrontare lo spazio disponibile in più sui dispositivi Android conviene utilizzare componenti estensibili in entrambe le direzioni (orizzontale e verticale). Informazioni dettagliate sono disponibili qui:

http://vinsol.com/blog/2014/11/20/tips-for-designers-from-a-developer/

Utilizzando il nostro sito, riconosci di aver letto e compreso le nostre Informativa sui cookie e Informativa sulla privacy.
Licensed under cc by-sa 3.0 with attribution required.