読者です 読者をやめる 読者になる 読者になる

Androidでよく使うdp指定まとめ

dpとは

dpの仕組みについては過去にまとめています。

いまさら聞けないdp入門

本記事ではレイアウトを組んだり画像を用意する際によく使う数字をいくつか紹介したいと思います。 レイアウトの場合はそのままdp指定できますが、画像はdpサイズを元に各dpi用の画像を生成してください。 下記表の倍率をdpに掛けたものが画像サイズになります。

汎用密度 倍率 dp px
ldpi x0.75 48dp 32px
mdpi x1 48dp 48px
hdpi x1.5 48dp 72px
xhdpi x2 48dp 96px
xxhdpi x3 48dp 144px
xxxhdpi x4 48dp 192px

レイアウト系

Androidのレイアウトでよく利用されるdpサイズについて記述します。 Android Developersの記述とMaterial Designガイドラインでは一部のボタンサイズやパディングなどが異なりますが、Android Developersの記述はMaterial Designに限らずあらゆるデザインに利用できる指針として一度目を通したほうが良いでしょう。

8dp

Androidレイアウトにおいて、各部品の間隔は8dpが基本です。 この指定は48dpリズムに基づくものなので、詳しくは後述の48dpを参照してください。

http://developer.android.com/design/style/metrics-grids.html#48dp-rhythm

16dp

image

アイテムのステータス表示やアクションのための小さいアイコンサイズは16x16dpです。 ただし、実際に見える領域は余白を設けて中央12x12dpに収めることとされています。 48dpの章でも触れていますが、タッチ可能な部品は最低32dpとされているため、このアイコンが操作可能な場合はTouchDelegateやpaddingを利用して配置したほうが良いでしょう。

http://developer.android.com/design/style/iconography.html#small-contextual

24dp

image

通知に利用するアイコン(スモールアイコン)サイズは24x24dpです。 このアイコンは透明な背景に白単色で描画されている必要があります。

http://developer.android.com/design/style/iconography.html#notification

32dp

image

ActionBarのアイコンサイズは32x32dpです。 ただし、実際に見える領域は余白を設けて中央24x24dpに収めることとされています。

http://developer.android.com/design/style/iconography.html#action-bar

48dp

image

タッチ操作可能な部品は余白を含めて48dpを最小単位として配置すべきです。 一般的なAndroid端末において48dpは9mm前後で表示されるため、ユーザーは正確に狙った部品を操作することができます。 48dp内のpadding指定や部品間の間隔についても下記ページが参考になります。 デザイン上部品の表示領域を小さくする場合でもpaddingやTouchDelegateを利用してタッチ領域が32dpを下回らないようにしましょう。

http://developer.android.com/design/style/metrics-grids.html#48dp-rhythm

また、48dpはAndroidアプリのアイコンサイズでもあります。 アプリアイコンに関してはxxxhdpiまで提供することが推奨されています。

http://developer.android.com/design/style/iconography.html#launcher

64dp

Notificationの高さは64dpです。 ただし、BigPictureStyleなどのBig View Styleが指定されている場合、展開すると256dpで表示されます。 このため、BigPictureStyleで画像が実際に表示される領域は256-64=192dpとなります。

http://developer.android.com/guide/topics/ui/notifiers/notifications.html#CustomNotification

240dp

image Navigation Drawerの幅は240〜320dpにすべきです。 ただし、320dpにした場合一部のスマートフォンではNavigationDrawerで埋まってしまいます。 コンテンツによりますが、SlidingPaneLayoutでもこの幅を利用したほうが良いかもしれません。

https://developer.android.com/design/patterns/navigation-drawer.html

文字サイズ

Androidフレームワークでは文字サイズは以下のようになっています。 特別な理由がない限りはこれに従ったほうが良いでしょう。 image

Material Design

Material Designガイドラインでも各要素のサイズやパディングなどが細かく指定されていますが、本来アニメーションやジェスチャなど全ての要素を含めてMaterial Designです。 ガイドラインから数字だけ抜き出して既存のレイアウトに当てはめても一見Material Design風になるだけで色々違和感が出てきてしまうので、ここでは個別の要素のdpについて説明はしません。

http://www.google.com/design/spec/layout/structure.html http://www.google.com/design/spec/layout/metrics-keylines.html

端末サイズ系

image

Androidにおけるdp解像度は画素密度と実解像度で計算されるため、端末の実サイズによって大体の範囲が決まっています。 フルHDスマートフォンであってもハーフHDのタブレットであってもスマートフォン/タブレットでレイアウトを切り替えられるのは、このdp解像度のおかげです。 Androidでは端末の向きに左右されない短辺のdpを端末種別の判断に利用する場合が多いです。

320dp

Androidにおいて、一般的なスマートフォンの横幅は320-384dpとなっています。 Nexus6をスマートフォンに含める場合、Androidスマートフォン向けレイアウトは横幅320-410dpの間で破綻がないことが求められます。 最近では横幅320dpの端末は少なくなっていますが、最低限確認だけはしておきましょう。

480dp

DELL Streakのようなごく一部の端末が短辺480dpとなっています。 480dp未満以上600dp未満という範囲に広げても端末数は多くなく、去年発売された端末ではXperia Z Ultraの540dpくらいです。 わざわざこれらの端末向けにレイアウトを構成するよりもスマートフォン用レイアウトが崩れないように努力したほうが良いでしょう。

600dp

image 7インチタブレットの大半は短辺が600dp、長辺が960dpとなっています。 そのため、7インチを含むタブレット向けリソースはsw600dpで区別できます。 sw600dpは幅や高さではなく短辺による指定のため、端末の向きに影響されないことに注意しましょう。 7インチ以上のタブレットで横向きだけ区別したい場合はsw600dp-landまたはw960dpを利用します。

720dp

Android Developersでは10インチタブレットを判別する方法としてsw720dpが挙げられています。 ただし、近年発売された10インチタブレット端末のほとんどは短辺800dpとなっているため、sw720dpの境界テストは難しくなっています。 sw800dpに引き上げようにもアスペクト比の異なるNexus9などが768dpとなっているため、なかなか変更できません。 10インチタブレット向けにはひとまずsw720dpで設定し、768dpと800dpの2種類で確認したほうが良いでしょう。 10インチタブレットの横向きだけ区別ためにsw720dp-landが利用できます。