设置网格的可见性隐藏另一个网格答案

【问题标题】：Settings Visibility of Grid Hides Another Grid设置网格的可见性隐藏另一个网格
【发布时间】：2014-12-19 08:22:02
【问题描述】：

我有两个网格控件位于父网格的同一行中。

<Grid x:Name="grdTimelinePlusControls" Grid.Row="1" Grid.ColumnSpan="3">
    <Grid.RowDefinitions>
        <RowDefinition Height="*" />
        <RowDefinition Height="Auto" />
        <RowDefinition Height="Auto" />
    </Grid.RowDefinitions>
    <ProgressBar x:Name="pgbVideoTimeline" HorizontalAlignment="Stretch" Height="7" Background="{StaticResource SecondaryColour}" Foreground="Maroon" BorderThickness="0" Style="{StaticResource ExpandContractTimeline}" Grid.Row="1" MouseDown="pgbVideoTimeline_MouseDown" MouseMove="pgbVideoTimeline_MouseMove" MouseUp="pgbVideoTimeline_MouseUp" />
    <Grid x:Name="grdControls" Grid.Row="2" Background="{StaticResource BackgroundColour}" Height="40" Style="{StaticResource ExpandHideControls}">
        <Grid.ColumnDefinitions>
            <ColumnDefinition Width="*" />
            <ColumnDefinition Width="*" />
        </Grid.ColumnDefinitions>
        <StackPanel x:Name="stpPlaybackControls" Orientation="Horizontal" HorizontalAlignment="Left" Grid.Column="0">
            <Image x:Name="btnPlayPause" Height="30" Margin="10,5,5,5" ToolTip="Play" Source="Resources/Images/UI/Play.png" MouseEnter="buttonHover_MouseEnter" MouseLeave="buttonHover_MouseLeave" MouseUp="btnPlayPause_MouseUp" />
            <Image x:Name="btnReplay" Height="30" Margin="5" ToolTip="Replay" Source="Resources/Images/UI/Replay.png" MouseEnter="buttonHover_MouseEnter" MouseLeave="buttonHover_MouseLeave" MouseUp="btnReplay_MouseUp" />
        </StackPanel>
        <StackPanel x:Name="stpMiscControls" Orientation="Horizontal" HorizontalAlignment="Right" Grid.Column="1">
            <Slider x:Name="slrSpeed" Width="100" Margin="5,10,5,5" VerticalAlignment="Top"  Minimum="1" Maximum="5" Value="3" LargeChange="1" IsSnapToTickEnabled="True" ValueChanged="slrSpeed_ValueChanged" />
            <Image x:Name="btnOpen" Height="30" Margin="5" ToolTip="Open" Source="Resources/Images/UI/Open.png" MouseEnter="buttonHover_MouseEnter" MouseLeave="buttonHover_MouseLeave" />
            <Image x:Name="btnFullScreen" Height="30" Margin="5" ToolTip="Fullscreen" Source="Resources/Images/UI/FullScreen.png" MouseEnter="buttonHover_MouseEnter" MouseLeave="buttonHover_MouseLeave" MouseUp="btnFullScreen_MouseUp" />
            <Image x:Name="btnSettings" Height="30" Margin="5,5,10,5" ToolTip="Settings" Source="Resources/Images/UI/Settings.png" MouseEnter="buttonHover_MouseEnter" MouseLeave="buttonHover_MouseLeave" />
        </StackPanel>
    </Grid>
</Grid>
<Grid x:Name="grdWorkingTime" Grid.Row="1" Grid.ColumnSpan="3">
    <Grid.ColumnDefinitions>
        <ColumnDefinition Width="*" />
        <ColumnDefinition Width="Auto" />
    </Grid.ColumnDefinitions>
    <ProgressBar x:Name="pgbWorkingTime" Background="{StaticResource BackgroundColour}" BorderBrush="{StaticResource ForegroundColour}" Width=500 Foreground="Maroon" Margin="5" />
</Grid>

我只打算一次显示grdTimelinePlusControls 和grdWorkingTime 中的一个，并且使用上面的代码，我在两个图像的顶部都看到了一个进度条（pgbWorkingTime） StackPanels。但是，当我将grdTimelinePlusControls 的开始标签更改为：

<Grid x:Name="grdTimelinePlusControls" Grid.Row="1" Grid.ColumnSpan="3" Visibility="Collapsed">

它阻止任何一个网格显示，我不明白为什么。似乎grdWorkingTime 一定是grdTimelinePlusControls 的孩子，但我看不到它，文档大纲也显示它们处于同一级别。

这显然不是我页面上的所有代码，但我想让它保持可读性......完整页面是here

【问题讨论】：

标签： wpf xaml visibility

【解决方案1】：

这两个网格在同一个父网格的行中是否有任何特殊原因？如果您使用<RowDefinition Height="Auto" /> 将它们放在两个单独的行中，则“未使用”行应与相应的子网格一起折叠，因为您不打算同时将它们一起显示。

【讨论】：

是的，这很有效，而且是一个好点......虽然我仍然想知道为什么它在原始代码中表现得很奇怪。
@blawford：我必须说我最初的假设与你的完全一样，我希望出现另一个网格。当您折叠顶部网格时，它会保留空间还是整行实际上也折叠了？
行已折叠。