DropDown
DropDownウィジェットは、押すと選択肢のリストが展開され、その中から1つを選ぶ選択ウィジェットです。言語の選択やカテゴリーの選択などに使います。
備考
サンプルファイル: 07_Work_with_Widgets/dropdown_objet.lfp
定義・役割
DropDownウィジェットは、現在の選択値を表示するコンボ領域を描画し、押すと項目のリストが現れます。項目を選ぶとonChangedのアクションが実行されます。展開方式（コンボリスト/ボトムシート）やカラー・サイズを設定できます。
- カテゴリー: Contents
- デフォルトの展開方式: コンボ（
combo） - デフォルトの幅:
200
機能
| 機能 | 説明 |
|---|---|
| 項目の選択 | リストから1つの項目を選ぶと、現在の値がその項目のvalueに変わります。 |
| 展開方式 | comboTypeでコンボリスト（combo）またはボトムシート（sheet）方式を選びます。 |
| 選択変更の検知 | 選択が変わるとonChangedが実行され、選択された値を渡します。 |
| 見た目の設定 | 幅・高さ・角丸・最大表示件数と各種カラーを調整します。 |
使い方
- 左のウィジェットパレットでContentsカテゴリーを開きます。
- DropDown項目をキャンバスにドラッグ＆ドロップします。
- プロパティパネルで選択項目（
items）と初期の選択値（value）を設定します。 - 選択が変わったときに実行するアクションを
onChangedに接続します。 - 必要に応じて展開方式（
comboType）・カラー・サイズを調整します。
プロパティ
| プロパティ | 説明 | デフォルト値 | 値 / タイプ |
|---|---|---|---|
comboType | 展開方式 | combo | combo, sheet |
sheetTitle | ボトムシート方式のときのシートのタイトル | 空文字列 | 文字列 |
items | 選択項目のリスト（各項目: タイトル・サブタイトル・値） | なし | リスト |
value | 初期の選択値（項目の値のいずれか） | なし | 文字列 |
width | コンボの幅 | 200 | 数値（0以上） |
comboHeight | コンボの高さ | 26 | 数値（0以上） |
itemHeight | 各項目の高さ | 24 | 数値（0以上） |
boxRadius | 角丸 | 4 | 数値（0以上） |
maxShowItem | 一度に表示される最大項目数 | 10 | 整数（0以上） |
comboboxBgColor | コンボの背景色 | #000000 | カラー |
comboboxBorderColor | コンボの枠線の色 | #666666 | カラー |
titleColor | 選択値の文字色 | #FFFFFF | カラー |
subtitleColor | 選択値のサブタイトルの色 | #A5A5A5 | カラー |
itemTitleColor | リスト項目のタイトルの色 | #A5A5A5 | カラー |
itemSubtitleColor | リスト項目のサブタイトルの色 | #666666 | カラー |
unsetTextColor | 未選択（unset）表示の色 | #F44336 | カラー |
arrowColor | 矢印の色 | #FFFFFF | カラー |
itemBgColor | リストの背景色 | #333333 | カラー |
itemBorderColor | リストの枠線の色 | #666666 | カラー |
selectedItemColor | 選択された項目の背景色 | #151515 | カラー |
itemHoverColor | 項目のホバー色 | #623BEB | カラー |
enable | 使用可能かどうか | オン（true） | true / false |
注意・ヒント
ヒント
項目（items）のvalueを省略すると、titleが値として使われます。valueには項目の値のいずれかを指定して、初期選択を合わせます。
ヒント
モバイルでリストを画面下から上がってくるシートで表示するには、comboTypeをsheetに設定し、sheetTitleを指定します。
さらに詳しく
ヒント
このウィジェットをスクリプトで制御するWidget Control（Property・Method・Event）の全体は、DropDown Widget Controlドキュメントで確認してください。