如何切换WPF Grid Grid列的可见性

Question

我在处理WPF应用程序时遇到了一些麻烦。基本上，我所追求的是像MMC中的任务窗格：

• 该应用程序在显示的主要部分有三列。我需要一个可调整大小的右侧栏。我认为这意味着使用一个GridSplitter的网格，但任何工作将做。
• 我希望能够在应用程序关闭时保存右侧列的宽度，并在打开应用程序时加载它，但这应该是初始大小：用户应该可以调整它的大小。
• 当我调整窗口的大小时，我希望左侧和右侧的列保持相同的大小，中间的列使用窗口宽度调整大小。
• 左侧和右侧列需要有最小宽度。当我调整右侧列的大小时，我希望中央列变小，而不是左侧列。
• 我还希望能够切换右侧列的可视性，并且在列外部的切换按钮以及当它返回到可见性时，我希望它与之前的宽度相同。

我正在尝试尽可能地在XAML中进行绑定。

我可以用奶油，冰淇淋和巧克力蛋糕配上它吗？ :-)

Answer 1

当我阅读你的要求，而不是想到Grid，我想到了DockPanel。

<DockPanel> 
    <Grid Name="right" 
     DockPanel.Dock="Right" MinWidth="100" /> 
    <Grid Name="Left" 
     DockPanel.Dock="Left" MinWidth="100" /> 
    <Grid Name="middle" /> 
</DockPanel> 

如果你犯了一个办法来调整right，然后middle会right调整大小而改变。如果调整窗口大小，只有middle会发生变化。存储和设置right的Width取决于您，但不应该很难。

至于允许用户调整right，这将有点棘手，但我发现this article应该有所帮助。 可能会帮助更多。

对于right知名度，你可以设置其Visibility到Collapsed来隐藏它，将其设置为Visible恢复。

注意：里面的面板不一定是Grid s，但是您会希望对每个面板使用某种Panel。无论你在目前的Grid列中有什么内容，都可以正常工作。

Answer 2

将列定义宽度设置为自动并将控件放在该列内，并为其他列指定Star。无论何时想要隐藏包含内容的列，请设置control.Visibility = Collapsed，并且由于列宽为Auto，因此您不会看到该列，其余列将占用该空间。

Answer 3

我在GridSplitters中使用了Grid，因为这样可以很容易地调整中间列的大小，同时保持左列和右列的宽度。

XAML：

<Window 
    xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation" 
    xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml" 
    x:Class="MainWindow" 
    Title="Main Window" 
    Width="640" Height="480"> 

    <Grid> 
     <Grid.ColumnDefinitions> 
      <!-- Left column --> 
       <ColumnDefinition Width="200" MinWidth="100"/> 
       <!-- Left GridSplitter column --> 
       <ColumnDefinition Width="5"/> 
       <!-- Center column. A width of * means the column will fill 
        any remaining space. --> 
       <ColumnDefinition Width="*"/> 
       <!-- Right GridSplitter column --> 
       <ColumnDefinition x:Name="RightSplitterColumn" Width="5"/> 
       <!-- Right column --> 
       <ColumnDefinition x:Name="RightColumn" Width="200" 
            MinWidth="100"/> 
       </Grid.ColumnDefinitions> 
       <GridSplitter Grid.Column="1" HorizontalAlignment="Stretch" /> 
       <GridSplitter Grid.Column="3" HorizontalAlignment="Stretch" /> 
       <Button x:Name="ToggleButton" Grid.Column="2" 
         Content="Toggle Right Column" Width="150" Height="25" 
         Click="ToggleButton_Click" /> 
    </Grid> 
</Window> 

代码隐藏

下隐藏右列中，我只设置列宽为0，因为格列不具有可见性属性。

public partial class MainWindow : Window 
{ 
    private double rightColumnWidth; 
    private double rightColumnMinWidth; 
    private bool rightColumnHidden; 

    public MainWindow() 
    { 
     this.InitializeComponent(); 
    } 

    private void ToggleButton_Click(object sender, RoutedEventArgs e) 
    { 
     if (rightColumnHidden) 
     { 
      // Restore the widths. 
      RightColumn.MinWidth = rightColumnMinWidth; 
      RightColumn.Width = new GridLength(rightColumnWidth); 
      RightSplitterColumn.Width = new GridLength(5); 
     } 
     else 
     { 
      // Remember the user-set widths for the columns. 
      rightColumnWidth = RightColumn.Width.Value; 
      rightColumnMinWidth = RightColumn.MinWidth; 

      // Remember to set the minimum width to 0 before changing the actual 
      // width. 
      RightColumn.MinWidth = 0; 
      RightColumn.Width = new GridLength(0); 
      RightSplitterColumn.Width = new GridLength(0); 
     } 

     rightColumnHidden = !rightColumnHidden; 
    } 
} 

至于保存并在启动时恢复列宽，我只想保存宽度变量设置文件，然后再应用时，你的应用程序被重新打开。

Answer 4

3年后，您可以在CodeProject上找到另一种方法。

http://www.codeproject.com/Articles/437237/WPF-Grid-Column-and-Row-Hiding

它增加了一个 “可见” 属性设置为自定义栏定义。