Birden çok ekranı desteklemek için Uygulama İskeleti


94

Android'in farklı Özellikler, Çözünürlük ve Ekran boyutuna sahip çeşitli cihazlarla geldiğini bildiğimiz gibi, birden fazla (küçük ve büyük) ekranı destekleyen bir Uygulama geliştirirken boyut ve düzen açısından bir engel var.

Bu, farklı ekran boyutları, çözünürlükler ve DPI kombinasyonlarına yol açar ve Android cihazlar için tasarlarken ve geliştirirken oldukça zorluk yaratır. Diğer bazı Üreticilerin (Android olmayan) farklı çözünürlükleri ve DPI değerleri olsa da, aynı ekran boyutunu paylaşırlar ve çözünürlükler aynı en boy oranını izler. Bu nedenle, Android olmayan cihazlara uyacak bir görüntü oluşturulabilir.

Sorum şu ki, gereksinimi karşılamak için izlenmesi gereken uygun bir akış veya mimari var mı?

görüntü açıklamasını buraya girin

Farklı Boyut ve Çözünürlükte Tabletlerimiz olduğunu unutmayın.

Android Geliştiricisinin bu bilgileri içerdiğinin farkındayım ancak benim görüşüm uygulamadan geliyor.

Bildiğim kadarıyla Android grafikleri tasarlamak için Programcı'nın bile tasarım konseptini bilmesi gerektiğini anladım.


14
Bu sorunun yapıcı olmadığından emin misiniz çocuklar?
Mohammed Azharuddin Shaikh

6
Bunun çok yapıcı olduğunu düşünüyorum. Olumsuz oyların nedenlerini öğrenmek isterim.
Lazy Ninja

11
@MKJParekh MicroMax Funbook gsmarena.com/micromax_funbook_p300-4701.php'yi 7", 480X800, Ldpi (133 dpi) al bana hangi kategoride (drawble-large veya Ldpi veya Android v3.0 sw-480) düşeceğini söyleyebilir misiniz?
Mohammed Azharuddin Shaikh

1
@LazyNinja'nın olumsuz oylanmasının nedeni deliler ve çılgın insanlar. Sadece yapıcı sorular
sorabileceklerini düşünenler

1
@AZ_ :) Bu res yapısını res klasöründe çekilebilir çekilebilir-hdpi çekilebilir-hdpi-v11 çekilebilir-hdpi-v9 çekilebilir-büyük çekilebilir-büyük-hdpi çekilebilir-ldpi çekilebilir-mdpi çekilebilir-mdpi-v11 çekilebilir-küçük çekilebilir- kullandık xhdpi drawable-xhdpi-v11 drawable-xxhdpi drawable-xxhdpi-v11 layout layout-small layout-sw530dp layout-sw720dp layout-xlarge values ​​values-sw530dp values-sw720dp values-v14 values-xlarge ve değerler klasöründen xml'de iyi tanımlanmış boyutları kullandı . FYKI uygulamamız 5 binden fazla cihaz türünü desteklemektedir.
MKJParekh

Yanıtlar:


147

Sonunda, çoklu ekran için düzenleri ve simgeyi işleyen bir yapı oluşturdu.

Android, cihaz görüntülerini iki parametreye göre kategorilere ayırır:

  • Ekran boyutu, ekranın fiziksel boyutu (çapraz olarak ölçülür)
  • Ekran yoğunluğu, ekranın fiziksel piksel yoğunluğu (inç başına piksel veya ppi cinsinden) '

Ekran boyutunu ve yoğunluğunu hızlı bir şekilde belirlemek için lütfen Android için "Boyutum Nedir " uygulamasını yükleyin .

Ekran boyutu

Android, dört genelleştirilmiş ekran boyutu tanımlar:


 Qualifier           Size

 small               ~3 inches (approx) 
 normal              ~4 inches (approx) 
 large               Exceeds 4 inches    
 xlarge              Exceeds 7 inches  
  • Çoğu telefon küçük veya normal olarak sınıflandırılır (çapraz olarak kabaca 3 ila 4 inç). Ama şimdi Galaxy S4, HTC One, Xperia Z gibi geniş ekranlı birçok telefon var.
  • Samsung Galaxy Tab gibi küçük bir tablet, büyük (4 inçten büyük) olarak sınıflandırılır
  • Ekstra büyük, büyük cihazlar için geçerlidir, örneğin büyük tabletler

Android, dört genelleştirilmiş ekran yoğunluğu tanımlar:


 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

Tipik:

  • Uygulama düzenleriniz üzerinde en çok ekran boyutu etkiye sahiptir
  • Görüntü ve grafik kaynaklarınız üzerinde en çok ekran yoğunluğu etkindir

Burada cihaz ekranının yüzde farkı listelenmiştir

  • Ldpi -% 75
  • Mdpi-% 100 (Android geliştirici sitesine göre taban)
  • Hdpi -% 150
  • XHdpi -% 200

görüntü açıklamasını buraya girin

Ancak şimdi bildiğimiz gibi, cihazın çoğunun 480X800 ile geldiğini biliyoruz, bu yüzden bunu temelli cihaz olarak kabul ediyorum, bu nedenle yeni hesaplamamız bunu beğenecek

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

bu, ilk simge ve tasarımın yalnızca 480X800 için ve sonra geri kalanlar için (yani Ldpi, Mdpi, Xhdpi) oluşturulacağı anlamına gelir .

Tüm düzen için ortak olan ve renk ve şekil bakımından aynı olması gereken (karmaşık şekil, eğri yok) resimler vardır, bu nedenle bu tür bir görüntü 9patchiçin "çekilebilir (son eksiz)" klasöre konulacak görüntüler oluşturuyoruz . 9Patch görüntüsü oluşturmak için DrawNinePatch veya BetterNinePatch kullanabilirsiniz.

Şimdi sadece resimlerinizi Android standartlarına göre yeniden adlandırın ve uygulamanızı tamamlayın hdpive ardından sadece drawable-hdpiklasörü alın ve Adode Photoshop'u açın (önerilen) Eylem tüm boyutlar için oluşturulduktan sonra birden çok boyutta Eylem oluşturun (yalnızca boyutu yüzde oranına göre değiştirin) sonra yapın Toplu Otomatikleştirin ve kaynağı (çekilebilir-hdpi) ve hedefi (çekilebilir-ldpi, çekilebilir-mdpi, çekilebilir-xdpi) verin.

Photoshop'u kullanmanız için ısrar etmemin nedeni, görüntünüzü Eylemler ile otomatik olarak yeniden boyutlandıracak ve bir artı nokta daha dosyayı yeniden adlandırmanıza gerek olmamasıdır (orijinal olanla aynı adı atayacaktır).

Tüm görüntülerin oluşturulmasını tamamladıktan sonra, projenizi yenileyin ve test edin.

Bazen ekranı (xhdpi, hdpi, mdpi) destekleyen düzenin küçük ekranda (ldpi) kesilmesi olasılığı olabilir, bu nedenle bunun için ayrı bir Düzen klasörü (düzen-küçük) oluşturun ve ScrollView(çoğunlukla) ekleyin . Bu kadar.

Tablet Tabletler iki boyutta kategorize edilir.

  1. 7 "(1024X (600-48 (gezinme çubuğu))) = 1024X552 (çekilebilir büyük)
  2. 10 "(1280X (800-48 (gezinme çubuğu))) = 1280X752 (çekilebilir xlarge)

Bunda hem ekran için görüntü oluşturmalı hem de onları buna göre yerleştirmeliyiz

Sonuç olarak, uygulamamızda birden çok ekranı desteklemek için bu klasöre sahip olacağız.

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

ile daha niteleyici kombinasyon olacak Screen size and Screen density

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

ile daha niteleyici Screen density and Version

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

ve daha niteleyici Screen size and Version

drawable-large-v11
drawable-xlarge-v11

ve daha niteleyici Smallest width concept(SW)

 drawable-sw???dp

Dahası, Android V3.0 Honeycomb'da SW(smallest width)hangi cihazın ekran genişliğine göre kategorize edildiğine dair yeni bir konsept sundular , bu nedenle adlı bir klasör oluşturursak drawable-sw360dp720dp (genişlik veya yükseklik) olan cihaz bu klasördeki kaynağı kullanacaktır.

örneğin çekilebilir-sw? dp için Samsung Galaxy S3 dp sonekini bulmak için DP Hesaplamasına referansla, Düzeninizi veya S3 için çizilebilirliği desteklemek istiyorsanız, hesaplamada

px = Cihaz genişliği = 720
dpi = Cihaz yoğunluğu = 320

formül verildi

    px = dp * (dpi / 160)

formülün değişmesi nedeniyle piksel değerine sahibiz

    dp = px / (dpi / 160)

şimdi değer katmak,

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

bu yüzden drawable-sw360dpişi yapacak

GsmArena'dan Cihaz konfigürasyonunu alın Sameway , Cihazın Android API sürümüne göre klasör de oluşturabilirsiniz, yani çekilebilir-hdpi-v11` böylece API11 ve Hdpi olan cihaz bu kaynakları kullanacaktır.

Ek İpuçları:

  • Göreli düzenler, dp, sp ve mm kullanın

    dp birimleri - 160 ppi ekranda, yani orta yoğunlukta 1 fiziksel piksele normalize edilen aygıttan bağımsız pikseller. Çalışma zamanında ölçeklendi. Ekran öğesi boyutları için kullanın

    sp birimleri - dp birimlerine göre kayan nokta değerleri olarak belirtilen, ancak ek olarak kullanıcının yazı tipi boyutu tercih ayarı için ölçeklenen ölçeklenmiş pikseller. Çalışma zamanında ölçeklendi. Yazı tipi boyutları için kullanın

    mizanpajlar için her zaman RelativeLayout kullanmalısınız; AbsoluteLayout kullanımdan kaldırılmıştır ve kullanılmamalıdır.

  • Uygun görüntü formatlarını kullanın - PNG'ye karşı JPEG

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

    Ancak PNG ve JPEG eşdeğer değildir. Farklı kalitede değiş tokuşları vardır ve PNG her zaman en iyisi değildir:

    JPEG , PNG'ye göre% 50'ye kadar dosya boyutu küçültme sunabilir; bu, uygulamanız yoğun görüntü gerektiriyorsa önemlidir

    Daha yüksek kaliteli "kayıplı" bir JPEG, aynı dosya boyutu için yüksek oranda sıkıştırılmış "kayıpsız" bir PNG'den daha iyi görünebilir

  • Hata ayıklama için resimlerinize ve grafiklerinize etiketler ekleyin

  • Destek ekranları öğesini kullanın

  • Emülatörlerinizi gerçek cihaz değerleriyle yapılandırın

    Geleneksel olarak, masaüstü sistemleri 72ppi (Mac) veya 96ppi (Windows, Linux) olarak görüntülenir. Mobil cihazlarla karşılaştırıldığında, masaüstü ekranlar her zaman düşük yoğunluktadır.

    Android emülatörlerinizi her zaman gerçek cihaz değerlerini taklit edecek şekilde yapılandırın ve her zaman cihaz yoğunluğunu taklit edecek şekilde ölçeklendirin.

    Eclipse'de, gerçek aygıtlar için değerlerle yapılandırılmış birden çok öykünücü (Eclipse menü çubuğundan Pencere> AVD Yöneticisi> Yeni'yi seçin ) oluşturmak kolaydır :

    Öykünücüyü taklit ettiği gerçek cihaz için adlandırın Çözünürlüğü belirtin, Yerleşik genel boyutları kullanmayın Cihaz yoğunluğunu gerçek cihazla eşleşecek şekilde ayarlayın (Donanım bölmesinde Soyutlanmış LCD Özelliğini gerçek yoğunluğa ayarlayın, her zaman bir tamsayı değeri)

    Cihazı başlattığınızda her zaman Ekranı gerçek boyuta ölçeklendir öğesini seçin ve inç cinsinden gerçek ekran boyutunu yazın.

    Aygıt yoğunluğunu ayarlamazsanız, öykünücü varsayılan olarak düşük yoğunluğa ayarlanır ve her zaman ldpi'ye özgü kaynakları yükler. Çözünürlük (piksel boyutları) doğru olacaktır, ancak yoğunluğa bağlı görüntü kaynaklarınız amaçlandığı gibi görüntülenmeyecektir.

    Elbette, yaptığınız hiçbir şey daha düşük yoğunluklu bir masaüstü ekranda daha yüksek yoğunluklu görüntü kalitesi üretemez.

İşte 1 Ekim 2012'de sona eren 7 günlük bir süre boyunca toplanan Veriler. Android platform sürümüyle ilgili en son istatistiği görmek için buraya gidin.

Ekran Boyutuna Göre

görüntü açıklamasını buraya girin

Ekran Yoğunluğuna Göre

görüntü açıklamasını buraya girin


2
Samsung galaxy tab 7 "için görüntüleri çekilebilir-büyük-hdpi altında tutmalıyız, aksi takdirde görüntü uzar veya
küçülür

@rajpara çok fazla kombinasyon ve permütasyon var, tüm bu tür durumları daha sonra dahil edeceğiz.
Mohammed Azharuddin Shaikh

1
@AlexBonel'e bakın, ya size katılıyorum, ancak ana sloganım Çoklu ekran desteği söz konusu olduğunda işlerin nasıl yapılacağının farkında olmaktır. Yukarıdakiler ilk sorunu açıklığa kavuşturmak için olduğundan, bu akış / kavram değiştirilebilir / manipüle edilebilir. Ek olarak, uygulama tasarımına dayalı değişiklikler de yapıyorum. Gönderiniz bana kavramı anladığınızı hissettiriyor. Umarım benim fikrimi anlamışsındır.
Muhammed Azharuddin Shaikh

1
Güzel cevap. Bu istisnaların neden oluştuğunu pek çok ve günlerce araştırdıktan sonra, bu yazıyı harika örnek ve açıklamalarla en iyi cevap olarak aldım. Örneğin Halo Value 7 inç tableti düşünün. ÜFE = 133. Çözünürlük = 480 * 800. Boyut = 7 inç. Mdpi'yi taban olarak kabul edersek, değerler-sw480'de tanımlanan boyutu almalı, ancak boyutları-sw600'den alıyor. Bunun neden olduğunu anlamadım. Gönderiniz için gerçekten çok teşekkür ederim. Zaman kaybından kurtulun ve kafa karışıklığını giderin. Bunun Android'in resmi sitesinde olması gerektiğini düşünüyorum. Çabanız için minnettarım.
Smeet

1
Sanırım bu şimdiye kadar gördüğüm en iyi cevap. Uzun zamandır böyle bir cevap arıyorum. Ve sonunda anladım. Bu cevabın daha anlaşılır olması için katkıda bulunan herkese teşekkürler.
Hiren Dixit

1

Tasarımcılar temel tasarımlarını oluşturmalıdır

base size of mdpi devices * density conversion factor of highest supported density bucket
Temel ekran boyutu 320 X 480 pikseldir ve yoğunluk bölümleri aşağıdaki gibidir:

  • ldpi: 0,75
  • mdpi: 1.0 (temel yoğunluk)
  • hdpi: 1.5
  • xhdpi: 2.0
  • xxhdpi: 3.0
  • xxxhdpi: 4.0

Ve Android cihazlarda fazladan kullanılabilir alanla uğraşmak için her iki yönde de (yatay ve dikey) gerilebilir bileşenler kullanmalısınız. Ayrıntılı bilgi burada mevcuttur:

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

Sitemizi kullandığınızda şunları okuyup anladığınızı kabul etmiş olursunuz: Çerez Politikası ve Gizlilik Politikası.
Licensed under cc by-sa 3.0 with attribution required.