このページは Cloud Translation API によって翻訳されました。

メディアコントロール

メディアコントロール画面は、ユーザーが聴いているメディアを制御するうえで不可欠です。5 ボタンレイアウトを使用してメディアコントロールを作成し、最小タップターゲット数を満たしていることを確認します。225 dp 以上の大きな画面では、再生キューなどの重要なアクションのショートカットボタンを含めることで、価値を高めることができます。

レイアウトセクション

メディアコントロール画面は高さが固定された画面です。レスポンシブレイアウトと動作が異なる 3 つの垂直セクションで構成されています。

上部セクション: メディアの詳細が表示されます
中央のセクション: メディアコントロール
下部セクション: 設定可能なセカンダリボタン

大画面に関する考慮事項

メディアの大画面対応は、メディアコントロール画面のみに焦点を当てています。その他の要素はすべて、チップ、ボタン、ダイアログアイテム、または大画面の動作のリストの内訳でキャプチャされます。

ボタン

再生キューなどの重要なアクションのショートカットボタンを含めることで、価値を高めることができます。オーバーフローメニューを使用すると、画面サイズに関係なく、追加機能の一貫性とアクセシビリティが維持されることを確認できます。225 dp のブレークポイントを超えると、下部のセクションにボタン用のスロットが 1 つ追加され、ボタンの最大数は、小さい画面では 2 個、大きい画面では 3 個になります。

メインコントロール

主なコントロールは通常、再生ボタンと一時停止ボタンです。225 dp のブレークポイントを超えると、コントロールは 64 dp から 80 dp に拡大され、その中のすべてのコントロールのタップターゲットが拡大されます。

小さい画面（225 dp 未満）

進行状況グラフ = 64 x 64 dp / 3 dp ストローク
ボタン = 54 x 54 dp / 26 アイコンサイズ

大画面（225 dp 以上）

進捗状況グラフ = 80 x 80 dp / 4 dp ストローク
ボタン = 70 x 70 dp / 32 アイコンサイズ

ボタンの構成

タップターゲットのサイズの原則に沿って、225 dp のブレークポイントより前は 2 ボタンレイアウトのみを表示し、それ以降は 3 ボタンレイアウトを表示します。

次の例は、さまざまなボタン構成を示しています。

オーバーフロー付きの 1 ボタンレイアウト、小さい画面（192 dp）

オーバーフロー付きの 1 ボタンレイアウト、大画面（225 dp）

オーバーフロー付きの 2 ボタンレイアウト、小さい画面（192 dp）

オーバーフロー付きの 2 ボタンレイアウト、大画面（225 dp）

オーバーフロー付きの 2 ボタン（最大）レイアウト、小さい画面（192 dp）

オーバーフロー付きの 3 ボタンレイアウト、大きな画面（225 dp）

マーキーの動作

ヘッダーには、読みやすさと全体的なエクスペリエンスを向上させるための更新がいくつかあります。

小さい画面では 12%、大きい画面では 13.2% の上マージン。
曲名の左右の余白: 17.6%
小さい画面では 12.5%、大きい画面では 14.5% のアーティストタイトルのマージン。
アーティストのタイトルは切り捨てられ、曲のタイトルをスクロールする際には 8 dp のグラデーションが使用されます。アイコンがある場合は、曲のタイトルとアイコンの間に 8 dp のギャップが追加されます。（アイコンは曲のタイトルに合わせてスクロールしません）。