WPF框架手敲实现嵌套页面，点击显示与切换
下面附上成果图吧，看了之后觉得适用就可以参考一下，否则就不要浪费时间了
操作时间
1.此篇作为学习记录，是一个WPF框架window嵌套用户控件的使用。点击按钮切换显示嵌套的内容
1.1首先创建MainView.xaml
CommandParameter="MovieView"注：MovieView根据自己View的名称
<Window.Resources><ResourceDictionary><ResourceDictionary.MergedDictionaries><ResourceDictionary><!--RadioButton样式--><Style TargetType="RadioButton" x:Key="NavButtonStyle"><Setter Property="Foreground" Value="White"/><Setter Property="Template"><Setter.Value><ControlTemplate TargetType="RadioButton"><Border Background="Transparent" CornerRadius="2" Name="back"><ContentControl Content="{TemplateBinding Content}" VerticalAlignment="Center" HorizontalAlignment="Center" Margin="10,5" FontSize="12"/></Border><!--Triggers按钮样式--><ControlTemplate.Triggers><Trigger Property="IsChecked" Value="True"><Setter TargetName="back" Property="Background" Value="#44FFFFFF"/></Trigger></ControlTemplate.Triggers></ControlTemplate></Setter.Value></Setter></Style></ResourceDictionary></ResourceDictionary.MergedDictionaries></ResourceDictionary></Window.Resources><!--Background--><Window.Background><LinearGradientBrush EndPoint="0.5,1" StartPoint="0.5,0"><GradientStop Color="Black" Offset="0"/><GradientStop Color="#FF164472" Offset="1"/></LinearGradientBrush></Window.Background><Border Margin="5" CornerRadius="5" x:Name="layout"><Border.Effect><DropShadowEffect Color="Gray" ShadowDepth="0" BlurRadius="5" Opacity="0.3" Direction="0"/></Border.Effect><Grid><!--Top样式--><Border Background="#FF103C87" Height="50" VerticalAlignment="Top" CornerRadius="5,5,0,0"/><Grid Margin="5,5"><!--NavigationHeight--><Grid.RowDefinitions><RowDefinition Height="50"/><RowDefinition Height="390"/><RowDefinition Height="50"/></Grid.RowDefinitions><!--left--><StackPanel Orientation="Horizontal" Grid.Row="0" HorizontalAlignment="Left" VerticalAlignment="Center"><RadioButton Style="{StaticResource NavButtonStyle}" IsChecked="True" Command="{Binding NavChangedCommand}" CommandParameter="MovieView"><WrapPanel><TextBlock Text="" FontFamily="/common/Resources/#iconfont" VerticalAlignment="Center" HorizontalAlignment="Center" FontSize="15" Margin="0,0,1,3"/><TextBlock Text="医疗服务" Margin="0,0,3,3" FontSize="15"/></WrapPanel></RadioButton><RadioButton Style="{StaticResource NavButtonStyle}" Command="{Binding NavChangedCommand}" CommandParameter="HealthEducationView"><WrapPanel><TextBlock Text="" FontFamily="/common/Resources/#iconfont" VerticalAlignment="Center" HorizontalAlignment="Center" FontSize="15" Margin="0,0,3,3"/><TextBlock Text="健康宣教" Margin="0,0,3,3" FontSize="15"/></WrapPanel></RadioButton><RadioButton Style="{StaticResource NavButtonStyle}" Command="{Binding NavChangedCommand}" CommandParameter="MedicalView"><WrapPanel><TextBlock Text="" FontFamily="/common/Resources/#iconfont" VerticalAlignment="Center" HorizontalAlignment="Center" FontSize="15" Margin="0,0,3,3"/><TextBlock Text="影音视听" Margin="0,0,3,3" FontSize="15"/></WrapPanel></RadioButton><RadioButton Style="{StaticResource NavButtonStyle}" Command="{Binding NavChangedCommand}" CommandParameter="LifeServiceView"><WrapPanel><TextBlock Text="" FontFamily="/common/Resources/#iconfont" VerticalAlignment="Center" HorizontalAlignment="Center" FontSize="15" Margin="0,0,3,3"/><TextBlock Text="生活服务" Margin="0,0,3,3" FontSize="15"/></WrapPanel></RadioButton><RadioButton Style="{StaticResource NavButtonStyle}" Command="{Binding NavChangedCommand}" CommandParameter="HealthView"><WrapPanel><TextBlock Text="" FontFamily="/common/Resources/#iconfont" VerticalAlignment="Center" HorizontalAlignment="Center" FontSize="15" Margin="0,0,3,3"/><TextBlock Text="健康专区" Margin="0,0,3,3" FontSize="15"/></WrapPanel></RadioButton></StackPanel><!--Right--><StackPanel Orientation="Horizontal" Grid.Row="0" HorizontalAlignment="Right" VerticalAlignment="Center"><RadioButton Style="{StaticResource NavButtonStyle}" Command="{Binding NavChangedCommand}" CommandParameter="PersonalView"><WrapPanel><TextBlock Text="" FontFamily="/common/Resources/#iconfont" VerticalAlignment="Center" HorizontalAlignment="Center" FontSize="15" Margin="0,0,3,3"/><TextBlock Text="汤姆汤姆" Margin="0,0,3,3" FontSize="15"/></WrapPanel></RadioButton><RadioButton Style="{StaticResource NavButtonStyle}" Command="{Binding NavChangedCommand}" CommandParameter="SetView"><WrapPanel><TextBlock Text="" FontFamily="/common/Resources/#iconfont" VerticalAlignment="Center" HorizontalAlignment="Center" FontSize="15" Margin="0,0,3,3"/><TextBlock Text="深圳" Margin="0,0,3,3" FontSize="15"/></WrapPanel></RadioButton><Label Content="今日雷阵雨 23-26°" FontSize="13" Foreground="#FFFF" VerticalAlignment="Center"/><Label Content="09:30" FontSize="13" Foreground="#FFFF" VerticalAlignment="Center"/></StackPanel><!--中间嵌套层绑定--><Border VerticalAlignment="Bottom" Grid.Row="1"><ContentControl Content="{Binding MainContent}"/></Border></Grid><!--Bottom--><Border Background="Black" VerticalAlignment="Bottom" Grid.Row="2"><StackPanel Orientation="Horizontal" HorizontalAlignment="Center" VerticalAlignment="Bottom" ><DockPanel Margin="150,12"><Button BorderThickness="0" Background="Black"><TextBlock Text="" FontFamily="/common/Resources/#iconfont" VerticalAlignment="Center" HorizontalAlignment="Center" FontSize="20" Foreground="White" Background="Black"/></Button></DockPanel><DockPanel Margin="150,12"><Button BorderThickness="0" Background="Black"><TextBlock Text="" FontFamily="/common/Resources/#iconfont" VerticalAlignment="Center" HorizontalAlignment="Center" FontSize="20" Foreground="White" Background="Black"/></Button></DockPanel><DockPanel Margin="150,12"><Button BorderThickness="0" Background="Black"><TextBlock Text="" FontFamily="/common/Resources/#iconfont" VerticalAlignment="Center" HorizontalAlignment="Center" FontSize="20" Foreground="White" Background="Black"/></Button ></DockPanel></StackPanel></Border></Grid></Border>
1.2在MainView.xaml按F7去到MainView.xaml.cs页面
实例化会报错，因为没有创建，下一步创建
public MainView(){InitializeComponent();MainViewModel model = new MainViewModel();this.DataContext = model;}
1.3创建MainViewModel .cs
class MainViewModel : NotifyBase{private FrameworkElement _mainContent;public FrameworkElement MainContent{get { return _mainContent; }set { _mainContent = value; this.DoNotify(); }}public CommandBase NavChangedCommand { get; set; }public MainViewModel(){this.NavChangedCommand = new CommandBase();this.NavChangedCommand.DoExecute = new Action<object>(DoNavChanged);this.NavChangedCommand.DoCanExecute = new Func<object, bool>((o) => true);DoNavChanged("HealthEducationView");/*健康宣教*/DoNavChanged("MedicalView");/*影音视听*/DoNavChanged("LifeServiceView");/*生活服务*/DoNavChanged("HealthView");/*健康专区*/DoNavChanged("PersonalView");/*个人中心*/DoNavChanged("SetView");/*设置*/DoNavChanged("MovieView");/*医疗服务*/}private void DoNavChanged(object obj){Type type = Type.GetType("UItemplate.View." + obj.ToString());ConstructorInfo cti = type.GetConstructor(System.Type.EmptyTypes);this.MainContent = (FrameworkElement)cti.Invoke(null);}}
1.4创建NotifyBase.cs
class NotifyBase : INotifyPropertyChanged{public event PropertyChangedEventHandler PropertyChanged;public void DoNotify([CallerMemberName] string propName = ""){PropertyChanged?.Invoke(this, new PropertyChangedEventArgs(propName));}}
1.5创建CommandBase.cs
public class CommandBase : ICommand{public event EventHandler CanExecuteChanged;public bool CanExecute(object parameter){return DoCanExecute?.Invoke(parameter) == true;}public void Execute(object parameter){DoExecute?.Invoke(parameter);}public Action<object> DoExecute { get; set; }public Func<object, bool> DoCanExecute { get; set; }public void RaiseCanExecuteChanged(){CanExecuteChanged?.Invoke(this, new EventArgs());}}
