モダン コントロール
キャンバスアプリのモダンコントロールは、マイクロソフト エコシステム内のユーザーインターフェイスの開発と設計における重要な進歩です。 マイクロソフトの Fluent Design System をベースとするこれらのコントロールは、テーマ設定機能とのシームレスな統合を確保すると同時に、高速でパフォーマンス指向の、アクセスしやすいユーザーエクスペリエンスを提供するように設計されています。 タブ リスト、進行状況バー、情報ボタン、スピナーなどを含むこれらのコントロールの導入は、より直感的で応答性が高く、視覚的に魅力的なアプリケーションを作成するための戦略的なシフトを強調しています。 これらの最新のコントロールを使用することで、開発者は見た目が美しく機能的にも充実した洗練された UI 要素を簡単に実装でき、全体的なユーザー エンゲージメントと満足度を高めることができます。
テーマ設定を考慮したこれらのコントロールの固有の設計により、アプリケーション全体で統一された一貫した外観と操作性が実現され、アプリのカスタマイズとブランディングに必要な労力が大幅に削減されます。 設定されたテーマに基づいてすべてのコントロールのスタイルを自動的に更新する機能により、設計プロセスが簡素化され、アプリケーション全体で視覚的な一貫性が保たれます。 これは、高品質のデジタル体験を提供しながらブランドの一貫性を維持しようとする現代企業のニーズに完全に合致しています。 最新のコントロールは、アクセシビリティとパフォーマンスにも重点を置いており、インクルーシブ デザインの原則に沿い、障碍者を含む幅広いユーザーがアプリケーションを使用できるようになっています。 このように、キャンバス アプリのモダンコントロールは、単なる UI コンポーネントセットではなく、開発者がより効率的で保守性が高く、アクセシブルでまとまりのあるアプリケーションを構築できるようにする変革的なツールセットです。
重要
キャンバス アプリの最新コントロールのサブセットは一般提供 (GA) されていますが、より広範な機能セットはまだプレビュー段階です。 これらのプレビュー コントロールを調べてフィードバックを提供することをお勧めします。 ただし、一般公開される前に、フィードバックとテストに基づいて機能が改良される可能性があることに留意することが重要です。
フォーム デザインとガイドライン
フォームを整理する
- フォームを論理的なセクションに分割し、関連するフィールドをグループ化します。
- フォームを 1 つの画面に収めるようにしましょう。 長い場合は、複数の画面、ステップ、またはタブに分割することを検討してください。
- フィールドのラベルには、聞き慣れない用語や専門用語を避け、明確でシンプルな言語を使用します。
- データの正確性を確保するために検証ルールを実装します。 必須項目については、必須であることを明記してください。 必要に応じて、電子メール アドレス、電話番号、その他の形式を検証します。
フォームの再利用
- 新しいレコードの作成、既存のレコードの編集、および表示専用モードでのレコードの表示には、単一のフォームを使用します。
- 同じフォームを再利用すると、一貫性を保ちながら開発とメンテナンスの時間を短縮できます。
フォームのモード
ユーザーの操作に基づいてフォーム モードを動的に設定します。 例:
- 新しいレコードを作成するときは、フォームを「新規」モードに設定します。
- 既存のレコードを編集する場合は、フォームを「編集」モードに設定します。
- レコードを表示する場合は、フォームを「表示」モードに設定します。
コントロール要素
- 異なるコントロール (ギャラリー、表示フォーム、編集フォームなど) を別々の画面に配置して、区別できるようにします。
- これらのコントロールを数式と組み合わせることで、まとまりのあるユーザー エクスペリエンスを実現できます。
コンテナー
キャンバス アプリのサイズが大きくなり、より多くのビジネス シナリオに対応するようになると、コントロールの数は増え続け、コントロールが実行する機能に基づいてコントロールを整理する必要があります。 これを行う簡単な方法のひとつは、コントロールをまとめて選択し、グループにまとめることです。 ただし、コントロールをグループ化することは必ずしも推奨されません。 キャンバス アプリの Container コントロールは、コントロールのセットを保持することができ、独自のプロパティを持っています。
コンテナは空のスペースとして機能し、コンテナーの左上隅に関連してコントロールを挿入したり整理したりできます。 コンテナをネストさせる柔軟性があるため、より複雑なレイアウトを作成でき、自由なデザインが可能です。
コンテナは、Width や BorderColor のような独自のプロパティを持つ実際のコントロールです。 Containers はアプリのレイアウトに影響を与え、スクリーン リーダー ユーザーがアプリの構造を理解するのに役立ちます。
グループに任意のコントロールを追加できますが、コンテナーには logically-related コントロールのみを追加する必要があります。
要素を整理する Power Apps グループを使用すると、ユーザーは複数の要素に共有プロパティを適用できます。 ただし、グループ内の個々のプロパティを変更する場合は、手動での調整が必要になる場合があります。 さらに、スクリーン リーダーはグループを認識できないため、アクセシビリティ上の理由から、グループはアプリの論理構造に存在しません。 さらに、グループをネストできないため、より複雑なレイアウトを作成することが困難になります。
ギャラリー デザインとガイドライン
ギャラリー アイテムの内部からの変更を回避する
子コントロールのイベント内でギャラリーの Items プロパティを OnChange や OnSelect のように変更することは避けてください。 これは、特に値が変更されたときにイベントをトリガーする特定のコントロールを処理する場合に、予期しない動作につながる可能性があります。
OnChange トリガー コントロールには注意が必要
ギャラリーでコンボ ボックス、日付ピッカー、スライダー、トグルなどのコントロールを使用する場合は注意してください。 これらのコントロールは、OnChange イベントが予期せず発生し、無限ループなどの問題が発生する可能性があります。
ファイルの部分置換のパフォーマンスへの影響
ギャラリー内のアイテムにファイルの部分置換したり更新したりする場合、特に多数のアイテムを扱う場合は、パフォーマンスへの影響に注意してください。 パッチの適用に時間がかかり、ギャラリーがすべてのアイテムを再読み込みしてパフォーマンスに影響を与える可能性があります。
無限ループを慎重に扱う**
ギャラリーのデータを変更するとイベントがトリガーされ、無限ループになる場合は、最新のコントロールや、データが変更されても OnChange がトリガーされないコントロールを使用してループを中断することを検討してください。
ネストしたギャラリーを回避する
ネストされたギャラリーは、パフォーマンスの問題や複雑なデータ バインディングにつながる可能性があります。
可能な限り、ギャラリーのネスト化は避けてください。 代わりに、データ構造を設計し、関数を最適な方法で使用してください。
高さを調節できるギャラリーを使用する
高さが固定されたギャラリーは、特に動的なデータを扱う場合、コンテンツの可視性が制限される可能性があります。
Height プロパティを Parent.Height またはデータに基づいた動的な値に設定することで、柔軟な高さのギャラリーを使用できます。 これにより、ギャラリーはさまざまな量のデータに合わせて高さを調整できるようになります。
データの読み込みを最適化する
Power Appsでのデータ読み込みを最適化する場合、データセット全体を取得するのではなく、必要な列のみを取得してギャラリーに表示したい場合があります。
次にその例を挙げます: 複数の列を持つ EmployeeData コレクションがあり、「Name」 および 「Department」 列のみをギャラリーに表示したいとします。
// Collection named ProductSales with sample sales data
ClearCollect(ProductSales,
Table(
{ ProductName: "Phone", UnitPrice: 499.99, QuantitySold: 100 },
{ ProductName: "Laptop", UnitPrice: 999.99, QuantitySold: 50 },
{ ProductName: "Tablet", UnitPrice: 299.99, QuantitySold: 75 }
)
)
// Bind the gallery to display only the "ProductName" and "QuantitySold" columns
Gallery1.Items = ShowColumns(ProductSales, ProductName, QuantitySold)
ギャラリーのベストプラクティスの詳細については、こちらをご参照ください。
再利用可能なコンポーネントの構築
Power Apps Component Framework (PCF) を使用してカスタム コード コンポーネントを作成する場合
Power Platform は、Power Apps Component Framework (PCF) を通して再利用可能なコンポーネントを作成することができます。 詳しくは、こちら をご覧ください。
Power Appsで PCF コンポーネントの作成を検討できるシナリオは次のとおりです:
複雑な UI 要素
標準の Power Apps コントロールではすぐに利用できない複雑なユーザーインターフェイス要素やコントロールを作成する必要がある場合。
特定の要件に合わせたカスタム コントロール
アプリに特定の要件があり、既成のコントロールでは満たせない場合、ニーズに合わせてカスタム コントロールを作成する必要があります。
アプリ間で一貫したユーザー エクスペリエンス
特定の機能を PCF コンポーネント内にカプセル化することで、複数の Power Apps や環境間で一貫したユーザー エクスペリエンスを維持したい場合。
アプリ間の再利用性
特定の機能やユーザー インターフェイス要素を複数のアプリで再利用する必要があると予測される場合、PCF コンポーネントを作成することで、一度構築したものを再利用することができます。
高度なロジックの導入
Power Apps の標準的な数式や関数の能力を超えた高度なビジネスロジックや計算を実装する必要がある場合。
改善されたユーザー エクスペリエンス
既定のコントロールでは実現できない、視覚的に魅力的でインタラクティブなコンポーネントを作成することで、全体的なユーザーエクスペリエンスの向上を目指す場合。