Slider
Sliderウィジェットは、決められた範囲の中で値を1つドラッグして選択する入力コントロールです。
音量・明るさ・比率のような連続的な値を調整するときに使います。
定義・役割
Sliderウィジェットは、横方向のトラック上のつまみ(thumb)をドラッグしてmin〜maxの範囲の値を選択します。divisionsでトラックを均等な段階に分けて離散値だけを選ばせることもでき、トラック・目盛り・つまみの色とトラックの太さを指定できます。
- カテゴリー: Contents
- デフォルトの範囲:
min0.0 〜max1.0 - デフォルトの値:
0.0 - デフォルトのサイズ(SizedBox): 幅100、高さ50
- スライダーの種類:
material(デフォルト)/adaptive
機能
| 機能 | 説明 |
|---|---|
| 値の選択 | トラック上のつまみをドラッグしてmin〜maxの間の値を選択します。 |
| 段階分け | divisionsでトラックを均等な段階に分け、離散値だけを選択させます。未設定の場合は連続値です。 |
| スライダーの種類 | material(デフォルト)とadaptive(プラットフォーム適応型)から選びます。 |
| 色・トラックの設定 | 有効・無効トラック、目盛り、つまみ、オーバーレイの色とトラックの太さを指定します。 |
| 値変更イベント | onChangedで、ドラッグ中に値が変わったときに実行する動作を接続します。 |
使い方
- 左のウィジェットパレットでContentsカテゴリーを開きます。
- Slider項目をキャンバスにドラッグ&ドロップします。
- 右のプロパティパネルで
min・maxで値の範囲を設定します。 - 必要に応じて
divisionsで段階を分け、トラック・つまみの色とtrackHeightを調整します。 onChangedに、値が変わったときに実行する動作(ロジック・スクリプト)を接続します。
プロパティ
| プロパティ | 説明 | デフォルト値 | 値 / タイプ |
|---|---|---|---|
sliderType | スライダーの種類 | material | material, adaptive |
value | 現在選択されている値 | 0.0 | 数値 |
min | 選択できる最小値 | 0.0 | 数値 |
max | 選択できる最大値 | 1.0 | 数値 |
divisions | トラックを分ける段階の数(離散値)。未設定の場合は連続値 | 未設定 | 整数(1以上) |
trackHeight | トラックの太さ | 未設定 | 数値 |
activeTrackColor | つまみの左側(選択区間)のトラックの色 | 未設定 | カラー |
inactiveTrackColor | つまみの右側(未選択区間)のトラックの色 | 未設定 | カラー |
activeTickMarkColor | 選択区間の目盛りの色 | 未設定 | カラー |
inactiveTickMarkColor | 未選択区間の目盛りの色 | 未設定 | カラー |
thumbColor | つまみの色 | 未設定 | カラー |
overlayColor | つまみを押したときに表示されるオーバーレイの色 | 未設定 | カラー |
focusNode | フォーカス制御に使うフォーカスノード | 未設定 | フォーカスノード |
autofocus | 画面表示時に自動でフォーカスするか | false | true / false |
注意・ヒント
ヒント
divisionsを指定すると、値は連続ではなく均等な段階に区切られて選択されます。未設定の場合はmin〜maxの間の連続値を自由に選べます。
注記
activeTrackColorはつまみの左側(選択された)区間に、inactiveTrackColorは右側(選択されていない)区間に適用されます。
さらに詳しく
ヒント
このウィジェットをスクリプトで制御するWidget Control(Property・Method・Event)の全体は、Slider Widget Controlドキュメントでご確認ください。