Switch
Switchウィジェットは、オン/オフの2つの状態を切り替えるスライダー型のトグルスイッチです。
設定のon/offのように、2つの状態から1つを選んでもらうときに使用します。
定義・役割
Switchウィジェットは、トラック上のつまみ（thumb）を左右に動かしてオン・オフの状態を切り替えるコントロールです。押すと状態がトグルされ、onChangedの動作が実行されます。状態・有効かどうか・サイズ・角丸・つまみのサイズ、そして状態別（オン/オフ/無効）のトラックとつまみの色を設定できます。
- カテゴリー: Contents
- デフォルトサイズ:
38 × 22（つまみ（thumbSize）14、角丸（radius）10）
機能
| 機能 | 説明 |
|---|---|
| 状態の切り替え | タップするとオン/オフがトグルされ、onChangedが実行されます。 |
| 有効/無効 | enableで使用できるかどうかを決めます。無効のときは専用の色で描画されます。 |
| サイズ・形状 | サイズ（幅・高さ）、角丸（radius）、つまみのサイズ（thumbSize）を調整します。 |
| 状態別の色 | オン・オフ・無効（オン/オフ）それぞれの状態のトラックとつまみの色を個別に設定します。 |
使い方
- 左側のウィジェットパレットでContentsカテゴリーを開きます。
- Switch項目をキャンバスにドラッグ&ドロップします。
- 右側のPropertiesパネルで初期状態（
value）と色を目的の値に調整します。 onChangedに、状態が変わったときに実行する動作（ロジックやスクリプト）を接続します。
プロパティ
| プロパティ | 説明 | デフォルト値 | 値 / タイプ |
|---|---|---|---|
value | スイッチのオン/オフ状態 | オフ（false） | true / false |
enable | 使用できる（有効）かどうか | オン（true） | true / false |
Size | スイッチのサイズ — 幅（width）と高さ（height）をまとめて指定するグループプロパティ | 幅38・高さ22 | サイズ（幅・高さ、数値px） |
thumbSize | つまみ（thumb）のサイズ | 14 | 数値（px、最小14） |
radius | トラックの角丸 | 10 | 数値（px） |
activeTrackColor | オン状態のトラックの色 | #9483FF（紫） | カラー |
activeThumbColor | オン状態のつまみの色 | #FFFFFF（白） | カラー |
inactiveTrackColor | オフ状態のトラックの色 | #94999F（グレー） | カラー |
inactiveThumbColor | オフ状態のつまみの色 | #FFFFFF（白） | カラー |
disabledTrackColor | 無効（オフ）のトラックの色 | #9F9F9F | カラー |
disabledThumbColor | 無効（オフ）のつまみの色 | #737373 | カラー |
disabledActiveTrackColor | 無効（オン）のトラックの色 | #9F9F9F | カラー |
disabledActiveThumbColor | 無効（オン）のつまみの色 | #6750A4 | カラー |
注意・ヒント
ヒント
オン・オフの色はactiveTrackColor・inactiveTrackColorで、無効状態の色はdisabled...系のプロパティで個別に指定します。
ヒント
thumbSize（つまみのサイズ）の最小値は14です。つまみがトラックの高さ（height）に合って見えるよう、サイズも一緒に調整してください。
さらに詳しく
ヒント
このウィジェットをスクリプトで制御するWidget Control（Property・Method・Event）の全体はSwitch Widget Controlドキュメントで確認してください。