Question

我创建了MainWindow作为＆＃39; MasterPage＆＃39;在这个窗口里面，我想在其他视图之间切换，这些视图是UserControls。在MainViewModel中，它是MainWindow的DataContext，我创建了ObservableCollection作为我的＆＃39;页面＆＃39;。这是我的XAML视图更改：

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

视图更改正在按预期工作，但即使我在特定UserControl中设置DataContext作为示例，CurrentView仍然具有MainWindow的DataContext：

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

Answer 1

您可以将Prism框架用于此问题。他可以轻松地在您的用户控件之间导航您的内容控件。

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

Answer 2

我使用TabControl在UserControls之间切换，见下面的XAML：

<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>

正如您所看到的，我在tabitem中也包含了一些文本和图像，我只是希望您注意到每个文本和图像中的Usercontrol。

您需要创建一个UserControl，如下所示：

<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

您应该将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，并将其从<UserControl.DataContext> <viewModels:DesignerViewModel/> </UserControl.DataContext>中删除：

dict

将DataContext设置为userControl

3 个答案: