帶分離器的伸展面板

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。