Slider

スライダーを使用すると、水平な線に沿ってサム要素(図の白い点)を移動することで値を増減できます。

Slider screen

スライダーの使用方法

スライダーを使用して、ユーザーが範囲内の特定の値を調整・選択できるようにします。スライダーは、メディアの再生、画面の明るさ、設定などを制御するのに最適です。

スライダーには次の要素が含まれます(番号はスクリーンショットの数字に対応しています)。

  1. 塗りつぶし
  2. バッファー(オプション)
  3. 進捗状況トラック
  4. サム

Slider how to use

スライダーの状態

スライダーの状態には、ノーマル(サムあり/なし)、プレス、ホバー、フォーカスがあります。

Slider states

スライダーの種類

スライダーには、デフォルト、アイコン、テキストの3種類があります。

Slider default

デフォルト

デフォルトのスライダーでは、サムを表示してもしなくてもかまいません。オプションのメタデータの表示方法は、次の3種類です。

  • 右上:コンテンツの長さ/コンテンツの合計を連結して表示します。
  • 左上と右上:左にコンテンツの長さ、右にコンテンツの合計を表示します。
  • 左下と右下:左にコンテンツの長さ、右にコンテンツの合計を表示します。

Slider text

テキスト

3つのテキストサイズから選択できます。テキストは数値で、0~100%などの範囲を表す必要があります。

Slider icon

アイコン

3つのアイコンスライダーサイズから選択できます。独自のアイコンアセットを使用しても、Alexaのデフォルトのアイコンを使用してもかまいません。

円形のスライダー

円形のスライダーは、Echo Spotにのみ使用します。円形のスライダーは、確定型にも不確定型にも使用できます。

Slider radial

試してみる

APLドキュメントの作成と編集を参照してください。

開発者向けドキュメント