そのため、一辺の長さを100ピクセルに指定してサムネイルの画像を表示すると、機種によっては大きさが半分ぐらいになってしまう。
では、機種に依存せずに、同じ見た目の大きさにするにはどうしたらよいのだろうか?
そのためには、ピクセルの単位で大きさを指定するのではなく、dip、pxと文字数を合わせてdpと呼ばれる事が多い、の単位で大きさを指定すればよい。
dipは、device independent pixcel(端末非依存ピクセル)の略で、1辺の大きさが1/160インチの仮想的なピクセルである。
前述のサムネイルの大きさがまちまちになる問題を避けるには、100ピクセルと言ったサイズを指定するのではなく、50dpと言うようにサイズを指定すればよい。そうすれば、見た目の大きさはすべての端末で同じ大きさになり、問題は解決する。
しかし、である。Androidは、端末の画面サイズも機種によりまちまちである。
例えば、50dpのサムネイルは横に幾つまではみ出さずに表示できるのだろうか?と言う疑問に突き当たる。
そこで、各種端末の画面の大きさを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でも名前が違うだけで同様の属性がある事が多い。