通过点击菜单项更改窗口的内容WPF

Question

我必须做一个WPF应用程序，它需要包含菜单栏。当用户点击每个菜单项时，窗口应该加载不同的内容。 请任何人提出任何想法来完成这一点。

<Window x:Class="win3.MainWindow" 
     xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation" 
     xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"   
     Title="MainWindow" Height="700" Width="600" > 
    <Grid> 

     <DockPanel> 
      <Menu DockPanel.Dock="Top"> 
       <MenuItem Header="Student" Click="StudentMenuItem_Click"/> 
       <MenuItem Header="Academic" Click="AcademicMenuItem_Click"/> 
      </Menu> 
      <TextBox AcceptsReturn="True" /> 
     </DockPanel> 
     <Grid x:Name="grdStudent" Height="500" Width="550" Margin="22,56,22,115"> 
      <Grid.ColumnDefinitions> 
       <ColumnDefinition Width="2*"/> 
       <ColumnDefinition Width="3*"/> 
      </Grid.ColumnDefinitions> 
      <Grid.RowDefinitions> 
       <RowDefinition Height="6*"/> 
       <RowDefinition Height="1*"/> 
      </Grid.RowDefinitions> 
      <Label Content="Student Id" HorizontalAlignment="Left" VerticalAlignment="Top" Margin="57,51,0,0"/> 
      <Label Content="Student Name: " HorizontalAlignment="Left" Margin="57,110,0,0" VerticalAlignment="Top" Width="84"/> 
      <TextBox Grid.Column="1" HorizontalAlignment="Left" Height="23" Margin="46,51,0,0" TextWrapping="Wrap" VerticalAlignment="Top" Width="175"/> 
      <TextBox Grid.Column="1" HorizontalAlignment="Left" Height="23" Margin="46,110,0,0" TextWrapping="Wrap" VerticalAlignment="Top" Width="175"/> 
     </Grid> 

     <Grid x:Name="grdAcademic" Height="500" Width="550" Margin="22,56,22,115" > 
      <Grid.ColumnDefinitions> 
       <ColumnDefinition Width="2*"/> 
       <ColumnDefinition Width="3*"/> 
      </Grid.ColumnDefinitions> 
      <Grid.RowDefinitions> 
       <RowDefinition Height="1*"/> 
       <RowDefinition Height="5*"/> 
      </Grid.RowDefinitions> 
      <ComboBox x:Name="cmbFloor" HorizontalAlignment="Left" VerticalAlignment="Top" Width="80" SelectionChanged="cmbFloor_SelectionChanged" Margin="130,29,0,0"/> 
      <ComboBox x:Name="cmbDoor" HorizontalAlignment="Left" Margin="130,10,0,0" VerticalAlignment="Top" Width="80" SelectionChanged="cmbDoor_SelectionChanged" Grid.Row="1"/> 
     </Grid> 
    </Grid> 
</Window > 

cs文件

private void StudentMenuItem_Click(object sender, RoutedEventArgs e) 
     { 
      this.grdStudent.Visibility = Visibility.Visible; 
      this.grdAcademic.Visibility = Visibility.Collapsed; 
     } 

     private void AcademicMenuItem_Click(object sender, RoutedEventArgs e) 
     { 
      this.grdAcademic.Visibility = Visibility.Collapsed; 
      this.grdStudent.Visibility = Visibility.Collapsed; 
     } 

上面的代码工作按expected.but .XMAL文件看起来笨拙。（稍后我们需要添加更多的控制器）

Answer 1

您可以使用DataTemplate和ContentControl。在2个用户控件中定义您的视图'grdAcademic'和'grdStudent'并为其定义DataTemplate。

<DataTemplate x:Key="grdAcademicView"> 
    <local:UserControlGrdAcademic /> 
</DataTemplate> 

<DataTemplate x:Key="grdStudentView" > 
    <local:UserControlGrdStudent /> 
</DataTemplate> 

假设，这里的“本地”是您的CLR命名空间（XMLNS：地方=“CLR的命名空间：”）

菜单按钮，点击可以显示2个变量在您的视图模型相关联说“IsStudent”和'IsAcademic'并使用它们如下：

<ContentControl Content="{Binding }"> 
    <ContentControl.Style> 
     <Style> 
      <Style.Triggers> 
       <DataTrigger Binding="{Binding Path=IsStudent}" Value="True"> 
        <Setter Property="ContentControl.ContentTemplate" Value="{StaticResource grdStudentView}" /> 
       </DataTrigger> 
       <DataTrigger Binding="{Binding Path=IsAcademic}" Value="True"> 
        <Setter Property="ContentControl.ContentTemplate" Value="{StaticResource grdAcademicView}" /> 
       </DataTrigger> 
      </Style.Triggers> 
     </Style> 
    </ContentControl.Style> 
</ContentControl> 

Answer 2

，你可以用不同的内容在单独的文件，例如：

StudentView.xaml

<UserControl 
    <!-- Standard UC code here --> 
    > 
    <Grid x:Name="grdStudent" Height="500" Width="550" Margin="22,56,22,115"> 
     <Grid.ColumnDefinitions> 
      <ColumnDefinition Width="2*"/> 
      <ColumnDefinition Width="3*"/> 
     </Grid.ColumnDefinitions> 
     <Grid.RowDefinitions> 
      <RowDefinition Height="6*"/> 
      <RowDefinition Height="1*"/> 
     </Grid.RowDefinitions> 
     <Label Content="Student Id" HorizontalAlignment="Left" VerticalAlignment="Top" Margin="57,51,0,0"/> 
     <Label Content="Student Name: " HorizontalAlignment="Left" Margin="57,110,0,0" VerticalAlignment="Top" Width="84"/> 
     <TextBox Grid.Column="1" HorizontalAlignment="Left" Height="23" Margin="46,51,0,0" TextWrapping="Wrap" VerticalAlignment="Top" Width="175"/> 
     <TextBox Grid.Column="1" HorizontalAlignment="Left" Height="23" Margin="46,110,0,0" TextWrapping="Wrap" VerticalAlignment="Top" Width="175"/> 
    </Grid> 
</UserControl> 

然后你改变你的MainWindow.xaml到

<Grid> 
    <DockPanel> 
     <!-- Put your menu code here --> 
    </DockPanel> 
    <ContentControl x:Name="content" /> 
</Grid> 

而且在后面的代码

private readonly FrameworkElement _academicView; 
private readonly FrameworkElement _studentView; 

public MainWindow() 
{ 
    InitializeComponent(); 

    _academicView = new AcademicView(); 
    _studentView = new StudentView(); 

    content.Content = _academicView; // set the default view 
} 

private void StudentMenuItem_Click(object sender, RoutedEventArgs e) 
{ 
    content.Content = _studentView; 
} 

private void AcademicMenuItem_Click(object sender, RoutedEventArgs e) 
{ 
    content.Content = _academicView; 
} 

从这个

除此之外，我建议你看看到MVVM点模式。