Question

目前我的代码后面有一个绑定到布尔属性（DualLayout）的切换按钮。当布尔值设置为True时，我希望我的网格（和网格分割器）中的第二行隐藏并让第一行占用网格的整个空间。一旦布尔值设置为False，我希望显示网格分割器和底行。

这是我的xaml的片段

<ToggleButton Name="toggleLayout" Margin="66,1,0,1" Width="25" HorizontalAlignment="Left" IsChecked="{Binding DualLayout}" Checked="toggleLayout_Clicked" Unchecked="toggleLayout_Clicked">
            <ToggleButton.Style>
                <Style TargetType="{x:Type ToggleButton}">
                    <Style.Triggers>
                        <Trigger Property="IsChecked" Value="true">
                            <Setter Property="ContentTemplate">
                                <Setter.Value>
                                    <DataTemplate DataType="{x:Type ToggleButton}">
                                        <Image Source="Images/PlayHS.png"/>
                                    </DataTemplate>
                                </Setter.Value>
                            </Setter>
                            <Setter Property="ToolTip" Value="Receive and Transmit Windows Split."/>
                        </Trigger>
                        <Trigger Property="IsChecked" Value="false">
                            <Setter Property="ContentTemplate">
                                <Setter.Value>
                                    <DataTemplate DataType="{x:Type ToggleButton}">
                                        <Image Source="Images/PauseHS.png"/>
                                    </DataTemplate>
                                </Setter.Value>
                            </Setter>
                            <Setter Property="ToolTip" Value="Receive and Transmit Windows Combined."/>
                        </Trigger>
                    </Style.Triggers>
                </Style>
            </ToggleButton.Style>
        </ToggleButton>
    <Grid x:Name="transmissionsGrid" Margin="0,28,0,0">
        <Grid.RowDefinitions>
            <RowDefinition Height="Auto"/>
            <RowDefinition Height="*" MinHeight="100" />
        </Grid.RowDefinitions>
        <transmission:TransmissionsControl x:Name="transmissionsReceive" TransmissionType="Receive" Margin="0,0,0,5" />
        <GridSplitter Name="gridSplitter1" Grid.Row="0" Background="White" Cursor="SizeNS" Height="4" HorizontalAlignment="Stretch" VerticalAlignment="Bottom" Foreground="Firebrick"  />
        <transmission:TransmissionsControl x:Name="transmissionsTransmit" TransmissionType="Transmit" Grid.Row="1"  />
    </Grid>

Answer 1

这是未经测试的，但我相信它应该有用。

首先，如果您希望第一行占用整个空间，则需要将RowDefinition定义为

<Grid.RowDefinitions>
    <RowDefinition Height="*"/>
    <RowDefinition Height="Auto" />  <!-- Edit: Removed MinHeight="100" -->
</Grid.RowDefinitions>

要显示/隐藏控件，您需要将其Visibility属性绑定到DualLayout属性（如果类正确实现INotifyPropertyChanged），或者（可能更简单地）绑定到ToggleButton的IsChecked属性。

例如（同样适用于GridSplitter）：

<!-- EDIT: Added MinHeight="100" here instead -->
<transmission:TransmissionsControl x:Name="transmissionsTransmit"
               TransmissionType="Transmit" 
               Grid.Row="1"
               MinHeight="100"
               Visibility={Binding ElementName=toggleLayout,
                                   Path=IsChecked,
                                   Converter={StaticResource boolToVis}}"  />

在相关控件之上的某个级别（这里我是在窗口级别执行），您需要添加内置的BooleanToVisibilityConverter资源：

<Window.Resources>
    <BooleanToVisibilityConverter x:Key="boolToVis" />
</Window.Resources>

如何基于切换按钮显示/隐藏网格行和网格分割器？

1 个答案: