带分离器的伸展面板

Question

我想实现一个带有三个面板和两个分离器（水平和垂直分离器）的基本WPF布局。

左侧和底部的两个面板必须可以放大并且一个面板必须相应地拉伸。

下面是一个简单的XAML：

 <Grid> 
      <Grid.ColumnDefinitions> 
       <ColumnDefinition Width="*"/> 
       <ColumnDefinition Width="5"/> 
       <ColumnDefinition Width="*"/> 
      </Grid.ColumnDefinitions> 

      <StackPanel Background="Aqua" Grid.Column="0" Name="leftPanel" > 
       <TextBlock FontSize="35" Foreground="#58290A" TextWrapping="Wrap">Left Hand Side</TextBlock> 
      </StackPanel> 

      <GridSplitter Grid.Column="1" HorizontalAlignment="Stretch"/> 

      <Grid Grid.Column="2" HorizontalAlignment="Stretch" VerticalAlignment="Stretch"> 
       <Grid.RowDefinitions> 
        <RowDefinition Height="*" /> 
        <RowDefinition Height="5" /> 
        <RowDefinition Height="*" /> 
       </Grid.RowDefinitions> 
       <StackPanel HorizontalAlignment="Stretch" VerticalAlignment="Stretch"> 
        <Label Content="... Clien Area .. Has to Stretch vertically and horizontally" Margin="10"></Label> 
        <Button Click="LeftButton_Click" Margin="10">Close Left Panel</Button> 
        <Button Click="BottomButton_Click" Margin="10">Close Bottom Panel</Button> 
       </StackPanel> 
       <GridSplitter Grid.Row="1" Background="Gray" HorizontalAlignment="Stretch"/> 
       <ListBox Grid.Row="2" Background="Violet" Name="bottomPanel"> 
        <ListBoxItem>Hello</ListBoxItem> 
        <ListBoxItem>World</ListBoxItem> 
       </ListBox> 
      </Grid> 
     </Grid> 

和代码隐藏：？

private void LeftButton_Click(object sender, RoutedEventArgs e) 
    { 
     leftPanel.Visibility = (leftPanel.Visibility == System.Windows.Visibility.Visible)? System.Windows.Visibility.Collapsed : System.Windows.Visibility.Visible; 
    } 

    private void BottomButton_Click(object sender, RoutedEventArgs e) 
    { 
     bottomPanel.Visibility = (bottomPanel.Visibility == System.Windows.Visibility.Visible) ? System.Windows.Visibility.Collapsed : System.Windows.Visibility.Visible; 
    } 

预期:(任何WPF专家围绕提出一个解决方案，其客户端此代码不能正常工作面积（拉伸）和分配器在同一时间？

DockPanel将完美的工作，但我需要分离器！

谢谢。

Answer 1

对于要折叠的列，您需要将包含折叠面板的ColumnDefintion的Width更改为Auto。