カスタム Playbook アクティビティ UI の作成
Playbook アクティビティのカスタムアクティビティ UI を構築します。
独自のアクティビティ UI UI ビルダー を作成して、Playbook アクティビティのデフォルトのユーザーエクスペリエンスを上書きします。 UI ビルダー カスタムアクティビティ UI を構築および更新するためのローコード環境を提供します。複数の UI ビルダー コンポーネントを 1 つの Playbook アクティビティに結合できます。 UI ビルダー は、カスタマイズ可能なテンプレートとしてすぐに利用可能なアクティビティ UI を使用します。
- カードのシェルを含む空の UI テンプレートから新しいアクティビティを構築します。
- カードのシェル内のコンテンツを含む既存の UI テンプレートから新しいアクティビティを構築します。
- Playbook アクティビティエクスペリエンスプロパティをデータバインディングを使用してコンポーネントにマッピングします。
- どのアクティビティ UI をどのアクティビティで使用するかを指定するためのルールを定義します。
- 基礎となるプロセスの実行時に、アクティビティエクスペリエンスプロパティへのリアルタイムの変更を反映します。
Playbook のカスタムアクティビティ UI の作成
Playbook アクティビティのカスタムアクティビティ UI を内に UI ビルダー 作成します。
始める前に
必要なロール:Playbook 管理者
手順
-
[Playbook アクティビティの上書き] テーブルで [新規] を選択します。
-
[Edit in UI Builder (UI ビルダーで編集)] を選択します。
タスクの結果
でのアクティビティ UI の構成 UI ビルダー
アクティビティ UI UI ビルダー は、次の方法でカスタマイズできます。
での UI テンプレートの使用 UI ビルダー
- リッチテキストの説明
- レコードフィールドの積み重ねラベル値ペア
- チェックリスト ([チェックリストの表示] エクスペリエンスプロパティが選択されていることが条件)
- フォーム
- 添付ファイル
- フッター
- アクティビティラベル
- アクティビティ進捗状況
- SLA タイマー
- フッター
- 宣言アクション
すぐに利用可能なアクティビティ UI
Playbook には、次のアクティビティ UI が含まれています。
- デフォルト
- リスト
- ナレッジ
- レコードジェネレータ
アクティビティ UI にコンテンツを追加する
[コンテンツ] パネルには、アクティビティ UI のコンポーネントが表示されます。すべてのアクティビティ UI には、アクティビティ UI 全体をラップする最も外側のコンポーネントとして Playbook カードコンポーネントが含まれています。
| Playbook カードスロット | 説明 |
|---|---|
| コンテンツ | Playbook カードに表示する一般的なコンテンツを追加します。 |
| フォーム | フォームスロットは Playbook フォームコンポーネント用に予約されています。フォームが大きすぎて Playbook カード内に収まらない場合、フォームがモーダルに表示される |
| フォームの下 | フォームの下に表示するコンテンツを追加します。 |
| フッター | カードフッターに表示するコンテンツを追加します。 |
アクティビティ UI へのデータのバインド
で UI ビルダー データバインディングを使用して、Playbook Experience プロパティをアクティビティ UI にバインドします。これらの Playbook Experience データリソースは、アクティビティ UI のコンポーネントにデータを動的に公開します。
各アクティビティ UI には、によって実行 プレイブック時にアクティビティに渡されるエクスペリエンスプロパティのコレクションを定義するエクスペリエンスタイプがあります。たとえば、レコードエクスペリエンスタイプには、Playbook アクティビティに表示されるフォームを決定するフォームビューエクスペリエンスプロパティが含まれています。
データバインディングは、 の構成UI ビルダーパネルの [構成] タブにあります。
たとえば、このリッチテキストコンポーネントの HTML プロパティは、説明エクスペリエンスプロパティにバインドされます。データバインディングは、 @context.props.experienceProperties.description.value という形式を取ります。説明エクスペリエンスプロパティが変更されると、このコンポーネントはその新しい値を反映して更新されます。
UI ビルダー 入力するとオートコンプリート値が提供され、適切なエクスペリエンスプロパティにガイドされます。アクティビティ UI に選択したエクスペリエンスタイプに合わせてオートコンプリートされるエクスペリエンスプロパティ UI ビルダー 。エクスペリエンスプロパティがエクスペリエンスタイプに追加されている場合は、自動的に表示されます。
experienceProperties に加えて、@context.props オブジェクトには、activityState や parentTable など、バインドできるその他の有用なデータが含まれています。「@context.props」と入力して、使用可能なものを確認します。
のデータ UI ビルダーバインディングの詳細については、「 UI Builder のデータリソース」を参照してください。
内のカスタムアクティビティ UI をプレビュー UI ビルダー
で UI ビルダーカスタムアクティビティ UI をプレビューします。サンプルデータを提供して、実行中の Playbook でコンポーネントがどのように表示されるかをプレビューできます。
始める前に
必要なロール:Playbook 管理者またはアクティビティ作成者
このタスクについて
で作成したアクティビティ UI を UI ビルダープレビューします。サンプルデータを変更して、実行中の Playbook でアクティビティがどのように表示されるかをプレビューします。このタスクの構成パネルで行った変更は、実行時のアクティビティ UI には影響しません。これは、 内の UI ビルダープレビューにのみ影響します。各エクスペリエンスプロパティの実行時のデフォルト値は、エクスペリエンスプロパティの作成時に設定されます。
手順
-
コンテンツ パネルで [本文 ] を選択します。
-
構成パネルで [構成] タブを選択します。
-
[適用] を選択します。
-
[ 構成 ] タブの他のプロパティを変更して、アクティビティ UI をカスタマイズできます。
たとえば、 activityState を変更して、保留中または完了状態のアクティビティをプレビューできます。