ウィジェット コントローラー ウィジェットは、他のウィジェットをツールバーに整理するために使用できるコンテナーです。 コントローラー内のウィジェットの向きは、水平方向または垂直方向に設定できます。 開くことのできるウィジェットの数とウィジェット ボタンの表示方法を制御できます。
例
このウィジェットを使用して、次のようなアプリの設計要件をサポートします。
- ウィジェットをツールバーのようなコントローラーに整理します。
- 多くのスペースを割り当てることなく、全画面マップにウィジェットを追加します。
- ユーザーが 1 つまたは複数のウィジェットを一度に開いてマップを操作できるようにします。
使用上の注意
ウィジェットをコントローラーに追加するには、[ウィジェットの追加] ボタンをクリックして、ウィジェット ギャラリーから選択するか、[ウィジェットの挿入] パネルからコントローラーにウィジェットをドラッグします。 コントローラーに追加したウィジェットをクリックし、その設定パネルを開いて、そのウィジェットを構成します。 ウィジェット パネルの下隅をドラッグして初期サイズを定義します。
実行時にコントローラー内のウィジェットをクリックしてウィジェット パネルを開くと、そのウィジェットのアイコンの下に、ウィジェットがアクティブであることを知らせるインジケーター ラインが表示されます。 [展開] ボタンと [折りたたみ] ボタンを使用して、パネルを完全に閉じないで、パネルが占めるスペースの量を変更できます。
[ウィジェットの管理] ボタンをクリックして、コントローラー内のすべてのウィジェットのリストを表示します。 ウィジェットの順序変更、削除、グループ化を行えます。
グループ
[ウィジェットの管理] パネルでウィジェットを別のウィジェットの上にドラッグすることで、コントローラー内にグループを作成できます。 グループはアコーディオン ウィジェットのようなものです。 グループを使用することで、コントローラーの 1 つのパネルに複数のウィジェットを配置できます。 グループにはアコーディオン ウィジェットと同じ設定がすべて備わっていますが、唯一の違いとして、ページ アウトラインに [グループ] という名前が表示されます。 コントローラー内のグループをクリックすると、そのグループ内のウィジェットが、展開/折りたたみボタンが付いた縦並びのメニューに表示されます。
パネル外ウィジェット
一部のウィジェットには、コントローラー パネルに適していない配置スタイルやコントローラー パネルに収まらない配置スタイルがあります。 最適な表示にするため、それらのコントローラー アイコンをクリックすると、通常どおり、それらのウィジェットはコントローラーの外側に表示されます。 一般に、ウィジェットをコントローラーに追加してツールバー配置スタイルを選択した場合、そのウィジェットはパネルの外に表示されます。
パネルの外に表示されるウィジェットの例としては、3D ツールボックス ウィジェット、描画ウィジェット、マイ ロケーション ウィジェット、共有ウィジェット、スワイプ ウィジェット、タイムライン ウィジェットなどがあります。
設定
ウィジェット コントローラー ウィジェットには以下の設定が含まれます。
- 方向 - ウィジェットをコントローラー内に縦向きまたは横向きに表示します。
- [整列] - ウィジェットの整列方法を選択します。 これらのオプションの違いに気付くのは、コントローラーの幅または高さがウィジェットの全長より大きい場合だけです。
- ウィジェットを横向きに表示する場合、コントローラーの中央、左、または右に揃えることができます。
- ウィジェットを縦向きに表示する場合、コントローラーの中央、上部、または下部に揃えることができます。
- [動作] - このコントローラーから開くことができるウィジェットの数およびページが読み込まれたときに自動的に開くウィジェットを定義します。
- [シングル] - 一度に開くことができるウィジェットは 1 つだけです。 ウィジェットを開くと、他のウィジェットは閉じます。
- [複数] - 同時に複数のウィジェットを開いて実行できます。 この場合、開いたウィジェットを重ねて表示するか、並べて表示できます。
ヒント:
このオプションを試すには、ビルダー ツールバーの [ライブ ビュー] をクリックします。
- ウィジェット リストから 1 つ以上のウィジェットを選択して、ページが読み込まれたときに自動的に開かれるようにします。
- 表示タイプ - この設定は [複数] を選択した場合に表示されます。 ウィジェット パネルを上下に並べて表示するか左右に並べて表示するかを選択できます。
- [ウィジェット パネルの配置] - この設定は [単一] を選択した場合に表示されます。 ウィジェット パネルを表示する場所を選択します。
- [フローティング] - ウィジェット パネルは、各ウィジェットのアイコンに固定され、コントローラーの横に浮かんでいるように表示されます。
- [固定] - ウィジェット パネルを、キャンバスの 9 つのアンカー ポイントのいずれかに固定して表示します。 パネルの幅と高さは、ピクセル ([px]) かキャンバスに対するパーセンテージ ([%]) で設定できます。 また、X 軸と Y 軸のオフセットを設定し、パネルが開いたときに表示されるアニメーションを追加できます。
- パネルの幅と高さは、[ストレッチ] に設定することもできます。 その場合、[上]、[下]、[左]、[右] の余白内で、キャンバスのエリアを埋めるようにパネルがストレッチされます。これは、ピクセル単位 ([px]) またはキャンバスのパーセント ([%]) で定義できます。
注意:
[ウィジェット パネルの配置] 設定は、ウィジェットが大画面または中画面に表示された場合にのみ適用されます。 画面サイズが小さいデバイスでは、ウィジェット パネルはアプリの下部に表示されます。
- [表示設定] - ウィジェット コントローラー内のウィジェットを選択し、アイコン、ラベル、またはスタイルをカスタマイズします。
- [アイコン] - ウィジェット アイコンに円または四角形を使用します。
- [ラベル] - ウィジェットの名前をラベルとしてアイコンの下に表示します。 設定パネルまたはビルダーのアウトラインでウィジェット名を編集することで、これらのラベルを変更できます。
- [インジケーター] - アクティブなウィジェットを知らせるインジケーター ラインを含めます。
- [ツールチップ] - ボタンのホバー テキストを含めます。
- [サイズ] - ウィジェット アイコンのサイズを変更します。
- [間隔] - ウィジェット アイコン間のスペースをピクセル単位 ([px]) で指定します。
- オーバーフロー スタイル - ウィジェットが多すぎてコントローラーの長さに収まらない場合、その他のウィジェットを表示する方法として次の 2 つのオプションがあります。
- [矢印] - コントローラー内のすべてのウィジェットをナビゲートするための矢印を追加します。
- [ポップアップ ウィンドウ] - [その他のウィジェット] というラベルの付いたボタンをコントローラーの末尾に追加します。 ユーザーがこのボタンをクリックすると、残りのウィジェットがリストされたウィンドウが表示されます。
- [高度な設定] - [デフォルト]、[選択]、[ホバー] の 3 つの状態に対し、コントローラー上のボタンを表示する方法を選択します。 ラベルをオンにすると、テキストのフォント色を変更し、太字、斜体、取り消し線、下線の書式設定を使用できます。 [アイコン スタイル] で、アイコンの色と背景色を変更できます。 [影] で、x オフセットと y オフセット、ぼかしの半径、拡張の半径、影の色を設定して、影をアイコンに追加することができます。
- [デフォルト] - ユーザーの操作がないボタンのデフォルトの状態。
- [選択] - コントローラー上でユーザーが選択しているボタン、または開いているウィジェットの状態。
- [ホバー] - ユーザーがコントローラーにポインターを合わせたときのボタンの状態。
注意:
選択したテーマは、構成オプションの色の選択肢に影響します。 アプリのテーマに含まれていない色を使用したい場合は、[その他] をクリックしてユーザー設定の色を選択できます。
操作オプション
ボタン ウィジェットを使用して、コントローラー内のウィジェットを開くことができます。
これには、ボタン ウィジェットとウィジェット コントローラー ウィジェットをアプリに追加します。ボタン ウィジェットの設定の [アクション] タブで、[トリガーの追加] をクリックし、[ボタンをクリック] トリガーを選択します。 ウィジェット コントローラー ウィジェットをターゲットとして選択し、[ウィジェットを開く] アクションを選択し、[アクション設定] の下にあるドロップダウン メニューからコントローラー内のウィジェットを選択します。
コントローラー内のウィジェットは、レコード選択の変更トリガーをサポートするウィジェットを介して開くこともできます。 たとえば、マップ ウィジェットで新たに選択を行うたびにコントローラー内のテーブル ウィジェットが開くように構成することができます。
これを行うには、マップ ウィジェットの設定で [レコード選択の変更] トリガーを追加します。 ウィジェット コントローラー ウィジェットをターゲットとして選択し、[ウィジェットを開く] アクションを選択し、[ウィジェットを開く] の下にあるドロップダウン メニューからテーブル ウィジェットを選択します。 トリガー データ (メッセージ アクションのトリガーとなるデータ) を設定するよう求められます。 次のオプションから選択できます。
- [すべてのデータ] - ソース ウィジェットに接続されているデータ ソースのいずれかから、ユーザーがフィーチャを選択するとウィジェットが開きます。
- [カスタム] - 特定のレイヤーをトリガー データとして使用します。 カスタムのトリガー データは、特定のデータ ソースだけにメッセージ アクションをトリガーさせる場合に便利です。 たとえば、ユーザーがマップ上で都市を選択した場合だけチャート ウィジェットを開きたい場合は、都市レイヤーをトリガー データとして選択できます。
[ウィジェットを開く] メッセージ アクションで開くウィジェットを選択することもできます。