DataContextをuserControlに設定する

Question

私は 'MasterPage'としてMainWindowを作成しました。このウィンドウ内では、UserControlsである他のビューに切り替える必要があります。 MainWindowのDataContextであるMainViewModelの中で私はObservableCollectionを私の 'pages'として作成しました。ここでは、ビューの変更の私のXAMLです：

<UserControl Grid.Row="1" Content="{Binding CurrentView.Content}"/> 

表示変更は、期待通りに機能していますが、CurrentViewはまだ私は例として、特定のユーザーコントロール内のDataContextに設定してもMainWindow`sのDataContextがあります

あなたが使用することができます

<UserControl.DataContext> 
     <viewModels:DesignerViewModel/> 
</UserControl.DataContext> 

Answer 1

この問題のためのプリズムの枠組み。ユーザーコントロール間でコンテンツコントロールを簡単に操作できます。

https://github.com/PrismLibrary/Prism-Samples-Wpf

Answer 2

私は、XAML下記参照のUserControlを切り替えるためには、TabControlを使用：あなたは私はいくつかのテキストや画像は、のTabItemのaswellに含まれて、私はちょうどあなたが気づくしたいしている見ることができるように

<TabControl Grid.Row="1" Margin="5" Name="tabControl" SelectionChanged="tabControl_SelectionChanged"> 
     <TabItem IsSelected="True" FontSize="20"> 
      <TabItem.Header> 
       <StackPanel Orientation="Horizontal"> 
        <Image Source="/Images/basket.png" Width="20" Height="20" Margin="0,0,5,0"/> 
        <TextBlock Text="Orders" VerticalAlignment="Center" /> 
       </StackPanel> 
      </TabItem.Header> 
      <UserControl Name="ucOrder" /> 
     </TabItem> 
     <TabItem IsSelected="True" FontSize="20"> 
      <TabItem.Header> 
       <StackPanel Orientation="Horizontal"> 
        <Image Source="/Images/report.png" Width="20" Height="20" Margin="0,0,5,0"/> 
        <TextBlock Text="Order Reports" VerticalAlignment="Center" /> 
       </StackPanel> 
      </TabItem.Header> 
      <UserControl Name="ucReports" /> 
     </TabItem>     
</TabControl> 

それぞれのユーザーコントロール。

あなたはこのように、ユーザーコントロールを作成する必要があります。

<UserControl x:Class="Order.ucOrderOversigt" 
      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" 
      mc:Ignorable="d" 
      d:DesignHeight="300" d:DesignWidth="600" Loaded="UserControl_Loaded" Unloaded="UserControl_Unloaded"> 
    <UserControl.Resources> 
     <!-- Resources --> 
    </UserControl.Resources> 
    <Grid > 
     <!-- GUI--> 
    </Grid> 
</UserControl> 

そして次は.csコード：

namespace WPFBestilling.Order 
{ 
    public partial class ucOrderOversigt: UserControl 
    { 

     public ucOrderOversigt() 
     { 
      //constructor 
     } 

     private void UserControl_Loaded(object sender, RoutedEventArgs e) 
     { 
      //Loaded 
     } 

     private void UserControl_Unloaded(object sender, RoutedEventArgs e) 
     { 
      //Unloaded 
     } 
    } 
} 

そして、最後にメインウィンドウにタブを切り替えるために、あなたには、いくつかを必要とします.csコードを実行します。このように：

public partial class MainWindow : Window 
    { 
     public MainWindow() 
     { 
      InitializeComponent(); 
     } 

     private void Window_Loaded(object sender, RoutedEventArgs e) 
     { 
      ucOrder.Content = new ucOrderOversigt();    
      ucReports.Content = new ucReportOversigt();    
     } 

     private void tabControl_SelectionChanged(object sender, SelectionChangedEventArgs e) 
     { 
      //if something needs to happend when you shift between tabs 
     } 

     private void Window_Closing(object sender, CancelEventArgs e) 
     { 
      //Window closing 
     } 
    } 

私は質問があればちょうど撮影:)

Answer 3

をあなたはビューモデルのインスタンスにCurrentViewプロパティを設定して表示し、マッピングするためにContentControlを使用する必要があり、それが役に立てば幸いビューモデル、例えば持つビュー：

<ContentControl Content="{Binding Binding CurrentView}"> 
    <ContentControl.Resources> 
     <DataTemplate DataType="local:DesignerViewModel"> 
      <local:DesignerUserControl /> 
     </DataTemplate> 
     <DataTemplate DataType="local:TypeBViewModel"> 
      <local:TypeBUserControl /> 
     </DataTemplate> 
    </ContentControl.Resources> 
</ContentControl> 

はCurrentViewの種類は、いずれかの共通のベースのすべてのビューモデルのタイプやobjectでなければなりません。

あなたはその後、上記のようにDataTemplateビューあたりのモデルタイプを定義し、UserControlsからこれを削除します。

​​