如何在相当大的列中创建水平网格拆分器

本文关键字:水平 创建 网格 拆分 相当大 | 更新日期: 2023-09-27 18:33:36

我正在尝试创建一个包含水平网格拆分器的大型列。

代码是 WPF 的 XAML:

<DockPanel Name="dockPanel1" LastChildFill="True" >
    <Grid Name="D1G1" ShowGridLines="False" DockPanel.Dock="Top">
        <Grid.RowDefinitions>
            <RowDefinition Height="30"/>
        </Grid.RowDefinitions>
        <Grid.ColumnDefinitions>
            <ColumnDefinition Width="Auto"/>
        </Grid.ColumnDefinitions>
        <Label Content="Toppie" Grid.Column="1" Grid.Row="0" />
    </Grid>
    <Grid Name="D1G2" ShowGridLines="False" DockPanel.Dock="Bottom">
        <Grid.RowDefinitions>
            <RowDefinition Height="30"/>
        </Grid.RowDefinitions>
        <Grid.ColumnDefinitions>
            <ColumnDefinition Width="*"/>
            <ColumnDefinition Width="Auto"/>
            <ColumnDefinition Width="*"/>
        </Grid.ColumnDefinitions>
        <Label Content="Bottom" Grid.Column="1" Grid.Row="0" />
    </Grid>
    <Grid Name="D1G3" ShowGridLines="False" DockPanel.Dock="Top">
        <Grid.RowDefinitions>
            <RowDefinition Height="30"/>
        </Grid.RowDefinitions>
        <Grid.ColumnDefinitions>
            <ColumnDefinition Width="*"/>
            <ColumnDefinition Width="Auto"/>
            <ColumnDefinition Width="*"/>
        </Grid.ColumnDefinitions>
        <GridSplitter HorizontalAlignment="Right" 
              VerticalAlignment="Stretch" 
              Grid.Column="1" ResizeBehavior="PreviousAndNext"
              Width="2" Background="#FFBCBCBC"/>
        <DockPanel Name="dockPanel2" DockPanel.Dock="Left" Grid.Column="0">
            <Grid Name="D2G1" ShowGridLines="False" DockPanel.Dock="Top">
                <Grid.RowDefinitions>
                    <RowDefinition Height="*"/>
                    <RowDefinition Height="Auto"/>
                    <RowDefinition Height="*"/>
                </Grid.RowDefinitions>
                <Grid.ColumnDefinitions>
                    <ColumnDefinition Width="Auto"/>
                </Grid.ColumnDefinitions>
                <GridSplitter HorizontalAlignment="Stretch"
                              Grid.Row="1" Grid.ColumnSpan="1" ResizeBehavior="PreviousAndNext"
                              Width="5" Background="#FFBCBCBC"/>
                <Label Content="D2Row0" Grid.Row="0" />
                <!-- separator at Row1 -->
                <Label Content="D2Row2" Grid.Row="2" />
            </Grid>
        </DockPanel>
    </Grid>

</DockPanel>

我可以单独创建其中一个。但我两者都想要。为了在表单中制作更多网格,我使用dockpanel。也许这不是必需的,但如果我不这样做,它会产生错误。我哪里出错了?有人知道吗?

如何在相当大的列中创建水平网格拆分器

试试这个:

 <DockPanel Name="dockPanel1" LastChildFill="True" >
    <Grid Name="D1G1" ShowGridLines="False" DockPanel.Dock="Top">
        <Grid.RowDefinitions>
            <RowDefinition Height="30"/>
        </Grid.RowDefinitions>
        <Grid.ColumnDefinitions>
            <ColumnDefinition Width="Auto"/>
        </Grid.ColumnDefinitions>
        <Label Content="Toppie" Grid.Column="1" Grid.Row="0" />
    </Grid>
    <Grid Name="D1G2" ShowGridLines="False" DockPanel.Dock="Bottom">
        <Grid.RowDefinitions>
            <RowDefinition Height="30"/>
        </Grid.RowDefinitions>
        <Grid.ColumnDefinitions>
            <ColumnDefinition Width="*"/>
            <ColumnDefinition Width="Auto"/>
            <ColumnDefinition Width="*"/>
        </Grid.ColumnDefinitions>
        <Label Content="Bottom" Grid.Column="1" Grid.Row="0" />
    </Grid>
    <Grid Name="D1G3" ShowGridLines="False" DockPanel.Dock="Top">
        <Grid.RowDefinitions>
            <RowDefinition Height="30"/>
        </Grid.RowDefinitions>
        <Grid.ColumnDefinitions>
            <ColumnDefinition Width="*"/>
            <ColumnDefinition Width="Auto"/>
            <ColumnDefinition Width="*"/>
        </Grid.ColumnDefinitions>
        <GridSplitter HorizontalAlignment="Right" 
          VerticalAlignment="Stretch" 
          Grid.Column="1" ResizeBehavior="PreviousAndNext"
          Width="2" Background="#FFBCBCBC"/>
        <DockPanel Name="dockPanel2" DockPanel.Dock="Left" Grid.Column="0">
            <Grid Name="D2G1" ShowGridLines="False" DockPanel.Dock="Top">
                <Grid.RowDefinitions>
                    <RowDefinition Height="*"/>
                    <RowDefinition Height="Auto"/>
                    <RowDefinition Height="*"/>
                </Grid.RowDefinitions>
                <Grid.ColumnDefinitions>
                    <ColumnDefinition Width="Auto"/>
                </Grid.ColumnDefinitions>
                <GridSplitter Grid.Row="1" ResizeBehavior="PreviousAndNext" HorizontalAlignment="Stretch" VerticalAlignment="Center" Background="#FFBCBCBC" Height="2"/>
                <Label Content="D2Row0" Grid.Row="0" />
                <!-- separator at Row1 -->
                <Label Content="D2Row2" Grid.Row="2" />
            </Grid>
        </DockPanel>
    </Grid>

</DockPanel>