ROUNIN

androidアプリ制作初心者。Android Studio,Unity学習用備忘録と雑記。

広告

Android Android Studio プログラミング

画像のサイズを端末が変わっても同じように表示するdpについてメモ【Android】

androidアプリで画像を使用する際に使用する単位dpについてざっくりメモする。

問題:androidは端末によっては解像度が違う。

端末によって解像度が違うので同一の画像を表示させても端末によって表示サイズが異なってしまう。

目的:できれば端末が変わっても同じように表示されてほしい。

端末の解像度が違っても可能な限り望みどおりのサイズで表示することでデザインや機能を損なわないようにしたい。

方法:問題解決のためにdpという単位を使用してざっくり解像度ごとの画像を用意。もしくは解像度の高い端末用に画像を作成してAndoridStudioで端末ごとにサイズをあわせてもらう。

まず使用する単位であるdpについて調べる

dpという単位は馴染みが無いので調べてみる。dpを考えるうえでdpiの理解が必要なのでdpiを確認する。
dpと違いdpi自体はDTP(紙入媒体の印刷用解像度)やウェブサイト用の画像解像度で多少馴染みがある。

dpiとは

dpiは1インチあたりのドット数を表す単位で画像の解像度を表すことができる。
dpiの説明

1インチ(約2.54センチ)あたりの辺に10個のドットが含まれる解像度の場合は10dpiとなる。つまり正方形の10dpiの画像だと上のように10×10のドットの画像となる。

ちなみに、DTP(印刷)に使用する画像の解像度は一般的に300dpi以上が必要。Webサイトで使用する画像の解像度には72dpi以上が必要とされている。

DTPとWebの解像度

この必要な解像度を下回ると印刷物の画像がぼやける、ウェブ上で画像がぼやけるといった問題が起こる。

Androidアプリ上の画像について

dpiという単位を踏まえた上でAndroidアプリ上の画像について考える。

端末ごとの画像サイズの違い

アプリで画像を使用すると端末自体の解像度に違いがあるので表示されるサイズが変わってしまう。

同じものを表示するのに端末ごとに大幅にサイズが変わってしまうのは大変困る。

端末違いでも同じサイズの画像

端末が違っても同じサイズで表示してほしい。

解決策:dpという単位を使用して画像をそれぞれ用意する

基本dpiがわかると解りやすい。つまりそれぞれの端末に合わせた解像度の画像が用意されてればいいじゃないかという意外と単純な方法だった。

端末自体の解像度表示が違うので画像サイズが変わってしまう。

なので解像度高めの端末には解像度高めの画像、解像度がそれほど高くない場合はそれに合った高くない解像度の画像を使用するとサイズが同じようになる。

ただ端末すべてに厳密に対応するのは限界があるのでざっくり何種類か範囲を決めて画像を用意してその端末に合った画像を表示させます。

解像度ごとの画像

アンドロイドでldpi,mdpi,hdpi,xhdpi,xxhdpi,xxxhdpiというフォルダ分けでそれぞれの解像度ごとの画像を用意する。

画像はAndroid Studioのmipmapフォルダにペーストすると、それぞれのフォルダが表示されるので適したフォルダにペーストできる。

同じ画像ファイル名だがフォルダ分けしてるのでOk.

必ずしも全ての種類が必要というわけではない。

そしてこれらの画像は端末ごとに適したフォルダ内の画像を表示してくれる。

倍率

ちなみに各フォルダに入れる画像の解像度の倍率は上のようになる。

mdpiが表示したい画像サイズの画像解像度になる。

ちなみに、これだけの画像を用意するのは面倒という場合は、解像度の高い端末用の画像を用意するという方法もある。

一番高い解像度の画像を用意してアプリ側が端末ごとに合ったサイズで表示するというものである。

解像度の高い端末用の画像を1つ準備すればいいのでとてもラクなのだがデメリットもある。高い解像度の画像をサイズ変更して表示しているだけなので重い。

画像を大量に使用するアプリの場合はそれぞれに合った画像を揃えた方法が良いようだ。

各解像度の画像を準備するのは面倒だがAdobeのIllustratorを使用したらそれぞれの書き出しができる機能が付いていた。おそらく他の画像編集ソフトなどでもそのような機能が付いているのではないだろうか。

これならかなりラクに書き出せそう。

終わり。

-Android, Android Studio, プログラミング
-, , , , , , , ,