如何切换WPF网格列可见性

Question

我正在努力让这个在我正在研究的WPF应用程序中工作.基本上,我所追求的是像MMC中的任务窗格:

• 该应用程序在显示屏的主要部分有三列.我需要右侧的一个可调整大小的列.我认为这意味着使用带有GridSplitter的Grid,但任何有效的东西都可以.
• 我希望能够在关闭应用程序时保存右侧列的宽度,并在应用程序打开时加载它但这应该是初始大小:用户应该能够调整它的大小.
• 当我调整窗口大小时,我希望左侧和右侧列保持相同的大小,而中间列则根据窗口宽度调整大小.
• 左侧和右侧列需要具有最小宽度.当我调整右侧列的大小时,我希望中心列变小但不是左侧列.
• 我还希望能够使用位于列外部的切换按钮切换右侧列的可见性,当它返回到可见性时,我希望它与之前的宽度相同.

我试图在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更改.存储和设置Width的right是你的,但不应该是很难.

至于允许用户调整大小right,这会有点棘手,但我发现这篇文章应该有所帮助.这篇文章可能会有所帮助.

为了可见性right,您可以将其Visibility设置Collapsed为隐藏它并通过将其设置为还原它Visible.

注意:里面的面板不一定是Grids,但你会想要使用某种面板Panel.无论你当前Grid列中有什么,都可以正常工作.

Answer 2

我使用Grid with GridSplitters,因为这样可以很容易地调整中间列的大小,同时保持左右列的宽度.

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;
    }
}

至于在启动时保存和恢复列宽,我只是将宽度变量存储到设置文件中,然后在重新打开应用程序时应用它们.