ユースケース開発Workshopアプリケーション間のインタラクティビティドラッグアンドドロップ

注: 以下の翻訳の正確性は検証されていません。AIPを利用して英語版の原文から機械的に翻訳されたものです。

Workshop のドラッグアンドドロップ

ドラッグアンドドロップ機能を使うと、ユーザーはあるアプリケーションから別のアプリケーションへデータをドラッグして、アプリケーション間で簡単にデータを移動できます。詳細は、ドラッグアンドドロップのドキュメントを参照してください。

Workshop では、複数のコンポーネントで、アプリケーション間のインタラクティビティやウィジェット間のインタラクションのためのドラッグアンドドロップ操作を有効にできます。これらのコンポーネントとインタラクションについて、以下で詳しく説明します。

Workshop のドロップゾーン

ドロップゾーンは、ユーザーが要素上にデータを「ドロップ」して転送できるインタラクティブなコンポーネントです。以下の Workshop コンポーネントをドロップゾーンとして設定できます。詳細は、ドロップゾーンのドキュメントを参照してください。

セクションのドロップゾーン

セクションコンポーネントは、ドラッグペイロードを受け取るように設定できます。

  1. セクションコンポーネントをドロップゾーンにするには、対象のセクションを選択し、右側のセクション設定パネルでドロップ処理を切り替えます。

    セクションのドロップ処理を有効にするトグル。

    ドロップ処理のトグルが表示されない場合は、プラットフォーム管理者に連絡して、この機能を有効にしてください。

  2. ドロップ処理を有効にすると、トグルの下に追加の設定が表示されます。これらの設定で、ドラッグペイロードをドロップゾーン上にドラッグしたときのドロップゾーンの外観を定義します。

    セクションのドロップゾーンの視覚要素の設定。

    ドロップラベルの設定はドロップゾーンに表示されるテキストを決定し、ドロップアイコンの設定は表示されるアイコンを決定します。

    たとえば、ドロップラベルに「ここにドロップ」を設定し、ドロップアイコンとしてプラスアイコンを選択すると、ユーザーがペイロードをドラッグしたときに、ドロップゾーンは次のように表示されます。

    ドロップゾーンの動作

  3. 最後に、出力オブジェクトセットとドロップ時の設定で、ドロップされたデータの処理方法を設定します。

    出力オブジェクトセット変数を設定する。

    ドロップされたデータの書き込み先となるオブジェクトセット変数を選択します。これは、たとえばオブジェクトテーブルにデータを格納するために使用できます。また、ドロップ後にイベントが発火するように設定することもできます。

セクションのドロップゾーンの使用方法

セクションコンポーネントをドロップゾーンとして設定すると、ユーザーはセクション上にオブジェクトをドラッグアンドドロップできます。エンリッチメントを使用すると、Gotham と Foundry のどちらのオブジェクトも、このドロップゾーン上にドラッグできます。

このドロップゾーンは、Foundry オブジェクト RIDと Foundry オブジェクトセットのメディアタイプを受け入れます。詳細は、メディアタイプのドキュメントを参照してください。

ドラッグゾーン

ドラッグゾーンは、ユーザーがデータを「つかみ」、ドロップゾーン上にドラッグして転送できるインタラクティブな要素です。以下の Workshop コンポーネントをドラッグゾーンとして設定できます。詳細は、ドラッグゾーンのドキュメントを参照してください。

以下のドラッグゾーンは、エンリッチメントを使用することで、オブジェクトのメディアタイプを受け入れる Gotham と Foundry のどちらのドロップゾーン上にもドラッグできます。エンリッチメントを使用しない場合、これらのドラッグゾーンは、そのドラッグゾーン固有のメディアタイプを受け入れるドロップゾーンにのみデータを転送できます。

オブジェクトセットタイトルのドラッグゾーン

オブジェクトセットタイトルコンポーネントをドラッグゾーンとして設定するには、コンポーネントを選択し、右側の設定パネルでドラッグを有効にするを切り替えます。このドラッグゾーンを使用して、Foundry オブジェクトセットの RID を転送できます。

オブジェクトセットタイトルのドラッグゾーンの設定。

これを有効にすると、対応するドロップゾーン上にコンポーネントをドラッグしてデータを転送できます。エンリッチメントを使用しない場合、このコンポーネントは Foundry オブジェクトセットのメディアタイプを受け入れるドロップゾーン上にのみドラッグできます。詳細は、メディアタイプのドキュメントを参照してください。

オブジェクトセットタイトルのドラッグゾーン

オブジェクトテーブルのセルのドラッグゾーン

オブジェクトテーブルのセルは、対応するドロップゾーン上にドラッグしてデータを転送できます。エンリッチメントを使用しない場合、このドラッグゾーンは Foundry オブジェクト RID のメディアタイプを受け入れるドロップゾーン上にドラッグできます。詳細は、メディアタイプのドキュメントを参照してください。

Object View のドラッグゾーン

Object View ウィジェットのヘッダーにあるアイコンは、対応するドロップゾーン上にドラッグできます。エンリッチメントを使用しない場合、このドラッグゾーンは Foundry オブジェクト RID のメディアタイプを受け入れるドロップゾーンに対応します。詳細は、メディアタイプのドキュメントを参照してください。

Object View のドラッグゾーン。

ウィジェット内での並べ替え

一部の Workshop ウィジェットでは、ドロップゾーンにデータを転送するのではなく、ウィジェット内で完結するドラッグアンドドロップのインタラクションを利用できます。たとえば、オブジェクトリストウィジェットは、ユーザーがオブジェクトカードをドラッグして項目を並べ替えられるように設定できます。

オブジェクトリストで並べ替えを有効にした場合:

  • 単一のオブジェクトリストウィジェット内で並べ替えができます
  • グリッドレイアウトでの並べ替えには対応していません
  • ウィジェットには最初の500個のオブジェクトのみが表示されます

この設定については、オブジェクトリストのドキュメントで詳しくはこちら。