1 新建wpf应用
2 新建Base,Views,ViewModels,Models文件夹
3 在Base下面新建CommandBase类
using System;
using System.Collections.Generic;
using System.Text;
using System.Windows.Input;
namespace WpfApp4.Base
{
public class CommandBase : ICommand
{
public event EventHandler CanExecuteChanged;
public bool CanExecute(object parameter)
{
return true;
}
public void Execute(object parameter)
{
DoExecute?.Invoke(parameter);
}
public Action<object> DoExecute { get; set; }
}
}
4 在Views里面新建Page1,Page2 UserControl
<UserControl x:Class="WpfApp4.Views.Page1"
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:WpfApp4.Views"
mc:Ignorable="d"
d:DesignHeight="450" d:DesignWidth="800">
<Grid>
<TextBlock Text="Page 1" />
</Grid>
</UserControl>
<UserControl x:Class="WpfApp4.Views.Page2"
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:WpfApp4.Views"
mc:Ignorable="d"
d:DesignHeight="450" d:DesignWidth="800">
<Grid>
<TextBlock Text="Page 2" />
</Grid>
</UserControl>
5 在Models里面新建MainModel数据模型
using System;
using System.Collections.Generic;
using System.ComponentModel;
using System.Text;
using System.Windows;
namespace WpfApp4.Models
{
public class MainModel : INotifyPropertyChanged
{
public event PropertyChangedEventHandler PropertyChanged;
private UIElement _Content;
public UIElement Content
{
get { return _Content; }
set {
_Content = value;
PropertyChanged?.Invoke(this, new PropertyChangedEventArgs(nameof(Content)));
}
}
}
}
6 在ViewModels里面新建MainViewModel类
using System;
using System.Collections.Generic;
using System.Text;
using WpfApp4.Base;
using WpfApp4.Models;
namespace WpfApp4.ViewModels
{
public class MainViewModel
{
public MainModel MainModel { get; set; } = new MainModel();
public CommandBase OpenCommand
{
get
{
return new CommandBase()
{
DoExecute = new Action<object>((obj) =>
{
Type type = this.GetType().Assembly.GetType("WpfApp4.Views." + obj.ToString());
MainModel.Content = (System.Windows.UIElement)Activator.CreateInstance(type);
})
};
}
}
public MainViewModel()
{
}
}
}
7 修改MainWindow
<Window x:Class="WpfApp4.MainWindow"
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"
xmlns:local="clr-namespace:WpfApp4"
mc:Ignorable="d"
Title="MainWindow" Height="450" Width="800">
<Grid>
<Grid.ColumnDefinitions>
<ColumnDefinition Width="200"/>
<ColumnDefinition />
</Grid.ColumnDefinitions>
<StackPanel>
<Button Content="Page1" Command="{Binding OpenCommand}" CommandParameter="Page1" />
<Button Content="Page2" Command="{Binding OpenCommand}" CommandParameter="Page2" />
</StackPanel>
<ContentControl Grid.Column="1" Content="{Binding MainModel.Content}" />
</Grid>
</Window>
using System;
using System.Collections.Generic;
using System.Linq;
using System.Text;
using System.Threading.Tasks;
using System.Windows;
using System.Windows.Controls;
using System.Windows.Data;
using System.Windows.Documents;
using System.Windows.Input;
using System.Windows.Media;
using System.Windows.Media.Imaging;
using System.Windows.Navigation;
using System.Windows.Shapes;
using WpfApp4.ViewModels;
namespace WpfApp4
{
/// <summary>
/// Interaction logic for MainWindow.xaml
/// </summary>
public partial class MainWindow : Window
{
public MainWindow()
{
InitializeComponent();
this.DataContext = new MainViewModel();
}
}
}
8 此时通过主界面的按钮可以切换Page1 ,Page2
9 考虑添加实时监控功能,那就要在MainViewModel里面开启监控线程,如何将监控到的数据,显示到Page1和Page2呢?
10 在Models里面添加数据模型DataModel
using System;
using System.Collections.Generic;
using System.ComponentModel;
using System.Text;
namespace WpfApp4.Models
{
public class DataModel : INotifyPropertyChanged
{
public event PropertyChangedEventHandler PropertyChanged;
private int _Value1;
public int Value1
{
get { return _Value1; }
set { _Value1 = value; PropertyChanged?.Invoke(this, new PropertyChangedEventArgs("Value1")); }
}
private int _Value2;
public int Value2
{
get { return _Value2; }
set { _Value2 = value; PropertyChanged?.Invoke(this, new PropertyChangedEventArgs("Value2")); }
}
}
}
11 在MainViewModel的构造函数中假如开启监控线程,并获得监控数据
using System;
using System.Collections.Generic;
using System.Text;
using WpfApp4.Base;
using WpfApp4.Models;
namespace WpfApp4.ViewModels
{
public class MainViewModel
{
public MainModel MainModel { get; set; } = new MainModel();
public DataModel DataModel { get; set; } = new DataModel();
public CommandBase OpenCommand
{
get
{
return new CommandBase()
{
DoExecute = new Action<object>((obj) =>
{
Type type = this.GetType().Assembly.GetType("WpfApp4.Views." + obj.ToString());
MainModel.Content = (System.Windows.UIElement)Activator.CreateInstance(type);
})
};
}
}
public MainViewModel()
{
//获取实时监控数据
DataModel.Value1 = 123;
DataModel.Value2 = 456;
}
}
}
12 修改Page1,Page2上的数据绑定,通过相对资源来查找MainViewModel里的数据,这里即使Page1,Page2有指定的自己的ViewModel也是可以的
<UserControl x:Class="WpfApp4.Views.Page1"
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:WpfApp4.Views"
mc:Ignorable="d"
d:DesignHeight="450" d:DesignWidth="800">
<Grid>
<TextBlock Text="{Binding DataContext.DataModel.Value1, RelativeSource={RelativeSource AncestorType=Window}}" />
</Grid>
</UserControl>
<UserControl x:Class="WpfApp4.Views.Page2"
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:WpfApp4.Views"
mc:Ignorable="d"
d:DesignHeight="450" d:DesignWidth="800">
<Grid>
<TextBlock Text="{Binding DataContext.DataModel.Value2, RelativeSource={RelativeSource AncestorType=Window}}" />
</Grid>
</UserControl>