ImageRadio
ImageRadioウィジェットは、複数の画像の選択肢から1つだけを選ぶラジオグループを画像で表現するウィジェットです。
同じグループ内では1つの項目のみが選択され、選択・非選択・無効の状態ごとに異なる画像を表示します。
定義・役割
ImageRadioウィジェットは、同じgroupIdを共有する項目同士で1つのラジオグループを構成します。各項目は固有のvalueを持ち、項目をタップするとグループの選択値がその項目のvalueに変わります。選択状態と有効状態の組み合わせに応じて最大4つの画像のうち1つを表示し、選択されるとonChangedに接続した動作が実行されます。
- カテゴリー: Contents
- グループ単位の単一選択（同じ
groupIdを持つ項目のうち1つのみ選択） - 状態ごとの画像表示（選択+有効 / 非選択+有効 / 非選択+無効 / 選択+無効）
機能
| 機能 | 説明 |
|---|---|
| グループ単位の単一選択 | 同じgroupIdを持つ項目が1つのグループを構成し、そのうち1つだけが選択されます。タップするとグループの選択値がその項目のvalueに変わります。 |
| 状態ごとの画像 | 選択・有効状態の組み合わせに応じて、activeAssetPath・inactiveAssetPath・disabledAssetPath・disabledActiveAssetPathのいずれかの画像を表示します。 |
| ラベル表示 | 画像の横にテキストラベル（label）を表示し、間隔（labelGap）と文字スタイル（labelStyle）を指定します。 |
| サイズ設定 | radioWidth・radioHeightで画像の表示サイズを指定します。 |
| 選択イベント | 項目が選択されると、onChangedに接続した動作（ロジック・スクリプト）が実行されます。 |
使い方
- 左のウィジェットパレットでContentsカテゴリーを開きます。
- ImageRadio項目をキャンバスにドラッグ＆ドロップします。
- 1つのグループにまとめる項目に、同じ
groupIdを指定します。 - 各項目に異なる
valueと状態ごとの画像（activeAssetPath・inactiveAssetPathなど）を指定します。 - 必要に応じて、選択時に実行する動作を
onChangedに接続します。
プロパティ
注記
radioWidth・radioHeight・label・labelStyle・labelGapにはデフォルト値がないため、指定しない場合は適用されません。
| プロパティ | 説明 | デフォルト値 | 値 / タイプ |
|---|---|---|---|
groupId | ラジオグループの識別子。同じ値を持つ項目同士が1つのグループとして動作します | 空文字列 | 文字列 |
value | この項目の固有の値。選択されるとグループの選択値がこの値に変わります | 空文字列 | 文字列 |
groupValue | グループの現在の選択値 | 空文字列 | 文字列 |
enable | 有効にするかどうか。オフにすると選択できず、無効状態の画像を表示します | オン（true） | true / false |
activeAssetPath | 選択+有効状態で表示する画像のパス | 空文字列 | 画像パス（文字列） |
inactiveAssetPath | 非選択+有効状態で表示する画像のパス | 空文字列 | 画像パス（文字列） |
disabledAssetPath | 非選択+無効状態で表示する画像のパス | 空文字列 | 画像パス（文字列） |
disabledActiveAssetPath | 選択+無効状態で表示する画像のパス | 空文字列 | 画像パス（文字列） |
radioWidth | 画像の表示幅 | 未設定 | 数値（px） |
radioHeight | 画像の表示高さ | 未設定 | 数値（px） |
label | 画像の横に表示するテキストラベル（任意） | 未設定 | 文字列 |
labelStyle | ラベルの文字スタイル（色・サイズなど） | 未設定 | テキストスタイル |
labelGap | 画像とラベルの間隔 | 未設定 | 数値（px） |
注意・ヒント
注記
1つのグループとして動作させるには、項目のgroupIdが同一で、各項目のvalueが互いに異なる必要があります。タップするとグループの選択値が自身のvalueに設定され、同じグループの他の項目は自動的に非選択状態になります。
ヒント
状態ごとの画像を指定しない場合は、代替画像（空の画像表示）が表示されます。このときradioWidth・radioHeightを指定しないと代替画像は20×20のサイズで表示され、labelをオンにしたときにlabelGapを指定しないと画像とラベルの間隔は8が適用されます。
さらに詳しく
ヒント
このウィジェットをスクリプトで制御するWidget Control（Property・Method・Event）の全体は、ImageRadio Widget Controlドキュメントで確認してください。