1

我对 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 需要是什么类型或它需要在文件后面的代码?

4

1 回答 1

1

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

主窗口视图模型

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

于 2012-09-24T20:44:37.093 回答