ボタン

ボタンは、ユーザーがそのボタンをタップしたときに発生するアクションを伝えます。

ボタンは、標準の Android オープンソース プロジェクト(AOSP)コンポーネントです。背景色は無地、または無地(背景は透明)のいずれかです。塗りつぶしボタンは、メインとなる操作または優先する操作を示します。ボタンは、グループ単位で表示されるタブとは異なり、個別またはグループで表示されます。


解剖学

ボタンの構造
1. 塗りつぶされていないボタンコンテナ
2. 塗りつぶしボタン コンテナ。メインまたは優先するアクションを示します。
3. ボタンのラベル

仕様

ボタンの最小長と最大長

ボタンラベルの最大長は 20 文字です。ボタンの最小幅は 156 dp です。
ボタンのラベルの最大文字数は 20 文字です。ボタンの最小幅は 156 dp です。

アイコンボタンとデフォルト ボタンの比較

ボタンにはアイコンを含めることができます。追加すると、通常はボタンテキストの左側に表示されます。
ボタンにはアイコンを含めることができます。追加すると、通常はボタンテキストの左側に表示されます。

ボタンは、アプリバーダイアログなどの他のコンポーネントで要素として表示できます。

アプリバーのボタンの配置

ボタンがアプリバーの右側に配置されている
ボタンはアプリバーの右側に配置される

ダイアログのボタン

ダイアログ内のボタンは通常、ダイアログの左下に配置します
ダイアログ内のボタンは通常、ダイアログの左下にあります

ヒーローボタン

ヒーローボタンの角に丸みを持たせ、その重要性を強調する
ヒーローボタンでは角が丸く、その重要性を重視しています

カスタマイズ

OEM は、以下のようにボタンの外観を変更することでブランドを反映させることができます。

  • アクセント カラーの指定
  • カスタム アイコンを提供する
  • カスタム フォントの追加
  • 有効、無効、無効のボタンの外観の変更
  • ボタンの寸法、角の形、配置を設定する
  • モーションを使ってユーザーにフィードバックを提供する

Car UI ライブラリ統合ガイドでは、コンポーネントをカスタマイズするための OEM ガイダンスを提供しています。

デザイン システムは、レイアウト、色、タイポグラフィ、サイズ調整、形状、モーションを使用してコンポーネントをカスタマイズするための具体的なガイダンスを提供します。


塗りつぶされていないボタンと塗りつぶされたボタン
塗りつぶしボタンと塗りつぶしボタン。このボタンは、プライマリ アクションを示します。
無効の塗りつぶしボタン
この塗りつぶしボタンの色と不透明度は無効状態を表します
埋められていないボタンに関するダイアログ
ダイアログ内の塗りつぶしされていないボタンは、ウェイトが同等のアクションを示します
ボタンのリップル モーション時間
このリップル モーションの持続時間は 330 ミリ秒です。ユーザーがボタンで連絡先を確認するために使用されます。
ボタンの波紋アニメーション
このリップル モーションは、最初はボタン サーフェスの 60% に重ねられます。ユーザーによるタップ操作から離れて展開し、ボタンの端から 10 dp の位置で停止します。