Question

我有一个GridSplitter，它是可拖动的，并且两列都相应地调整大小。我有一个可以隐藏右列的按钮，但我希望再次按下该按钮以再次显示右列，并且仍然可以拖动。

我尝试使用ToggleButton，但是GridSpiltter已使用它固定并且不可拖动。

我如何有一个按钮来显示/隐藏列，并且仍然可以由用户调整？

GridSplitter：

      <GridSplitter x:Name="rightSplitter"
      Grid.Column="1"
      Width="15"
      HorizontalAlignment="Left"
      VerticalAlignment="Stretch"
      Background="Transparent"
      ShowsPreview="True" />

列定义：

<Grid.ColumnDefinitions>
    <ColumnDefinition Width="*" />
    <ColumnDefinition Width="300" x:Name="rightColumn"/>
  </Grid.ColumnDefinitions>
  <Grid.RowDefinitions>
    <RowDefinition Height="*" />
    <RowDefinition Height="Auto" />
  </Grid.RowDefinitions>

按钮：

<Button Width="50" Height="50" HorizontalAlignment="Right" x:Name="Details_Toggle" Focusable="False">
    <StackPanel>
      <Image Source="controls/details.png" />
    </StackPanel>

按钮单击C＃：

        private void deatilsShowHide(object sender, RoutedEventArgs e) { 
        rightColumn.Width = new GridLength(0);
        rightSplitter.Visibility = System.Windows.Visibility.Collapsed;
    }

Answer 1

由于您折叠的是正确的项目，因此该控件将不会出现在面板中。而不是显示Collapsed。当单击按钮时，我们可以将宽度设置为10，再次单击时，我们可以将其恢复为原始宽度。同时，我们也可以拖动GridSplitter。

 private void deatilsShowHide(object sender, RoutedEventArgs e) 
 { 
     if(rightColumn.Width == new GridLength(10))
        {
            rightColumn.Width = new GridLength(300);
        }
        else
        {
            rightColumn.Width = new GridLength(10);
        }
}

Xaml：-

    <Grid>
    <Grid.ColumnDefinitions>
        <ColumnDefinition Width="*"  />
        <ColumnDefinition Width="5" />
        <ColumnDefinition Width="300" x:Name="rightColumn"/>
    </Grid.ColumnDefinitions>
    <Grid.RowDefinitions>
        <RowDefinition Height="*" />
        <RowDefinition Height="Auto" />
    </Grid.RowDefinitions>

    <StackPanel Grid.Column="0" Background="AliceBlue">
    <Button Width="50" Height="50" HorizontalAlignment="Right" x:Name="Details_Toggle" Focusable="False" Click="Details_Toggle_Click">
        <StackPanel>

        </StackPanel>
    </Button>
    </StackPanel>

    <GridSplitter x:Name="rightSplitter"

  Width="15" Grid.Column="1"
  HorizontalAlignment="Stretch"
  VerticalAlignment="Stretch"
  Background="Transparent"
  ShowsPreview="True" />

    <StackPanel Grid.Column="2"   VerticalAlignment="Center" HorizontalAlignment="Center" >
        <Button Content="test" Grid.Column="2" HorizontalAlignment="Left"  VerticalAlignment="Top" Width="75"/>

    </StackPanel>


</Grid>

WPF C＃GridSpittler和“显示/隐藏”按钮

1 个答案: