Question

我不是WPF或C＃的新手，但我是MVVM和ViewModel情况的新手。

我一直在浏览MVVM和绑定基础知识，但我仍然需要完成被xaml细节绊倒了。

我的最终目标是创建一个空白的MainWindow.xaml视图，其中包含两个UserControl.xaml视图之一。

我有2个简单的UserControl视图：MainView.xaml和OptionalView.xaml。

<UserControl x:Class="TestViewSwap.MainView"
         ...>
<Grid>
    <TextBlock Text="Main View" />
</Grid>

<UserControl x:Class="TestViewSwap.OptionalView"
         ...>
<Grid>
    <TextBlock Text="Optional View" />
</Grid>

和MainWindow.xaml

<Window x:Class="TestViewSwap.MainWindow"
    xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
    xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
    Title="MainWindow" Height="350" Width="525">

    <ContentControl Content="{Binding CurrentView}" />
</Window>

我知道CurrentView需要在后面的代码中设置为OptionalView或MainView 取决于我选择的任何东西，但我还不知道的是......什么类型的CurrentView 需要是什么，或者它需要在文件背后的代码？

Answer 1

CurrentView应该是MainWindowViewModel的属性，或者是Window.xaml上的Datacontext的任何类。对于每个视图，您可以定义数据模板。数据模板可以包含视图或指向用户控件。将CurrentView分配给视图模型以切换视图。这是一些代码：

<强> MainWindowViewModel

public class MainWindowViewModel : ViewModel
{
  object currentView;

  public MainWindowViewModel()
  {
    CurrentView = new OptionalView();
    SwitchViewCommand = new RelayCommand(SwitchView);
  }

  public object CurrentView
  {
    get { return this.currentView; }
    set 
    { 
      this.currentView = value;
      NotifyPropertyChanged("CurrentView");
    }
  }

  public RelayCommand SwitchViewCommand { get; set; }

  void SwitchView()
  {
    if (CurrentView is OptionalView)
      CurrentView = new SettingsView();
    else
      CurrentView = new OptionalView();
  }
}

public class OptionalView { }

public partial class SettingsView { }

<强>主窗口

<Window x:Class="WpfLab.Views.MainWindow"
    xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
    xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
    xmlns:views="clr-namespace:WpfLab.Views"
    xmlns:vm="clr-namespace:WpfLab.ViewModels"
    Title="MainWindow"
    Width="525"
    Height="350">
<Window.Resources>
    <DataTemplate DataType="{x:Type vm:OptionalView}">
        <Border Background="Red" />
    </DataTemplate>

    <DataTemplate DataType="{x:Type vm:SettingsView}">
        <views:SettingsView />
    </DataTemplate>
</Window.Resources>
<Grid>
    <Grid.RowDefinitions>
        <RowDefinition Height="*" />
        <RowDefinition Height="Auto" />
    </Grid.RowDefinitions>
    <ContentControl Content="{Binding CurrentView}" />
    <Button Grid.Row="1"
            Command="{Binding SwitchViewCommand}"
            Content="SwitchView" />
</Grid>

设置视图

<UserControl x:Class="WpfLab.Views.SettingsView"
         xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
         xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
         xmlns:d="http://schemas.microsoft.com/expression/blend/2008"
         xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006"
         d:DesignHeight="300"
         d:DesignWidth="300"
         mc:Ignorable="d">
<Border Background="Green" />

如何使用局部变量用两个UserControl之一填充MainWindow

1 个答案: