びおりんのブログ

きままにアプリのできるまでを公開していきます

.NETCore用Prismテンプレートの構成確認(2)

久々に更新

.NETCore用Prismテンプレートである
Prism Full App(.NET Core)プロジェクトテンプレートの構成を
前回の記事で大雑把に捉えました

今回から構成を細かくひも解いてコードと動作の関連を見ていきます

第1回は、.NETCore用PrismテンプレートにおいてMainWindow.xaml
パーツとして同一モジュールのViewを表示する機能を一から実装します

具体的には、prismを使ったWPFではRegionという機能を使って
文字列を合言葉にして自前のViewやButtonといったコントロール
呼び出して生成し、画面に表示させます

下準備

.NETCore用Prismテンプレートのうち中身がプレーンな
Prism Blank App.(.NET Core)プロジェクトテンプレートを
Unityコンテナ付きで作成します
f:id:kazoojapan1985:20200628203206p:plain

MainWindow.xamlには既にパーツを表示するためのスペースが
ContentControlに"ContentRegion"という名前で作成されています

<Window x:Class="BlankCoreApp1.Views.MainWindow"
        xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
        xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
        xmlns:prism="http://prismlibrary.com/"
        prism:ViewModelLocator.AutoWireViewModel="True"
        Title="{Binding Title}" Height="350" Width="525" >
    <Grid>
        <ContentControl prism:RegionManager.RegionName="ContentRegion" />
    </Grid>
</Window>

次に上記スペースに表示させるためのパーツとしてContentViewを作成します

ソリューションエクスプローラー -> Viewsフォルダ -> コンテキストメニュー
-> 追加 -> 新しい項目 -> ユーザーコントロール -> 名前 -> ContentView.xaml -> 追加

作成したContentView.xamlは無地なので、適当なボタンを設置して見えるようにしておきます

<UserControl x:Class="BlankCoreApp1.Views.ContentView"
             xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
             xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
             xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006" 
             xmlns:d="http://schemas.microsoft.com/expression/blend/2008" 
             xmlns:local="clr-namespace:BlankCoreApp1.Views"
             mc:Ignorable="d" 
             d:DesignHeight="450" d:DesignWidth="800">
    <Grid>
        <Button Background="AliceBlue" Width="50" Height="50" FontSize="30" Content="1"/>
    </Grid>
</UserControl>

ContentRegion文字列からContentViewを呼び出す

これからContentRegionという文字列を合言葉としてContentViewを
RegionManagerという機能を利用して呼び出します

RegionManagerを利用するためには下記が必要です
1. コンテナに呼び出したいコントロールが登録されている
2. 合言葉用文字列とコントロールが紐づけされている

コンテナに呼び出したいコントロールを登録する

App.xaml.csにて、RegisterTypesメソッドに下記を追記します

   /// <summary>
    /// Interaction logic for App.xaml
    /// </summary>
    public partial class App
    {
        protected override Window CreateShell()
        {
            return Container.Resolve<MainWindow>();
        }

        protected override void RegisterTypes(IContainerRegistry containerRegistry)
        {
            containerRegistry.RegisterForNavigation<ContentView>();
        }
    }

文字列とコントロールを紐づけする

呼び出し元のMainWindow.xamlと呼び出し先のContentView.xamlが同一プロジェクトに存在する場合
呼び出し元に対応するMainWIndowModel.csにて、コンストラクタ引数にIRegionManagerを設定し
"ContentRegion"文字列とContentViewコントロールを紐づけます

   public class MainWindowViewModel : BindableBase
    {
        private string _title = "Prism Application";
        public string Title
        {
            get { return _title; }
            set { SetProperty(ref _title, value); }
        }

        public MainWindowViewModel(IRegionManager regionManager)
        {
            regionManager.RegisterViewWithRegion("ContentRegion", typeof(ContentView));
        }
    }

実行結果

起動すると下記手順でMainWindow.xaml上にContentView.xaml(数字付きボタン)が表示されます
1. App.RegisterTypesメソッドにて、コンテナにContentView型が登録される
2. App. CreateShellメソッドにて、MainWindowが生成される
3. MainWIndow.InitializeComponentメソッドが実行される
4. MainWIndow.xamlの下記記述を元にMainWindowModelが生成される
「prism:ViewModelLocator.AutoWireViewModel="True" 」
5. MainWindowModelのコンストラクタで"ContentRegion"とContentView型が紐づけられる
6. MainWindow.DataContextにMainWindowModelが代入される
7. MainWindow.xamlのContentControlにて"ContentRegion"で検索されたContentViewが生成される
8. 画面に数字の1が表示される

f:id:kazoojapan1985:20200705174151p:plain