モデル駆動型アプリの列またはテーブルにコードコンポーネントを追加する

コード コンポーネントを使用すると、従来テキストを含む列をビジュアル化に変換することができます。 同様に、コード コンポーネントを使用して、ビューなどのデータセットを変換し、レコードの一覧ではなくより視覚的表現で表示することができます。 コード コンポーネントは、フォーム、ダッシュボード、ビュー、ホームページ グリッド上に視覚エフェクトとして表示することができます。

列にコード コンポーネントを追加する

以下の手順で、予算額 列の既定のラベルとテキスト ボックス列を、営業案件テーブルのスライダー コード コンポーネントに変更します。 同様のステップを使用して、既存の列をコード コンポーネントに置き換え、またはカスタム 列を使用するコード コンポーネントを構成することができます。

1. 設定 > カスタマイズ > システムのカスタマイズの順に移動します。

2. エンティティを展開して、営業案件テーブルなどの目的のテーブルを展開し、フォームを選択してから、メインフォームなどのフォームを開きます。

3. フォーム エディターで、営業案件のメイン フォーム上の 予算金額 列などの、コード コンポーネントを追加する列をダブル クリックします。 また、カスタム列を作成することもできます。

4. フィールド プロパティ ページで、コントロール タブを選択してから、コントロールの追加 を選択します。

5. コントロールの追加ページで、ここに示す 線形スライダー コンポーネントなどの、目的のコンポーネントを選択してから、追加 を選択します。

   

6. コンポーネントを表示するクライアントを選択します。

   • Web。 任意の Web ブラウザーからコード コンポーネントを使用できるようにするには、コンポーネントの隣にある Web オプションを選択します。 Web オプションの設定には PC、Mac、およびモバイル デバイス上の Web ブラウザー内でのコンポーネントの表示も含まれることに注意してください。

   • 電話: 電話用 Dynamics 365 を実行する電話でコード コンポーネントを利用可能にするには、コンポーネントの横の電話オプションを選択します。

   • タブレット PC。 タブレット用 Dynamics 365 を実行するタブレット PC デバイスでコード コンポーネントを利用可能にするには、コンポーネントの横のタブレット PC オプションを選択します。

   

7. 最小、最大、ステップ の横にある鉛筆アイコンを選択し、プロパティ オプションを設定してから OK を選択します。

   

   • 最小。 許容される最小値を設定します。 入力する静的な値をバインド、または既存の列に値をバインドすることができます。 この例で、静的な値にバインドは通貨で、入力することができる最小値は [ゼロ] です。

     • 静的な値にバインド。 整数 (Whole.None)、通貨、浮動小数点数 (FP)、または小数などの、データの種類を選択します。 次に、列で許容される最小値を示す数を入力します。

     • フィールドの値にバインド。 許容される最小値として使用される列を一覧から選択します。

   • 最大。 列の許容される最大値を設定します。 最小値と同様に、以前説明したように、入力する静的値をバインドまたは既存の列に値をバインドすることができます。 この例で、静的な値にバインドは通貨で、入力することができる最大値は 1,000,000,000 です。

   • ステップ。 これは、現在の値に対して追加または差し引くときにの増加または減少する単位を表します。 たとえば、予算金額の場合、100 ドルの increments\decrements を選択することができます。

   • 既定のコントロールを表示しない。 コード コンポーネントをサポートしていないクライアントでは、コンポーネントとデータの両方が表示されないようにコンポーネントを非表示にします。

8. OK を選択して、フィールドのプロパティ ページを閉じます。

9. カスタマイズをアクティブにするには、テーブル フォーム上で保存を選択してから、公開を選択します。

10. 保存して閉じるを選択してフォーム エディターを閉じます。

コード コンポーネントをテーブルに追加する

データセット コンポーネントや単純なテーブル コンポーネントなど、コード コンポーネントをグリッドやビューに追加するには、以下の手順に従います:

• 設定 > カスタマイズ に移動して システムのカスタマイズ をクリックします。
• エンティティ タブの横にある矢印をクリックして、コード コンポーネントを追加するテーブルを選択します。
• コントロール タブをクリックし、そして コントロールを追加 をクリックします。
• コントロールの追加ページで、単純なテーブル コンポーネントなど必要なコンポーネントを選択し、追加 を選択します。
• コンポーネントを表示するクライアントを選択します。

アクション中のコード コンポーネントを表示

前述の例の営業案件フォームなどの、コード コンポーネントを持つ列を含むレコードをオープンし、列が変更される様子を確認します。 以上で列はテキスト列ではなくスライダー コンポーネントとして表示されるようになりました。

関連項目

TypeScript でコンポーネントを実装する
Power Apps Component Framework API の参照
Power Apps Component Framework の概要