Androidアプリの画面をdpでデザインする: Design layout of Android App with dp

Androidでは、1ピクセルの大きさが、機種によって大きく異なる。
そのため、一辺の長さを100ピクセルに指定してサムネイルの画像を表示すると、機種によっては大きさが半分ぐらいになってしまう。

では、機種に依存せずに、同じ見た目の大きさにするにはどうしたらよいのだろうか？
そのためには、ピクセルの単位で大きさを指定するのではなく、dip、pxと文字数を合わせてdpと呼ばれる事が多い、の単位で大きさを指定すればよい。
dipは、device independent pixcel(端末非依存ピクセル)の略で、1辺の大きさが1/160インチの仮想的なピクセルである。

前述のサムネイルの大きさがまちまちになる問題を避けるには、100ピクセルと言ったサイズを指定するのではなく、50dpと言うようにサイズを指定すればよい。そうすれば、見た目の大きさはすべての端末で同じ大きさになり、問題は解決する。

しかし、である。Androidは、端末の画面サイズも機種によりまちまちである。
例えば、50dpのサムネイルは横に幾つまではみ出さずに表示できるのだろうか？と言う疑問に突き当たる。
そこで、各種端末の画面の大きさをdp単位で求めてみたのが下表である。

表: 端末毎のdp単位で求めた画面サイズ

機種: Model	ディスプレイサイズ: Display Size (inch)	幅: Width (px)	高さ: Height (px)	dpi	幅: Width (dp)	高さ: Height (dp)
HTC Desire	3.7	480	800	252	305	508
Xperia	4.0	480	854	245	314	558
Galaxy S	4.0	480	800	233	329	549
Galaxy Nexus	4.7	720	1280	312	369	655
Xperia Z	5.0	1080	1920	441	392	697
Galaxy Note	5.3	800	1280	285	449	719
Galaxy Note II	5.5	720	1280	267	431	767
Galaxy Mega 6.3	6.3	720	1280	233	494	879
Galaxy Tab	7.0	600	1024	170	566	966
Nexus 7	7.0	800	1280	216	594	950
Optimus Pad	8.9	768	1280	168	733	1,221
Nexus 10	10.0	1600	2560	302	848	1,357

上記の表を見ると、縦画面の場合、HTC DesireからGalaxy Sまでは6つ、Galaxy NexusからXperia Zまでは7つ、Galaxy Noteは8つということが分かる。

このように、大きさをdp単位で指定し、各端末の画面サイズはdp単位の大きさを持つと考えるて、画面のレイアウトを考えればよい。

結構面倒な気もするが、画面の大きさがまちまちなのは、PCのブラウザの画面も同じなので、レイアウトの考え方は、ブラウザと同じように考えればよい。

ブラウザで横幅のレイアウトを考えるとき、%指定で幅をしていすれば上手く行く事が多い。Androidの場合、大きさを0dpと指定し、weightで幅の割合を指定すると、同様の事ができる。このように、HTMLやCSSでのレイアウトのテクニックをAndroidのレイアウトのXMLファイルで応用できないかを考えるとよい。実際、XMLファイルで指定できる属性は、HTMLでも名前が違うだけで同様の属性がある事が多い。