シームレスにスケーリングする適応性の高い Android ウィジェットを設計します。Google が推奨するデフォルト サイズを出発点として使用し、さまざまなサイズでレイアウトをテストして、読みやすさとユーザー エクスペリエンスを最適化します。
デフォルト サイズ
推奨サイズのうち少なくとも 1 つでレイアウトを最適化することで、ウィジェットの洗練されたエクスペリエンスを実現します。ハンドヘルド デバイスとタブレット デバイスの両方で targetCellWidth 属性と targetCellHeight 属性を定義して、ウィジェット ピッカーで正しい配置と表示が行われるようにします。
これらの値は Google Pixel デバイスに基づいています。これらのサイズをウィジェットの設計の出発点として使用してください。さまざまなサイズとデバイスでウィジェットを入念にテストし、質の高いユーザー エクスペリエンスを実現します。
ハンドヘルド
| サイズ | 最小幅 | 最大幅 | 最小の高さ | 最大高さ |
|---|---|---|---|---|
| 2×1 | 109 | 306 | 44 | 130 |
| 2×2 | 109 | 306 | 115 | 276 |
| 2×3 | 109 | 306 | 185 ページ） | 422 |
| 4×1 | 245 ページ） | 624 | 44 | 130 |
| 4×2 | 245 ページ） | 624 | 115 | 276 |
| 4×3 | 245 ページ） | 624 | 185 ページ） | 422 |
タブレット
| サイズ | 最小幅 | 最大幅 | 最小の高さ | 最大高さ |
|---|---|---|---|---|
| 2×1 | 180 | 304 ページ） | 64 | 120 |
| 2×2 | 180 | 304 ページ） | 184 ページ） | 304 ページ） |
| 2×3 | 180 | 304 ページ） | 304 ページ） | 488 |
| 3×1 | 328 ページ） | 488 | 64 | 120 |
| 3×2 | 298 ページ） | 488 | 184 ページ） | 304 ページ） |
| 3×3 | 298 ページ） | 488 | 424 | 672 |
| 3×4 | 456 | 672 | 344 | 488 |
ブレークポイント
適応性が高く、ユーザー フレンドリーでサイズ変更可能なウィジェットを作成するには、ブレークポイントが不可欠です。デザインをテストすることで、レイアウト調整が必要なサイズのしきい値を特定できます。こうした変更をトリガーするブレークポイントを実装することで、どのようなサイズでもウィジェットの視覚的な魅力と機能を維持できます。
ブレークポイントを使用すると、条件付きで補足コンテンツを含めたり除外したりできる柔軟性が得られ、ウィジェットのサイズに基づいてスペースの使用が最適化されます。
境界を埋める
ユーザーがウィジェットを削除する主な理由の一つは、他のホーム画面要素との位置がずれていることです。これを防ぐには、ウィジェットが割り当てられたグリッド スペースを常に完全に埋めるようにします。
すべきこと
すべてのサイズでコンテナが端から端まで引き伸ばされるようにします。
すべきでないこと
カスタム パディングを追加する。ウィジェットはシームレスにエッジ ツー エッジである必要があります。
すべきこと
長方形以外の図形は、視覚的な一貫性を保つために、縦軸または横軸のグリッドに接するようにします。
すべきでないこと
固定の正方形を使用します。代わりに、さまざまなグリッドのサイズに適応するレスポンシブな長方形のコンテナを使用してください。