Android için açılış ekranı boyutları
ve aynı zamanda Cordova (diğer adıyla Phonegap), React-Native ve diğer tüm geliştirme platformları için
Format : 9-Patch PNG (recommended)
Dimensions
- LDPI:
- Portrait: 200x320px
- Landscape: 320x200px
- MDPI:
- Portrait: 320x480px
- Landscape: 480x320px
- HDPI:
- Portrait: 480x800px
- Landscape: 800x480px
- XHDPI:
- Portrait: 720px1280px
- Landscape: 1280x720px
- XXHDPI
- Portrait: 960x1600px
- Landscape: 1600x960px
- XXXHDPI
- Portrait: 1280x1920px
- Landscape: 1920x1280px
Not: XXXHDPI'nin hazırlanması gerekli değildir ve ayrıca 9 yama görüntülerinin yinelenen alanları nedeniyle XXHDPI boyutu da olabilir. Öte yandan, yalnızca Dikey boyutları kullanılıyorsa, Uygulama boyutu daha az olabilir. Daha fazla resim, daha fazla alana ihtiyaç olduğu anlamına gelir.
Çok dikkat
Tüm cihazlar için kesin bir boyut olmadığını düşünüyorum. Ben Xperia Z 5" kullanın. Bir crossplatform-webview uygulaması size (ekran, vb yazılım tuşu gezinti düğmelerini olup olmamasına bakılmaksızın) bir çok şey düşünmelisiniz geliştirirseniz. Bu nedenle, sadece tek uygun çözüm olduğunu düşünüyorum. Çözümdür için 9 yamalı bir açılış ekranı hazırlayın ( How to design a new splash screenaşağıdaki başlığı bulun ).
- Yukarıdaki ekran boyutları için 9 yama olarak açılış ekranları oluşturun . Dosyalarınıza .9.png son ekleriyle isim verin
- Aşağıdaki satırları config.xml dosyanıza ekleyin
- Gerekirse açılış ekranı eklentisini ekleyin.
- Projenizi çalıştırın.
Bu kadar!
Cordova'ya özel kod
9 yamalı açılış ekranları için config.xml'ye satırlar eklenecek
<preference name="SplashScreen" value="screen" />
<preference name="SplashScreenDelay" value="6000" />
<platform name="android">
<splash src="res/screen/android/ldpi.9.png" density="ldpi"/>
<splash src="res/screen/android/mdpi.9.png" density="mdpi"/>
<splash src="res/screen/android/hdpi.9.png" density="hdpi"/>
<splash src="res/screen/android/xhdpi.9.png" density="xhdpi"/>
</platform>
9 yamalı olmayan açılış ekranları kullanılırken config.xml dosyasına satır eklemek için
<platform name="android">
<splash src="res/screen/android/splash-land-hdpi.png" density="land-hdpi"/>
<splash src="res/screen/android/splash-land-ldpi.png" density="land-ldpi"/>
<splash src="res/screen/android/splash-land-mdpi.png" density="land-mdpi"/>
<splash src="res/screen/android/splash-land-xhdpi.png" density="land-xhdpi"/>
<splash src="res/screen/android/splash-port-hdpi.png" density="port-hdpi"/>
<splash src="res/screen/android/splash-port-ldpi.png" density="port-ldpi"/>
<splash src="res/screen/android/splash-port-mdpi.png" density="port-mdpi"/>
<splash src="res/screen/android/splash-port-xhdpi.png" density="port-xhdpi"/>
</platform>
Yeni bir açılış ekranı nasıl tasarlanır
Bu şekilde uygun bir açılış ekranı oluşturmanın basit bir yolunu açıklardım. 1280dp x 720dp - xhdpi (x-büyük) ekran tasarladığımızı varsayalım. Aşağıdakileri örnek uğruna yazdım;
Photoshop'ta: Dosya -> Yeni iletişim penceresindeki yeni ekranlarınızı ayarlayın
Genişlik: 720 Piksel Yükseklik: 1280 Piksel
Sanırım yukarıdaki boyutlar Çözünürlük 320 Piksel / İnç anlamına geliyor. Ancak, iletişim pencerenizde çözünürlük değerini 320 olarak değiştirebileceğinizden emin olmak için. Bu durumda Piksel / İnç = DPI
Tebrikler ... 720dp x 1280dp açılış ekranı şablonunuz var.
9 yamalı açılış ekranı nasıl oluşturulur
Açılış ekranınızı tasarladıktan sonra, 9-Patch açılış ekranı tasarlamak istiyorsanız, her taraf için 1 piksel boşluk eklemelisiniz. Bu nedenle tuval boyutunuzun genişliğini ve yüksekliğini +2 piksel artırmalısınız (artık görsel boyutlarınız 722 x 1282'dir).
Aşağıda belirtildiği gibi her tarafta boş 1 piksel boşluğu bıraktım.
Photoshop kullanarak tuval boyutunu değiştirme:
- Photoshop'ta bir açılış ekranı png dosyası açın
- Katmanlar alanında (beyaz gibi başka bir renk yerine boş bırakmak için) 'Arka Plan' adının yanındaki kilit simgesine tıklayın. aşağıda: - Tuval boyutunu Görüntü menüsünden değiştirin (Genişlik: 720 piksel ila 722 piksel ve Yükseklik: 1280 piksel ila 1282 piksel). Şimdi, açılış ekranı görüntüsünün her tarafında 1 piksel boşluk görmelisiniz.
Ardından, 9 yama dosyasını dönüştürmek için C: \ Program Files (x86) \ Android \ android-studio \ sdk \ tools \ draw9patch.bat'ı kullanabilirsiniz. Bunun için draw9patch uygulamasında açılış ekranınızı açın. Logonuzu ve genişletilebilir alanları tanımlamalısınız. Siyah çizgiye aşağıdaki örnek açılış ekranına dikkat edin. Siyah çizginin kalınlığı sadece 1 pikseldir;) Sol ve Üst taraftaki siyah çizgiler, açılış ekranınızın zorunlu görüntüleme alanını tanımlar. Tam olarak tasarladığınız gibi. Sağ ve Alt çizgiler eklenebilir ve çıkarılabilir alanı (otomatik olarak tekrar eden alanlar) tanımlar.
Sadece şunu yapın:
Draw9patch uygulamasında resminizin üst kenarını yakınlaştırın. Çizgi çizmek için farenizi tıklayın ve sürükleyin. Ve çizgiyi silmek için üst karakter + tıklayın ve farenizi sürükleyin.
Çapraz platform uygulaması geliştirirseniz (Cordova / PhoneGap gibi), aşağıdaki adresi hemen hemen tüm mabile işletim sistemi açılış ekranı boyutlarını bulabilirsiniz. İçin tıklayınız Windows Phone , WebOS , BlackBerry , Bada-WAC ve Bada'nın sıçrama ekran boyutları.
https://github.com/phonegap/phonegap/wiki/App-Splash-Screen-Sizes
Ve IOS, Android vb. Uygulama simge boyutlarına ihtiyacınız varsa burayı ziyaret edebilirsiniz .
IOS
Format : PNG (recommended)
Dimensions
- Tablet (iPad)
- Non-Retina (1x)
- Portrait: 768x1024px
- Landscape: 1024x768px
- Retina (2x)
- Portrait: 1536x2048px
- Landscape: 2048x1536px
- Handheld (iPhone, iPod)
- Non-Retina (1x)
- Portrait: 320x480px
- Landscape: 480x320px
- Retina (2x)
- Portrait: 640x960px
- Landscape: 960x640px
- iPhone 5 Retina (2x)
- Portrait: 640x1136px
- Landscape: 1136x640px
- iPhone 6 (2x)
- Portrait: 750x1334px
- Landscape: 1334x750px
- iPhone 6 Plus (3x)
- Portrait: 1242x2208px
- Landscape: 2208x1242px