🤾🏾 👌🏽 🙍 Prism開発者ガイド-パート7、ユーザーインターフェイスの作成 📏 👨‍🏫 🏁

目次

はじめに
Prismアプリケーションの初期化
コンポーネント間の依存関係の管理
モジュラーアプリケーション開発
MVVMパターンの実装
高度なMVVMシナリオ
ユーザーインターフェイスの作成

ユーザーインターフェイスのガイドライン
ナビゲーション
ビューベースのナビゲーション
疎結合コンポーネント間の相互作用

ユーザーインターフェイスを作成するためのいくつかのパラダイムがあります。

すべてのコントロールは1つのXAMLファイルに含まれており、フォーム設計中に結合されます。
フォームは論理的な部分、通常はユーザーコントロールに分割されます。設計中にフォームが作成され、これらのパーツが参照されます。
前のバージョンと同様に、フォームは論理部分に分割されますが、それらを直接参照することはありません。実行時にパーツがフォームに追加されます。このようなアプリケーションはコンポジットと呼ばれます。

通常、複合アプリケーションインターフェイスは、ビューと呼ばれる異種のコンポーネントで構成されます。ビューは通常、アプリケーションモジュールにありますが、これは必須ではありません。アプリケーションをモジュールに分割する場合、疎結合ビューをユーザーインターフェイスに結合する方法が必要です。ただし、ビューが異なるモジュールにない場合でも、このアプローチを使用できます。

ユーザーインターフェイスを構築するには、実行時に生成される疎結合の視覚要素で構成されるマークアップを作成できるアーキテクチャが必要です。さらに、このアーキテクチャでは、ビュー同士が疎結合のままでメッセージを相互に交換できる必要があります。

下の図に示すように、 株式トレーダーリファレンス実装（株式トレーダーRI）は、さまざまなモジュールからShell

で宣言された領域にビューをロードすることにより、実行時にユーザーインターフェイスをコンパイルします。

株式トレーダーRIの地域と見解

ユーザーインターフェイスのレイアウト

複合アプリケーションのルート要素はShell

と呼ばれます。シェルはアプリケーションのマスターページとして機能し、複数のリージョン（ Region

）で構成されます。リージョンは、実行時にコンテンツがロードされるプレースホルダー要素です。リージョンは、 ContentControl

、 ItemsControl

、 TabControl

、またはユーザーコントロールなどのさまざまなUI要素に関連付けることができ、コンテンツを制御できます。リージョンは、アプリケーションの要件に応じて、コンテンツを自動またはオンデマンドでダウンロードできます。

通常、領域のコンテンツはビューです。アプリケーションのユーザーインターフェイスの一部をカプセル化し、アプリケーションの他の部分から分離します。ビューは、ユーザーコントロールまたはデータテンプレートのいずれかです。

領域は、ビューのレイアウトと表示を制御します。領域には名前でアクセスできます。また、ビューの動的な追加と削除もサポートしています。リージョンは、ビューが動的にロードされるコンテナと考えることができます。

次のセクションでは、複合アプリケーションを作成するための高レベルの概念について考察します。

シェル

シェルはアプリケーションのルートオブジェクトであり、ユーザーインターフェイスの主要部分が含まれています。 WPFアプリケーションでは、 Windows

オブジェクトはシェルとして機能します。 SilverlightアプリケーションRootVisualUserControl

。

ラッパーはマスターページとして機能し、インターフェイスの基本レイアウトを提供します。これには、モジュールが必要な表現を代用できる1つ以上の名前付き領域が含まれます。また、背景、メインメニュー、ツールバーなど、特定の高レベルのユーザーインターフェイスコンポーネントが含まれている場合もあります。

シェルは、アプリケーションの一般的な外観を定義します。シェル自体に表示されるスタイルと境界線、およびダウンロード可能なビューに適用できるスタイル、テンプレート、テーマを定義できます。

通常、シェルはプライマリWPFまたはSilverlightプロジェクトの一部です。シェルを含むアセンブリは、ロード可能なビューでアセンブリを参照する場合があります。または、実行時にアセンブリが検索およびロードされる場合、参照しない場合があります。

視聴回数

表現は、アプリケーションのユーザーインターフェイスを構築する主要な要素です。カスタムコントロール、ページ（ Page

）、またはデータテンプレートをビューとして使用できます。このビューは、アプリケーションの残りの部分から遠ざけたいユーザーインターフェイスの部分をカプセル化します。機能の分離とアプリケーション内のインターフェースの一部の再利用の両方に基づいて、プレゼンテーションに含める内容を選択できます。

WPFおよびSilverlightで使用されるコンテンツモデルのおかげで、Prismに関連するビューを作成するのに何も必要ありません。ビューを作成する最も簡単な方法は、 User Control

を作成することです。ビューをUIに追加するには、そのビューを作成してコンテナーに追加する方法のみが必要です。 WPFとSilverlightは、これを行うためのメカニズムを提供します。 Prismは、実行時にビューを動的に追加できる領域を指定する機能を追加します。

複合ビュー

いくつかの機能を追加すると、表現が非常に複雑になる可能性があります。この場合、それを複数の子ビューに分割し、親ビューを使用して子ビューを作成および配置できます。これは設計時に静的に発生する場合と動的に発生する場合があり、モジュールは実行時にビューを領域に置き換えることができます。ビューが1つのクラスで完全に定義されていない場合、複合ビューとして参照できます。多くの場合、親ビューは子ビューの作成とそれらの相互作用の調整の両方を担当します。イベントアグリゲーターやコマンドオブジェクトなどのPrism機能を使用して、相互に関連性の低い子ビューを設計できます。

ビューとデザインパターン

Prismはこれを主張していませんが、ビューを作成する際にいくつかのデザインパターンの使用を検討する必要があります。 Stock Trader RIおよびQuickStartsは、インターフェイスとロジック間で責任を共有するためのMVVMパターンの使用を示します。

MVVMデザインパターンは、WPF、Silverlight、Windows Phone、Windows RTなどのMicrosoft XAMLプラットフォームと自然に調和するため、ほとんどの場合に推奨されます。依存プロパティのメカニズムとデータバインディングの豊富なサポートにより、プレゼンテーションモデルとプレゼンテーションが疎結合で相互作用することができます。

プレゼンテーションロジックをプレゼンテーション自体から分離することは、テストとメンテナンスの容易さを促進し、デザイナーとプログラマー間のやり取りのプロセスを改善する重要なステップです。

ビューをユーザーコントロールとして作成し、ロジックを別のコードファイルに配置する場合、ビューのインスタンスを作成し、それを介してロジックをテストする必要があるため、テストするのは困難です。これは、膨大な量のインフラストラクチャのスタブを作成する必要があるという理由で、いくつかの困難をもたらします。したがって、インフラストラクチャへの依存関係を削除するには、プレゼンテーションロジックをプレゼンテーション自体から分離する必要があります。

ビューをデータテンプレートとして作成する場合。このビューに関連付けられたコードがありません。このため、コンパニオンロジックを別の場所に配置する必要があります。テスト容易性を提供したのと同じアプローチが、ビューの展開に役立ちます。

ご注意

ユニットテストとUI自動化テストは、カバレッジがまったく異なる2つのまったく異なるテストアプローチです。単体テストのベストプラクティスでは、オブジェクトを完全に分離してテストすることをお勧めします。これを実現するには、すべての依存関係の偽物とスタブを作成する必要があります。その後、単体テストは1つのオブジェクトのみで機能します。オートメーションUIテストはアプリケーションを実行し、UIにジェスチャーを適用して結果を検証します。このタイプのテストは、コントロールがアプリケーションロジックに正しく接続されていることを確認するために必要です。

論理を表現から分離すると、責任の分離が促進されます。これにより、テスト能力が向上するだけでなく、UIデザイナーは開発者とは独立して作業できます。 MVVMパターンの詳細については、パート5：「MVVMパターンの実装」を参照してください。

コマンド、UI トリガー、アクション、および動作

プレゼンテーションロジックが別のコードにある場合、イベントハンドラーを使用してUIと対話します。ただし、MVVMを使用する場合、ビューモデルはUIで生成されたイベントを直接処理できません。イベントをUIからプレゼンテーションモデルにリダイレクトするには、コマンド、UIトリガー、アクション、または動作を使用できます。

コマンドは、セマンティクスと、このコマンドが呼び出されるオブジェクトを、コマンド自体のロジックから分離します。また、コマンドオブジェクトを使用すると、このコマンドを現在実行できるかどうかを判断できます。 UIのコマンドは、ビューモデルのICommandタイプのプロパティに関連付けられています。詳細については、パート5の「コマンド」セクションを参照してください。

UIトリガー、アクション、および動作は、 Microsoft.Expression.Interactivity

名前空間の一部であり、Expression Blendに付属しています。 Expression SDKの一部でもあります。これらのコンポーネントは、UIイベントまたはコマンドをインターセプトし、それらを現在のデータコンテキストオブジェクトのICommand

プロパティにルーティングするための広範なAPIを提供します。それらの詳細については、パート5の関連セクションを参照してください。

データバインディング

データバインディングは、XAMLプラットフォームの最も重要な機能です。 XAMLを使用するアプリケーションを正常に構築するには、データバインディングに精通している必要があります。

データバインディングは、依存プロパティシステムによって提供される組み込みの変更通知システムを使用します。 INotifyPropertyChanged

CLRインターフェイスと組み合わせると、これらの通知を使用して、追加のコードを使用せずに、レシーバーとデータバインディングソース間の対話を整理できます。

データバインディングを使用すると、値コンバーターを使用して、データタイプごとに互換性のないソースとレシーバーを接続できます。また、データ検証のためのいくつかのメカニズムも提供します。

地域

リージョンは、リージョンマネージャー、リージョン、リージョンアダプターを通じてPrismで使用できます。次のセクションでは、それらの仕組みと相互作用について説明します。

地域のマネージャー（地域マネージャー）

RegionManager

クラスRegionManager

、コントロール内のリージョンのコレクションを作成およびデプロイします。 RegionManager

は、新しい領域を対応するコントロールに関連付けるために、各タイプのコントロールに固有のアダプターを使用します。次の図は、リージョン、コントロール、およびアダプターの関係を示しています。

リジョン、コントロル、アダプターの関係

RegionManagerは、コードまたはXAMLで領域を作成できます。添付されたRegionManager.RegionNameプロパティは、このリージョンのホストとして機能するコントロールに適用することにより、XAMLでリージョンを作成するために使用されます。

アプリケーションには、 RegionManager

1つ以上のインスタンスを含めることができます。地域マネージャーのどのインスタンスで地域を登録する必要があるかを選択することができます。これは、ビジュアルツリーでコントロールを移動したいが、添付プロパティをクリアした後に領域をクリアしたくない場合に役立ちます。

RegionManagerには、リージョン間でデータを交換できる添付されたRegionContext

プロパティがあります。

リージョンを作成する

リージョンは、 IRegion

インターフェイスを実装するクラスです。「領域」という用語は、動的なユーザーインターフェイスコンテンツを保持できるコンテナーを意味します。リージョンにより、Prismは、モジュールに含まれる動的コンテンツをユーザーインターフェイスの定義済みプレースホルダーにホストできます。

リージョンは、あらゆるタイプのUIコンテンツを保持できます。モジュールには、ユーザーコントロール、関連するデータパターンを持つデータ、特殊なコントロール、またはそれらの組み合わせとして表されるUIコンテンツを含めることができます。これにより、UIでエリアの場所を指定し、モジュールがこれらのエリアにコンテンツをロードできるようになります。

領域には、ゼロ個以上の要素を含めることができます。特定の領域のホストとして使用されるコントロールに応じて、1つ以上の要素が表示される場合があります。たとえば、ContentControlは1つのオブジェクトのみを表示できますが、 ItemsControl

は一度に複数のアイテムを表示できます。

次の図では、 Stock Trader RIシェルはMainRegion

、 MainToolbarRegion

、 ResearchRegion

、およびActionRegion

の4つの領域で構成されています。これらの領域にはさまざまなアプリケーションモジュールが配置されています。コンテンツはいつでも変更できます。

地域株式トレーダーRI

リージョン内のモジュールからユーザーコントロールを表示する

モジュールとコンテンツが地域にどのように関連するかを示すために、次の図を参照してください。 WatchModule

とNewsModule

のシェル内の対応する領域との関連付けを示しています。

MainRegion

領域には、 WatchModule

モジュールに含まれるWatchListView

コントロールが含まれます。 ResearchRegion

領域には、 NewsModule

モジュールにあるArticleView

ユーザーコントロールも含まれます。

Prismで作成されたアプリケーションでは、デザイナーや開発者が特定の地域に含まれるコンテンツを決定するために使用するため、このようなマッピングは開発プロセスの自然な部分になります。これにより、デザイナーは、必要なスペースの量と追加する必要があるものを決定して、提供されたスペースにコンテンツを表示できます。

リージオン内のモジュールカラユーザーコントロールを表示する

地域の標準機能

領域を使用するために実装の詳細を知る必要はありませんが、コントロールと領域が互いにどのように関連付けられているかを理解することは有用です。また、標準機能についても説明します。たとえば、リージョンがビューを見つけて作成する方法、アクティブになったときにビューに通知する方法、ビューのライフサイクルをアクティブ化に関連付ける方法などです。

以下のセクションでは、地域のアダプターと地域の動作について説明します。

リージョンアダプター

コントロールをリージョンに置き換えるには、必要なアダプターが必要です。リージョナルアダプターは、リージョンを作成し、それをコントロールに関連付ける役割を果たします。これにより、 IRegion

インターフェイスを使用して、コントロールのコンテンツを一貫した方法で制御できます。各地域のアダプターは、特定の種類の制御を適応させます。 Prismは次のアダプターを提供します。

ContentControlRegionAdapter 。 System.Windows.Controls.ContentControl

とその子孫を適応させます。
SelectorRegionAdapterは、 System.Windows.Controls.Primitives.Selector

とその子孫（ System.Windows.Controls.Primitives.Selector

など）を適応させます。
ItemsControlRegionAdapterは、 System.Windows.Controls.ItemsControl

とその子孫を適応させます。

ご注意

SilverlightバージョンのPrismライブラリには、 TabControlRegionAdapter

と呼ばれる別のアダプターが含まれていTabControlRegionAdapter

。これは、SilverlightのTabControl

がSelector

クラスの子孫ではなく、WPFの対応するTabControl

とは異なる動作をするためです。

地域行動

プリズムは、地域行動の概念を導入しています。これらは、リージョンのほとんどの機能を担当するプラグインコンポーネントです。ビュー検出とリージョンコンテキストをサポートし、WPFとSilverlightの両方に一貫したAPIを作成するための動作が導入されました。さらに、動作により、リージョンの機能を拡張する効果的な方法が表示されます。

動作は、リージョンにアタッチされ、追加の機能を提供するクラスです。行動は地域に加わり、その存在を通じてアクティブのままです。たとえば、 AutoPopulateRegionBehavior

参加するAutoPopulateRegionBehavior

は、指定された名前を持つリージョンに登録されたビュータイプを自動的に作成および追加します。リージョンのRegionViewRegistry

期間中、 RegionViewRegistry

の新規登録を監視し続けます。アプリケーション全体と特定の地域の両方で、新しい動作を追加したり、既存の動作を置き換えるのは簡単です。

次のいくつかのセクションでは、リージョンに自動的に追加される標準的な動作について説明します。例外はSelectorItemsSourceSyncBehavior

の動作で、 Selector

クラスの子孫であるコントロールにのみアタッチします。

登録動作

RegionManagerRegistrationBehavior

、目的のリージョンマネージャーにリージョンが確実に登録されるようにします。ビューまたはコントロールが別の要素または領域の子孫としてビジュアルツリーに追加される場合、そのコントロールに関連付けられた領域は、親コントロールのRegionManagerに登録する必要があります。コントロールが削除されると、リージョン登録を削除する必要があります。

自動人口行動

2つのクラスが表現の検索を担当します。それらの1つはAutoPopulateRegionBehavior

です。リージョンに参加すると、このリージョンの名前で登録されているすべてのタイプのビューを受け取ります。その後、彼はこれらの表現のコピーを作成し、リージョンに追加します。領域を作成した後、 RegionViewRegistry

は、指定された領域名のRegionViewRegistry

での新しいビューの登録を監視します。

ビューの検出プロセスをさらに制御する必要がある場合は、独自のIRegionViewRegistry

およびAutoPopulateRegionBehavior

実装を作成できます。

リージョンコンテキストの動作

領域のコンテキストの機能はとで囲まれSyncRegionContextWithHostBehavior

ていBindRegionContextToDependencyObjectBehavior

ます。これらの動作は、領域に対して作成されたコンテキストの変更を監視し、このコンテキストをビューに関連付けられた対応する依存関係プロパティと同期させる役割を果たします。

アクティベーション動作

RegionActiveAwareBehavior

それがアクティブかどうかの提出を通知する責任があります。これらの通知を受信するには、ビューにinterfaceを実装する必要がありますIActiveAware

。これらの通知は単方向であり、動作からプレゼンテーションに渡されます。ビューは、インターフェイスの対応するプロパティに影響を与えて、それ自体をアクティブにすることはできませんIActiveAware

。

リージョンのライフタイム動作

RegionMemberLifetimeBehavior

非アクティブ化されたときに要素を領域から削除するかどうかを決定します。地域のRegionMemberLifetimeBehavior

コレクションActiveViews

を監視して、どのアイテムが非アクティブになっているかを判断します。動作は、削除する要素をチェックし、削除したときに保存するかどうIRegionMemberLifetime

かをRegionMemberLifetimeAttribute

（この順序で）決定します。

アイテムがそうであるなら、System.Windows.FrameworkElement

それはDataContext

また入手可能性IRegionMemberLifetime

に関してチェックされます、またはRegionMemberLifetimeAttribute

。

リージョン要素は、次の順序でチェックされます。

価値 IRegionMemberLifetime.KeepAlive
価値 IRegionMemberLifetime.KeepAlive DataContext
価値 RegionMemberLifetimeAttribute.KeepAlive
価値 RegionMemberLifetimeAttribute.KeepAlive DataContext

コントロール固有の動作

SelectorItemsSourceSyncBehavior

WPF Selector

などでコントロールがから継承される場合にのみ使用されTabControl

ます。セレクタ内の選択された要素と領域内のアクティブな表現とのマッチングを担当します。

TabControlRegionSyncBehavior

同様にSelectorItemsSourceSyncBehavior

、代わりにSilverlightで使用されます。

地域の機能の拡張

Prismには、提供されたAPIの標準動作を拡張またはオーバーライドできる拡張ポイントがあります。たとえば、独自の地域アダプター、地域の動作を記述したり、ナビゲーションAPIが URIを解析する方法を変更したり、ナビゲーションAPIを拡張してSilverlightフレームナビゲーションと連携したりできます。詳細については、「Prismの拡張」を参照してください。

プレゼンテーション構成

ビューの構成は、ビューの作成方法です。複合アプリケーションでは、実行時に複数のモジュールからのビューをユーザーインターフェイスの特定の場所に表示する必要があります。これを実現するには、ビューを配置する領域と、これらの領域でビューを作成および表示する方法を指定する必要があります。

表現は、表現の発見を通じて自動的に、および表現の実装を通じてプログラム的に作成および表示できます。これらの2つの手法は、アプリケーションのユーザーインターフェイスで名前付き領域にビューをマップする方法を決定します。

検出表現（ビューディスカバリー）

このアプローチでは、領域の名前とのビューのタイプとの関係を作成する必要がありますRegionViewRegistry

。リージョンが作成されると、ViewTypes

そのリージョンに関連するすべてのものが検索され、対応するビューが自動的に作成およびダウンロードされます。したがって、このアプローチでは、この領域に対応するリプレゼンテーションの作成および表示方法を直接制御することはできません。

表現の導入（ビューテイクインジェクション）

この場合、コードは領域へのリンクを受け取り、プログラムでビューを追加します。通常、これはモジュールのロード中、またはユーザーのアクションに応じて行われます。RegionManager

必要な地域のコードを名前で要求し、そこに導入する必要があります。そのため、ビューを作成してリージョンに置き換える方法をより詳細に制御できます。リージョンからビューを削除することもできます。ただし、まだ作成されていない領域にビューを追加することはできません。

Prism Library 4.0には、ナビゲーションAPIが含まれています。ナビゲーションAPIを使用すると、URIをナビゲートしてビューを簡単に実装できます。Navigation APIはビューを作成し、それを領域に追加してアクティブにします。さらに、ナビゲーションAPIを使用すると、リージョンに含まれる以前に作成されたビューに移動できます。詳細については、パート8 「ナビゲーション」を参照してください。

ビュー検出を使用するタイミングとビューを導入するタイミング

領域ロード戦略の選択は、アプリケーションの要件と領域の機能に依存します。

ビュー検出は、次の状況で使用できます。

ビューを自動的にロードすることが望ましい、または必要です。
ビューの単一のインスタンスが領域にロードされます。

実装ビュー：

アプリケーションはNavigation APIを使用します。
ビューの作成方法と表示方法を明示的に制御する必要があります。または、ユーザーのアクションに応じて、またはナビゲーションの結果として、ビューをリージョンから削除する必要があります。
リージョンに同じビューの複数のインスタンスを表示し、各ビューをそのデータにリンクする必要があります。
ビューを追加するリージョンのインスタンスを制御する必要があります。たとえば、関連する情報領域のバイヤーに関する情報を含むビューを追加します。このアプローチでは、範囲を限定したリージョンを作成する必要がありますが、これについては後で説明します。

UIビルドシナリオ

複合アプリケーションでは、実行時に複数のモジュールからのビューがユーザーインターフェイスの特定の場所に表示されます。これを行うには、これらのビューが表示される領域、およびこれらのビューが作成され、これらの領域に関連付けられる方法を指定する必要があります。

インターフェースの表示と表示の場所を分離することにより、アプリケーションの外観とレイアウトを、リージョンにロードされた表示とは独立して開発できます。

以下のセクションでは、複合アプリケーションを開発するときに発生する主なシナリオについて説明します。必要に応じて、Stock Trader RIの例がこれらのシナリオのソリューションを示します。

シェル作成

ラッパーは、プライマリUIコンテンツを含むアプリケーションのルートオブジェクトです。 WPFアプリケーションでは、ラッパーはインスタンスWindows

です。 Silverlightで- RootVisualUserControl

。

シェルには、モジュールが必要な表現を代用できる名前付き領域が含まれる場合があります。メインメニューやツールバーなど、特定の高レベルUI要素を定義することもできます。シェルは、ASP.NETマスターページと同様に、アプリケーションの基本構造とプレゼンテーションを定義します。スタイル、シェル自体に表示される境界線、およびシェルにロードされたビューに適用されるスタイル、テンプレート、テーマを設定できます。

Prismを使用してアプリケーションを作成する場合、ラッパーはオプションです。新しい複合アプリケーションを作成している場合、シェルを作成すると、アプリケーションの明確に定義されたルートが提供され、メインアプリケーションインターフェイスで初期化テンプレートが使用可能になります。ただし、Prismサポートを既存のアプリケーションに追加する場合、シェルを追加するためにメインアーキテクチャを変更する必要はありません。代わりに、ウィンドウまたはコントロールの既存の定義を変更して、ビューを表示するための領域を追加できます。

アプリケーションには複数のシェルを含めることができます。ユーザーが複数の高レベルウィンドウを開くことができるようにアプリケーションが設計されている場合、そのような各ウィンドウはそのコンテンツのシェルとして機能できます。

Stock Trader RI

シェルとしてのWPF Stock Trader RIアプリケーションにはメインウィンドウがあります。次の図は、シェルとビューを強調しています。シェルは、アプリケーションの起動時に作成され、すべてのビューを含むメインウィンドウです。モジュールが必要な表現を置き換える領域と、タイトルやウォッチリストバナーなどのいくつかの高レベルのユーザーインターフェイス要素を定義します。Stock Trader RI

株式トレーダーRIのシェル、リージョン、ビュー

シェルの実装は、ファイル、その別個のコードファイル、およびプレゼンテーションモデルで提示されます。モジュールがビューを追加する領域の定義を含む、シェルの一部であるマークアップ要素とUI要素が含まれます。Shell.xaml

Shell.xaml.cs

ShellViewModel.cs

Shell.xaml

次のXAMLは、シェルで定義された構造と基本要素を示しています。添付プロパティRegionName

は領域を決定するのに役立ち、ウィンドウの背景画像はシェルの背景画像です。

XAML Shell.xaml（WPF）

 <Window x:Class="StockTraderRI.Shell"> <!—shell background --> <Window.Background> <ImageBrush ImageSource="Resources/background.png" Stretch="UniformToFill"/> </Window.Background> <Grid> <!--  --> <Canvas x:Name="Logo"> <TextBlock Text="CFI" ... /> <TextBlock Text="STOCKTRADER" .../> </Canvas> <!--    --> <ItemsControl x:Name="MainToolbar" cal:RegionManager.RegionName="{x:Static inf:RegionNames.MainToolBarRegion}"> </ItemsControl> <!--  --> <Grid> <Controls:AnimatedTabControl x:Name="PositionBuySellTab" cal:RegionManager.RegionName="{x:Static inf:RegionNames.MainRegion}"/> </Grid> <!--  --> <Grid> <ContentControl x:Name="ActionContent" cal:RegionManager.RegionName="{x:Static inf:RegionNames.ActionRegion}"> </ContentControl> </Grid> <!--   --> <Grid x:Name="SideGrid"> <Controls:ResearchControl cal:RegionManager.RegionName="{x:Static inf:RegionNames.ResearchRegion}"> </Controls:ResearchControl> </Grid> </Grid> </Window>

実装はShell.xaml.cs

非常に簡単です。Shell

エクスポート可能であるため、ブートローダーで作成できます。その依存関係はMEFによって解決されます。シェルには、ShellViewModel

MEFを使用して作成中に実装されるに対する単一の依存関係があります。

C＃Shell.xaml.cs

 [Export] public partial class Shell : Window { public Shell() { InitializeComponent(); } [Import] ShellViewModel ViewModel { set { this.DataContext = value; } } }

C＃ShellViewModel.cs

 [Export] public class ShellViewModel : NotificationObject { //        . }

分離コードファイルのコードの量によって、複合アプリケーションのアーキテクチャの能力とシンプルさ、およびシェルとビュー間の接続の弱さを評価できます。

地域の設定

領域は、実行時に1つ以上のビューが表示されるゾーンの役割を果たします。モジュールは領域を検出し、表現をロードすることができますが、どのように、どこに配置されているかはわかりません。これにより、コンテンツを提供するモジュールに影響を与えることなく、リージョンを変更するように変更できます。

リージョンは、XAMLまたはコードでコントロールにリージョン名を関連付けることで指定できます。領域へのアクセスは、その名前で取得できます。実行時に、ビューが領域に追加され、領域に関連付けられたコントロールの機能に従って表示されます。たとえば、TabControl

、タブ付きビューを表示します。リージョンは、ビューの追加と削除をサポートします。ビューは、プログラムと自動の両方で作成および表示できます。 Prismでは、これはビューの埋め込みとビューの発見を使用して実現されます。これらの2つの手法により、ユーザーインターフェイスで個々のビューを名前付き領域にマップする方法が決まります。

アプリケーションシェルは、最高レベルのマークアップを定義します。たとえば、次の図に示すように、メインコンテンツとナビゲーションコンテンツの場所を設定します。これらの高レベルビュー内のマークアップは同様の方法で定義でき、ユーザーインターフェイスを再帰的にコンパイルできます。

シェルブランク

リージョンは、いくつかの論理的に関連するビューの場所を指定するために使用される場合があります。この場合、リージョンは通常、ItemsControlまたはその後継であり、アイテムをスタックやタブに配置するなど、レイアウト戦略に従ってビューを表示します。

領域はまた、例えば、使用して、単一の表現の位置を特定するために使用することができますContenControl

。この場合、リージョンに関連付けられたコントロールには、複数のビューがリージョンに追加されていても、一度に1つのビューしか表示されません。

株式トレーダーRIシェルの地域

Stock Trader RIは、地域に追加された単一のビューと複数のビューの両方を使用したアプローチの例を提供します。アプリケーションシェルで両方のアプローチを確認できます。次の図は、Stock Trader RIシェルで定義された地域を示しています。株式を売買する際に

株式トレーダーRIシェルの地域

、株式トレーダーRIでマルチビューアプローチを見ることができます。以下に示すように、買い/売りエリアはリストのような領域でOrderCompositeView

、リスト項目として表示されます。

ItemsControlリージョン

シェル領域にActionRegion

はが含まれますOrdersView

。OrdersView

[ すべて送信] ボタンと[ すべてキャンセル]ボタン、および地域が含まれていますOrdersRegion

。OrdersRegion

ListBox

複数のビューを表示するコントロールに添付されますOrderCompositeViews

。

IRegionインターフェイス

領域は、インターフェースを実装するクラスですIRegion

。リージョンは、コントロールに表示するコンテンツを含むコンテナです。次のコードは、このインターフェースに含まれるものを示しています。

 public interface IRegion : INavigateAsync, INotifyPropertyChanged { IViewsCollection Views { get; } IViewsCollection ActiveViews { get; } object Context { get; set; } string Name { get; set; } Comparison<object> SortComparison { get; set; } IRegionManager Add(object view); IRegionManager Add(object view, string viewName); IRegionManager Add(object view, string viewName, bool createRegionManagerScope); void Remove(object view); void Deactivate(object view); object GetView(string viewName); IRegionManager RegionManager { get; set; } IRegionBehaviorCollection Behaviors { get; } IRegionNavigationService NavigationService { get; set; } }

XAMLへの領域の追加

RegionManager

XAMLで領域を簡単に作成するために使用できる添付プロパティを提供します。このアプローチを使用するには、XAMLでPrism名前空間を追加し、添付プロパティを使用する必要がありますRegionName

。次の例は、リージョンを要素に関連付ける方法を示していますAnimatedTabControl

。

領域の名前で文字列を取得するためにMainRegion

、マークアップ拡張機能が使用されx:Static

ます。これにより、XAMLでのマジックストリングの使用が回避されます。

 <Controls:AnimatedTabControl x:Name="PositionBuySellTab" cal:RegionManager.RegionName="{x:Static inf:RegionNames.MainRegion}"/>

Silverlight 4は使用を許可しませんx:Static

。したがって、文字列値を使用して領域を指定するか、必要に応じて、これらの名前が含まれるアプリケーション全体で使用可能な文字列リソースを決定する必要があります。RegionName

このアプローチを使用して、添付プロパティをそのようなリソースに関連付けて、領域の名前を取得できます。

 <Controls:AnimatedTabControl Regions:RegionManager.RegionName="MainRegion" />

コードで領域を追加する

これを使用RegionManager

すると、XAMLを使用せずにコード内で領域を直接登録できます。次のコード例は、別のコードファイルで領域をコントロールに関連付ける方法を示しています。開始するには、地域マネージャーへのリンクを取得する必要があります。次に、静的メソッドRegionManager.SetRegionManager

およびを使用してRegionManager.SetRegionName

、領域がコントロールActionContent

に関連付けられます。その後、その名前は"ActionRegion"に設定されます。

 IRegionManager regionManager = ServiceLocator.Current.GetInstance<IRegionManager>(); RegionManager.SetRegionManager(this.ActionContent, regionManager); RegionManager.SetRegionName(this.ActionContent, "ActionRegion");

リージョンをロードするときにビューを表示する

表現の発見に近づくと、モジュールは特定の名前付き領域に表現（プレゼンテーションモデル、プレゼンターモデル）を登録できます。実行時に領域が表示されると、その領域に登録されているビューが作成され、自動的に表示されます。

モジュールは、レジスタを使用して表現を登録します。親サブミッションは、指定された名前でリージョンに登録されているレジストリサブミッションから要求できます。検出されると、親ビューはこれらのビューを画面に配置し、リージョンに関連付けられたコントロールに追加します。

アプリケーションをロードした後、複合ビューは、ユーザーインターフェイスのレジスタに追加された新しいビューを配置する必要があるという通知を受け取ります。

次の図は、ビュー検出アプローチを示しています。

発見を見る

プリムは、RegionViewRegistry

名前付きリージョンに提出物を登録するための標準登録クラスを提供します。

領域にビューを表示するには、領域マネージャーにビューを登録する必要があります。次の例に示すように。ビューのタイプを直接指定できます。その後、ビューは、領域をロードするときに依存性注入コンテナを介して解決されます。

 this.regionManager.RegisterViewWithRegion("MainRegion", typeof(EmployeeView));

以下に示すように、必要なビューを返すデリゲートを提供することもできます。リージョンの作成時に、リージョンマネージャーがビューを表示します。

 this.regionManager.RegisterViewWithRegion("MainRegion", () => this.container.Resolve<EmployeeView>());

UIの構成QuickStarはでステップバイステップガイド持つEmployeeModule ModuleInit.cs

メソッドを使用する方法を示したファイルをRegisterViewWithRegion

。

プログラムで領域に表現を表示する

ビューを導入するアプローチでは、モジュールを担当する領域にプログラムで追加または削除されます。これを可能にするために、アプリケーションは、ユーザーインターフェイスで宣言された名前付き領域のレジスタを維持します。モジュールは、このレジスタを使用して、そこから領域を取得し、プログラムでビューを挿入できます。アプリケーション全体で領域へのアクセスを均一にするために、各名前付き領域はインターフェースを実装しますIRegion

。次の図は、ビューを導入するアプローチを示しています。

ビューの紹介

ビューをリージョンに導入するには、リージョンマネージャーを介してこのリージョンを取得し、メソッドを呼び出す必要がありますAdd

以下に示すように。このアプローチでは、ビューをリージョンに追加した後にのみ表示されます。これは、モジュールのロード後、またはユーザーのアクションに応じて発生します。

 IRegion region = regionManager.Regions["MainRegion"]; var ordersView = container.Resolve<OrdersView>(); region.Add(ordersView, "OrdersView"); region.Activate(ordersView);

Stock Trader RIおよびUI Composition QuickStartは、このアプローチを適用するための段階的なガイドを提供します。

Prism Library 4.0には、WPFまたはSilverlightアプリケーションをナビゲートするための豊富で一貫したアプローチを提供するナビゲーションAPIが含まれています。

リージョンナビゲーションは、ビューを導入する場合です。ナビゲーション要求の処理中に、要求を満たすことができる領域内の表現を見つけようとします。適切なビューを見つけることができない場合、必要なビューがDIコンテナを介して作成され、その後ターゲット領域に実装されてアクティブ化されます。

次のコードは、Stock Trader RIの 例を使用してArticleViewModel

ナビゲーション要求を開始する方法を示しています。

 this.regionManager.RequestNavigate(RegionNames.SecondaryRegion, new Uri("/NewsReaderView", UriKind.Relative));

詳細については、パート8、ナビゲーションセクションを参照してください。ビュー切り替えナビゲーションクイックスタートと状態ベースのナビゲーションクイックスタートもこのアプローチの例です。

リージョン内のビューの順序付け

領域が複数のビューの表示をサポートするコントロールに関連付けられている場合、使用する方法に関係なく、アプリケーションは特定のコントラクトの領域にビューを配置する必要があります。デフォルトでは、ビューは、登録されてその領域に追加された順序で領域に配置されます。

複合アプリケーションを作成するとき、ビューはしばしば異なるモジュールに登録されます。モジュール間の依存関係を作成することでこの問題を解決できますが、これは最適なアプローチではありません。

リージョン内でのビューの配置方法を制御するために、Prismは属性を提供しますViewSortHint

。文字列プロパティが含まれています。Hint

、ビューで地域内にどのように配置したいかについてのヒントを与えることができます。

ビューを表示するとき、クラスRegion

はこのヒントを考慮した標準のソート手順を使用します。これは、文字列の単純で大文字と小文字を区別するソートです。この属性を持つビューはソートされ、それがないビューの前に配置されます。属性のないビューは、リージョンに追加された順序で配置されます。

ビューが地域ごとにソートされる方法を変更したい場合、クラスRegion

にはプロパティがありSortComparison

、それを介して独自のデリゲートを設定できますComparison<object>

。地域のプロパティの並べ替えViews

とActiveViews

などのアダプタItemsControlRegionAdapter

がこれらのプロパティに直接バインドされるため、UIに反映されます。カスタムアダプターは独自の並べ替えメソッドを実装できます。このメソッドは、領域で実行されるビューの並べ替えをオーバーライドします。

ビュー切り替えクイックスタートは、番号付けを使用してナビゲーション領域のビューを整理する簡単な図を示します。次の例でViewSortHint

は、ナビゲーションを担当する各ビューに適用されます。

 [Export] [ViewSortHint("01")] public partial class EmailNavigationItemView { … } [Export] [ViewSortHint("02")] public partial class CalendarNavigationItemView { … } [Export] [ViewSortHint("03")] public partial class ContactsDetailNavigationItemView { … } [Export] [ViewSortHint("04")] public partial class ContactsAvatarNavigationItemView { … }

複数の地域間でのデータ交換

プリムは、シナリオに応じて、ビュー間で対話するためのいくつかのアプローチを提供します。リージョンマネージャーは、RegionContext

そのようなアプローチの1つとしてプロパティを提供します。

RegionContext

親ビューと子ビューで共通のデータコンテキストを使用する場合に便利です。RegionContext

添付プロパティです。このプロパティを使用して必要なコンテキストを設定すると、対応するリージョンに追加された子ビューで使用できるようになります。これは、データバインディングを実行できる単純なオブジェクトでも複雑なオブジェクトでもかまいません。RegionContext

表現の検出と実装の両方で使用できます。

ご注意

DataContext

SilverlightおよびWPF のプロパティは、プレゼンテーションのローカルデータコンテキストを設定するために使用されます。これにより、ビューはデータバインディングを使用して、ビューモデル、ローカルプレゼンター、またはモデルと対話できます。RegionContext

複数のビューにわたってコンテキストを共有するために使用され、単一のビューに対してローカルではありません。これにより、複数のビュー間でコンテキストを共有するためのシンプルなメカニズムが提供されます。

次のコードは、添付プロパティがRegionContext

XAMLでどのように使用されるかを示しています。

 <TabControl AutomationProperties.AutomationId="DetailsTabControl" cal:RegionManager.RegionName="{x:Static local:RegionNames.TabRegion}" cal:RegionManager.RegionContext="{Binding Path=SelectedEmployee.EmployeeId}" ... >

RegionContext

以下に示すようにコードでインストールすることもできます。

 RegionManager.Regions["Region1"].Context = employeeId;

ビューのコンテキストを取得するには、静的メソッドを使用できますRegionContext.GetObservableContext

。次に示すように、ビューをパラメーターとして受け取り、その後、プロパティを介してコンテキストにアクセスできValue

ます。

 private void GetRegionContext() { this.Model.EmployeeId = (int)RegionContext.GetObservableContext(this).Value; }

値は、RegionContext

新しいプロパティ値の単純な代入によって変更することができますValue

。ビューは、メソッドを呼び出して取得できるPropertyChanged

タイプのオブジェクトのイベントを使用して、コンテキスト変更通知をサブスクライブObservableObject

できますGetObservableContext

。これにより、コンテキストが変更されたときに複数のビューを同期できます。次の例は、コンテキストの変更をサブスクライブする方法を示しています。

 ObservableObject<object> viewRegionContext = RegionContext.GetObservableContext(this); viewRegionContext.PropertyChanged += this.ViewRegionContext_OnPropertyChangedEvent; private void ViewRegionContext_OnPropertyChangedEvent(object sender, PropertyChangedEventArgs args) { if (args.PropertyName == "Value") { var context = (ObservableObject<object>) sender; int newValue = (int)context.Value; } }

ご注意

RegionContext

, , , DependencyObject

. , , DependencyObject

. , , , . , RegionContext

, DependencyObject

.

スコープが制限された領域は、ビュー実装を使用する場合にのみ使用できます。地域の独自のインスタンスを使用したプレゼンテーションが必要な場合に必要になることがあります。添付プロパティを使用して領域を指定するビューは、自動的に親を継承しRegionManager

ます。通常、これはRegionManager

シェルに登録されているアプリケーション全体に共通です。アプリケーションがこのタイプの複数の表現を作成する場合、それぞれは同じ表現を使用してRegionManager

その領域を登録します。リージョンのマネージャーはリージョンの一意の名前のみを許可するため、ビューでのリージョンの2回目の登録は例外をスローします。

これを防ぐために、範囲が制限された領域を使用できます。この場合、各代表は独自の地域マネージャーを持ち、その地域は親ではなくこの特定のマネージャーを使用して登録されます。このアプローチを次の図に示します。

親および可視性が制限されたリージョンマネージャー

リージョンマネージャーのローカルマネージャーを作成するには、RegionManager

以下に示すように、リージョンにリージョンを追加するときに新しいマネージャーを作成するように指定する必要があります。

 IRegion detailsRegion = this.regionManager.Regions["DetailsRegion"]; View view = new View(); bool createRegionManagerScope = true; IRegionManager detailsRegionManager = detailsRegion.Add(view, null, createRegionManagerScope);

Addメソッドは、新しいリージョンマネージャーを返します。このリージョンマネージャーを使用して、ローカルスコープからリージョンに以降アクセスするためにビューを保存できます。

ビューを作成する

アプリケーションの外観は、ユーザーコントロール、特別なコントロール、データテンプレートなどのさまざまな要素から作成できます。Stock Trader RIの場合、ユーザーコントロールは通常、メインウィンドウの異なる領域を表すために使用されますが、これは標準ではありません。アプリケーションでは、最も馴染みのある、デザイナーにとって最適なアプローチを適用する必要があります。アプリケーションの外観に関係なく、ほとんどの場合、ユーザーコントロール、特別なコントロール、およびデータテンプレートを組み合わせて使用します。次の図は、株式トレーダーRIがアプローチを使用する場所を示しています。また、各アプローチを説明する後続のセクションで参照されます。

, Stock Trader RI

ユーザーコントロール

Expression BlendとVisual Studio 2010-2012は、これらのコントロールを作成するための豊富なサポートを提供します。これらのツールを使用して作成されたユーザーコントロールは、Prismを使用する場合のユーザーインターフェイスの作成に推奨されます。前述のように、Stock Trader RIはそれらを広範囲に使用して地域コンテンツを作成します。WatchListView.xamlユーザーコントロールは、ユーザーインターフェイスの小さな部分をWatchModuleモジュール内に配置する方法の良い例です。これらのコントロールは、作成と使用が非常に簡単で簡単です。

特別なコントロール（カスタムコントロール）

状況によっては、ユーザーコントロールが制限されすぎる場合があります。これらの場合、カスタムマークアップ、つまり拡張性は、作成の容易さよりも重要な場合があります。このような場合、特別なコントロールが役立つ場合があります。ストックトレーダーRI、この良い例は、円形パターンの制御です。このタイプのコントロールは、カスタムコントロールよりも作成が難しく、カスタムコントロールと比較して、Expression BlendおよびVisual Studio 2010-2012での作成のサポートが制限されています。

テンプレートデータ（データテンプレート）

データテンプレートは、ほとんどの種類のデータアプリケーションの重要な部分です。リストベースのコントロールでのデータテンプレートの使用は、特にStock Trader RIで一般的です。多くの場合、データテンプレートを使用すると、カスタムコントロールをまったく作成せずに実行できます。領域ResearchRegion

はデータテンプレートを使用して記事を表示し、のスタイルとともにItems

、どのアイテムが強調表示されているかを示します。

Expression Blendは、データテンプレートの視覚的な作成を完全にサポートしています。 Visual Studio 2010は、XAMLを介してのみ編集データテンプレートを提供します。 Visual Studio 2012では、ビジュアルエディターはExpression Blendから取得されるため、Expression Blend自体とほぼ同じデータテンプレートのサポートが提供されます。

資源（リソース）

スタイル、リソースディクショナリ、パターンなどのリソースは、アプリケーション全体に分散できます。これは、特に複合アプリケーションに当てはまります。リソースを配置する場所について考えるときは、UI要素とそれらが必要とするリソースの間の依存関係に特に注意を払ってください。下の図に示す株式トレーダーRIプロジェクトには、リソースがどこに住むことができるかを示すラベルが含まれています。

アプリケーションレベルのリソース

通常、アプリケーションレベルのリソースは、アプリケーション全体で使用されます。これらのリソースは通常、アプリケーションのルートディレクトリに焦点を当てていますが、モジュールとコントロールのタイプに基づいてデフォルトのスタイルを提供することもできます。例はTextBox

、アプリケーションのルートのタイプに適用されるテキストフィールドのスタイルです。このスタイルは、モジュールまたはコントロール自体で再定義されていない場合、アプリケーションのすべてのテキストフィールドに適用されます。

モジュールレベルのリソース

モジュールレベルのリソースの役割は、モジュール内のすべての要素に適用されるという点で、アプリケーションレベルのリソースに似ています。このレベルでリソースを使用すると、単一のモジュールの一貫したビューを提供できるだけでなく、モジュール内の個々の要素を再利用できます。モジュールレベルのリソースの使用は、このモジュール内で制限する必要があります。モジュール間に依存関係を作成すると、ユーザー要素の表示で検出が困難なエラーが発生する可能性があります。

制御レベルのリソース

このタイプのリソースは通常、ユーザー要素のライブラリに含まれており、リソースは含まれるすべての要素によって使用されます。ユーザー要素ライブラリには特定の要素のみが含まれ、ユーザーコントロールは含まれないため、これらのリソースのスコープは通常最小です。（Prismアプリケーションでは、ユーザーコントロールは通常、使用されるモジュールに配置されます。）

Prism開発者ガイド-パート7、ユーザーインターフェイスの作成