トグル

Toggle コンポーネントは、Dynamic Components 内で二者択一（オン/オフ、真/偽）を表現する使いやすい方法を提供します。

概要

Toggleコンポーネントは、ユーザーがスライドして二つの状態を切り替えられるスイッチを表示します。主な機能は次のとおりです：

明確な視覚的表示: 現在の状態（オンまたはオフ）を即座に視覚的に示します。
カスタマイズ可能なラベル: トグルの目的を明確に説明するテキストラベルを追加します。
データバインディング: トグルの状態（チェック済みまたは未チェック）はブール変数リソースに格納され、条件ロジック、フィルター、その他の操作で簡単に使用できます。
カスタマイズ可能なメッセージ: トグルがチェックされているかどうかに応じて異なるメッセージを表示します。
スタイリングオプション: サイズとラベルのバリアントを制御します。

キャンバス上でToggleコンポーネントを選択して、プロパティパネル（右側のパネル）でそのプロパティにアクセスします。

これらのプロパティは、Toggleの基本的なデータとラベル付けを制御します。

実際の: （テキスト）このコンポーネントインスタンスの一意の識別子（例：EnableFeatureToggle、ShowDetailsToggle）。
次のように設定します: （テキスト）トグルスイッチの横に表示されるテキストラベル。例：「Enable Feature」、「Show Details」、「Active」。明確かつ簡潔に記述してください。
フィールドレベルヘルプ: （テキスト、任意）ラベルの横に表示されるヘルプテキストで、追加のコンテキストや指示を提供します。
Value (Checked): （ブール - 非常に重要）このプロパティはトグルの現在の状態を保持します：
- true: トグルがチェックされている（オン）。
- false: トグルがチェックされていない（オフ）。
- データバインディング：このプロパティをブール変数リソースにバインドする必要があります。この変数は次のことを行います：
  - ユーザーの選択を保存します。
  - コンポーネントの他の部分でトグルの状態を使用できるようにします。
  - ブール変数を初期化してデフォルトの状態を設定できるようにします。

これらのプロパティはToggleの視覚的な表示を制御します。

バリアント: （テキスト - オプションから選択）ラベルの視覚スタイルと位置を制御します：
- standard: ラベルがトグルの上に表示されます。
- label-inline: ラベルがトグルの左側に表示されます。
- label-stacked: ラベルがトグルの上に表示されます（standardに似ています）。
- label-hidden: ラベルは非表示です。トグルの目的が文脈から明確な場合にのみ使用してください。
サイズ: （テキスト - オプションから選択）トグルのサイズを選択します。
マークを隠す: （ブール - チェックボックス）有効にすると、トグル内部の視覚的マーク（チェックマーク）を非表示にします。スライドアニメーションが指標になります。

これらの設定はユーザーの操作に影響します。

必須: （ブール - チェックボックス）有効にすると、ユーザーはトグルと対話する必要があります。この設定は一般的には使用されません。
読み取り専用: （ブール - チェックボックス）有効にすると、ユーザーはトグルの状態を見ることはできますが、変更することはできません。読み取り専用の設定を表示するのに便利です。
無効: （ブール - チェックボックス）有効にすると、Toggleコンポーネントは完全に無効化され、操作できなくなります。
表示: （ブール）Toggleコンポーネントがページ上で表示されるかどうかを制御します。動的な表示にはこのプロパティをブール変数や数式にバインドしてください。

これらのプロパティではメッセージをカスタマイズできます。

この例は、Toggleコンポーネントを活用して他のコンポーネントを条件付きで表示する方法を示し、必要なときにのみ情報を提示することでユーザー体験を向上させます。

Toggleを追加する: キャンバスにToggleコンポーネントをドラッグします。
- API名：DetailsToggle
- ラベル：「Show Details」
レコード詳細コンポーネントを追加する （または他の任意のコンポーネント）：テキストコンポーネント（または条件付きで表示したい任意のコンポーネント）をキャンバスにドラッグします。
- 値：（表示/非表示にしたいコンテンツに設定してください）
レコード詳細コンポーネントの表示を設定する
- レコード詳細コンポーネントを選択します。
- プロパティパネルで「コンポーネントの表示を設定」プロパティを見つけます。
- Toggleのcheckedプロパティをtrueにバインドします。

これで、Toggleがオンに切り替えられているときにのみテキストコンポーネントが表示されます（そして「Checked」変数がtrueの場合）。

明確なラベリング: トグルの目的を説明する明確で簡潔なラベルを使用してください。
読み取り専用／無効を検討する: 表示のためにはRead Onlyを使用してください。一時的に利用不可であることを示すにはDisabledを使用してください。
使用例: コンポーネントの表示制御や変数の設定にToggleコンポーネントの使用を検討してください。

最終更新 6 か月前

役に立ちましたか？