web-dev-qa-db-ja.com

Androidのスプラッシュスクリーンの画像サイズはすべてのデバイスに対応します

スプラッシュで表示したいフルスクリーンPNGがあります。そこにはたった一つのエラーがあります、そして私はすべての描画可能なフォルダ（ldpi、mdpi、hdpi、そしてxhdpi）にどんなサイズを入れるべきかわかりません。私のアプリケーションは、すべての携帯電話とタブレットで美しく、美しく動作するはずです。スプラッシュがすべての画面でNiceと表示されるように作成するサイズ（ピクセル単位）を教えてください。

androidpngscreendrawablesplash-screen
204
arielschon12

免責事項

この答えは2013年のもので、古くなっています。 Android 3.2以降、画面密度は6グループになりました。この回答はできる限り早く更新されますが、ETAはありません。現時点でのすべての濃度については、 オフィシャルドキュメント を参照してください（ただし、特定のピクセルサイズに関する情報はいつも見つけるのは難しいです）。

これがtl/drのバージョンです

  • スクリーン密度ごとに1つずつ、4つの画像を作成します。

    • xlarge（xhdpi）：640 x 960
    • 大（hdpi）：480×800
    • 中（mdpi）：320×480
    • 小（ldpi）：240×320

  • Android開発者ガイドの 9パッチイメージの紹介 を読んでください。

  • 最終結果を損なうことなく安全に拡大できる領域を持つ画像をデザインする

これにより、Androidはデバイスの画像密度に適したファイルを選択し、9パッチ標準に従って画像を拡大します。

tlの終わり; dr。フル投稿先

私は質問のデザイン関連の側面に関して答えています。私は開発者ではないので、提供されているソリューションの多くを実装するためのコードを提供することはできません。残念ながら、私の目的は、最初のAndroidアプリの開発を手伝ったときと同じくらい迷子になっているデザイナーを支援することです。

すべてのサイズにフィット

Androidを使用すると、企業は自分の携帯電話やほぼすべてのサイズのテーブルを、ほぼすべての解像度で開発することができます。そのため、スプラッシュスクリーンには「正しい画像サイズ」はありません。固定の画面解像度がないからです。それは、スプラッシュスクリーンを実装したい人々にとって問題となります。

あなたのユーザーは本当にスプラッシュスクリーンを見たいですか？

（ちなみに、スプラッシュスクリーンはユーザビリティの間ではややお勧めできません。ユーザーは自分がタップしたアプリを既に知っています。スプラッシュスクリーンで画像をブランディングする必要はないと主張しています。ただし、ゲームなどを含む初期化時にかなりの読み込みが必要なアプリケーションでは、アプリがクラッシュしたかどうかにかかわらずユーザーが迷うことがないように、「広告」を使用する必要があります。

スクリーン密度4クラス

そのため、市場に出回っている携帯電話の非常に多くの異なる画面解像度を考えると、グーグルはいくつかの代替案とそれに役立つ気の利いたソリューションを実装しました。あなたが知る必要がある最初の事はアンドロイドが4つの異なるスクリーン密度にALLスクリーンを分けるということです：

  1. 低密度（ldpi〜120dpi）
  2. 中密度（mdpi〜160dpi）
  3. 高密度（hdpi〜240dpi）
  4. 超高密度（xhdpi〜320dpi）（これらのdpi値は、おおよその目安です。カスタムビルドされたデバイスは異なるdpi値を持つため）

あなたが（あなたがデザイナーであれば）知っておくべきことは、デバイスに応じて、Androidは基本的に表示する4つの画像から選択するということです。したがって、基本的には4つの異なる画像をデザインする必要があります（ただし、ワイドスクリーン、ポートレート/ランドスケープモードなど、さまざまなフォーマット用に開発することができます）。

それを念頭に置いてこれを知っている：あなたがAndroidで使用されているすべての単一の解像度のための画面を設計しない限り、あなたの画像は画面サイズに合わせて拡大されます。そして、あなたのイメージが基本的にグラデーションかぼかしでない限り、あなたはストレッチングでいくらかの望まれない歪みを得るでしょう。したがって、基本的に2つの選択肢があります。それぞれのスクリーンサイズ/密度の組み合わせに対してイメージを作成するか、4つの9パッチイメージを作成します。

最も難しい解決策は、解像度ごとに異なるスプラッシュスクリーンを設計することです。 このページ の最後にある表の中の解決方法に従うことから始めることができます（他にもあります。例：960 x 720はそこにリストされていません）。また、小さなテキストなど、画像に細部があると仮定すると、各解像度に対して複数の画面をデザインする必要があります。たとえば、中サイズの画面で表示されている480 x 800の画像は問題ないように見えますが、小さい画面（密度/ dpiが高い）ではロゴが小さくなりすぎたり、テキストが判読できなくなることがあります。

9パッチ画像

もう1つの解決策は、 9パッチのイメージを作成する です。これは基本的には画像の周囲1ピクセルの透明な境界線です。この境界線の上部と左側の領域に黒いピクセルを描画することで、画像のどの部分を拡大できるかを定義できます。 9パッチ画像のしくみについては詳しく説明しませんが、要するに上部と左側の領域のマーキングに揃うピクセルが、画像を伸ばすために繰り返されるピクセルです。

いくつかの基本的な規則

  1. あなたはフォトショップ（または正確に透明なpngを作成できる任意の画像編集ソフトウェア）でこれらの画像を作ることができます。
  2. 1ピクセルの枠線はFULL TRANSPARENTである必要があります。
  3. 1ピクセルの透明な境界線は、上下左右だけでなく、画像全体に配置する必要があります。
  4. この領域には黒（＃000000）ピクセルしか描画できません。
  5. 画像のストレッチを定義する上と左の境界線は、1ドット（1ピクセル×1ピクセル）、2ドット（両方とも1ピクセル×1ピクセル）、または1本の連続線（幅×1ピクセルまたは1ピクセル×高さ）のみです。
  6. 2ドットを使用することを選択した場合、画像は比例して拡大されます（したがって、最終的な幅/高さに達するまで各ドットは順番に拡大されます）。
  7. 1pxの枠線は、目的の基本ファイルの寸法に追加する必要があります。そのため、100×100の9パッチの画像は実際には102×102（上下左右に100×100 + 1ピクセル）必要です。
  8. 9パッチ画像は* .9.pngで終わらなければなりません

そのため、ロゴの両側（上の境界線）に1ドット、上下（左の境界線）に1ドットを配置することができます。これらのマークされた行と列だけが伸縮するピクセルになります。

例

これは9パッチの画像、102×102ピクセル（アプリの目的のために100×100の最終サイズ）です。

9-patch image, 102x102px

これは、同じ画像を200％ズームしたものです。

the same image, magnified 2x for clarity

左上の1pxマークがどの行/列が展開されるかを言っているのに注目してください。

これは、この画像がアプリ内の100 x 100の場合の外観です。

rendered into 100x100

そしてこれが460x140に拡張された場合の望みです。

rendered into 460x140

考慮すべき最後のこと。これらの画像は、モニタ画面やほとんどの携帯電話ではきれいに見えることがありますが、デバイスの画像密度（dpi）が非常に高い場合、画像は小さすぎます。おそらくまだ判読可能ですが、1920 x 1200の解像度のタブレットでは、画像は中央に非常に小さな正方形として表示されます。だから解決策は何ですか？それぞれ異なる濃度セットに対して4つの異なる9パッチランチャー画像を設計します。縮小が発生しないようにするには、各密度カテゴリに対して最小の共通解像度で設計する必要があります。 9-patchはストレッチングのみを考慮しているため、縮小は望ましくありません。縮小プロセスでは、小さなテキストやその他の要素が読みにくくなる可能性があります。

これは、各密度カテゴリに対する最小の最も一般的な解像度のリストです。

  • xlarge（xhdpi）：640 x 960
  • 大（hdpi）：480×800
  • 中（mdpi）：320×480
  • 小（ldpi）：240×320

したがって、上記の解像度で4つのスプラッシュスクリーンをデザインし、画像を拡大し、キャンバスの周囲に1pxの透明な境界線を配置し、どの行/列を伸縮可能にするかをマークします。これらの画像は、密度カテゴリのANYデバイスに使用されるため、ldpi画像（240 x 320）は、特大サイズのタブレットで1024 x 600に拡大される場合があります。小さい画像密度（〜120 dpi）。スプラッシュスクリーンに写真や複雑なグラフィックを使用したくない場合は、9パッチが最適のストレッチングソリューションです（デザインを作成する際のこれらの制限に留意してください）。

繰り返しますが、このストレッチが起こらないようにする唯一の方法は、解像度ごとに1つのスクリーンを設計すること（または、高/低密度デバイスで画像が小さくなりすぎたり大きすぎたりしないようにする場合）。伸縮しないようにして背景色が表示されるようにします（Androidエンジンでレンダリングされた特定の色は、カラープロファイルのため、フォトショップでレンダリングされた同じ特定の色とは異なる場合があります）。

これがなんらかの意味を持つことを願っています。がんばろう！

390
Lucas Cerro

ポートレートモード

MDPIは320 x 480 dp = 320 x 480 px（1 x）

LDPIは0.75 x MDPI = 240 x 360 px

HDPIは1.5 x MDPI = 480 x 720 pxです

XHDPIは2 x MDPI = 640 x 960 pxです

XXHDPIは3 x MDPI = 960 x 1440 pxです

XXXHDPIは4 x MDPI = 1280 x 1920 pxです

横長モード

MDPIは480 x 320 dp = 480 x 320 px（1 x）

LDPIは0.75 x MDPI = 360 x 240 px

HDPIは1.5 x MDPI = 720 x 480 pxです

XHDPIは2 x MDPI = 960 x 640 pxです

XXHDPIは3 x MDPI = 1440 x 960 pxです

XXXHDPIは4 x MDPI = 1920 x 1280 pxです

編集：

2019年にこれを読んでいるのであれば、スプラッシュスクリーンに Lottie を使用することをお勧めします。

107
Ajmal Salim

肖像

LDPI：200×320ピクセル

MDPI：320×480ピクセル

HDPI：480×800ピクセル

XHDPI：720px1280px

LANDSCAPE

LDPI：320×200ピクセル

MDPI：480×320ピクセル

HDPI：800×480ピクセル

XHDPI：1280×720 px

28
JRE.exe

私は9パッチのイメージを作るための最良で最も簡単な答えを探しました。今9パッチのイメージを作ることは最も簡単な仕事です。

から https://romannurik.github.io/AndroidAssetStudio/index.html XHDPI、HDPI、MDPI、LDPIなど、すべての解像度に対して9パッチの画像をワンクリックで作成できます。

16
Owidat

PNGを使うのはそんなに良い考えではありません。実際には、パフォーマンスに関する限りコストがかかります。たとえば、 Facebookの背景 のように、描画可能なXMLファイルを使用できます。

これはあなたがあなたのパフォーマンスを滑らかにしてスピードを上げるのを助けます、そしてロゴのために.9パッチ画像を使うために。

11
Nishant Shah
Density buckets

LDPI    120dpi    .75x
MDPI    160dpi    1x
HDPI    240dpi    1.5x
XHDPI   320dpi    2x
XXHDPI  480dpi    3x
XXXHDPI 640dpi    4x

px / dp = dpi / 160 dpi
9
Zero

私の場合は、style.xmlでlist drawableを使用しました。描画可能な画層リストを使用すると、すべての画面サイズに対して1つのPNGが必要になりました。

<resources xmlns:tools="http://schemas.Android.com/tools">
<!-- Base application theme. -->
<style name="AppTheme" parent="Android:Theme.Holo.Light.DarkActionBar">
    <item name="Android:windowNoTitle">true</item>
    <item name="Android:windowBackground">@drawable/flash_screen</item>
    <item name="Android:windowTranslucentStatus" tools:ignore="NewApi">true</item>
</style>

そしてdraw_folderの中のflash_screen.xml。

<?xml version="1.0" encoding="utf-8"?>
 <layer-list xmlns:Android="http://schemas.Android.com/apk/res/Android">
<item Android:drawable="@Android:color/white"></item>
<item>
    <bitmap Android:src="@drawable/background_noizi" Android:gravity="center"></bitmap>
</item>

「background_noizi」はドロアブルフォルダにpngされています。私はそれが役立つことを願っています

3
user3295573

しばらく前に私はサポートされている寸法でExcelファイルを作成しました
これが誰かに役立つことを願っています

正直言って私はアイデアを失ったが、それはサイズ（密度だけでなく）として別のスクリーン機能を参照しています
https://developer.Android.com/guide/practices/screens_support.html
間違いがあれば教えてください

Link1：dimensions.xlsx

Link2：dimensions.xlsx

2
V. Kalyuzhnyu

**あなたが主要なデバイスのすべての種類の画面の詳細を探しているなら**

material.ioに行きます

2
Midhun Vijayakumar