WPF GridSplitter TabHeader定位

时间:2019-03-13 13:21:17

标签: c# wpf xaml grid tabcontrol

我的应用程序具有以下网格结构:

Click here to see the structure

  • 3行/ 3列:
    • 行0列0:具有3个TabItem的TabControl
    • 第1行第0行:GridSplitter
    • 第2行0:带有3个TabItem的TabControl
    • 第0行第1行:Gridsplitter
    • 第1行第1行:-
    • 第2行第1行:GridSplitter
    • 第0行第2行:AnyControls
    • 第1列第2行:GridSplitter
    • 第2行第2行:AnyControls

我希望2个TabHeader组在水平GridSplitter上方并排对齐...

有人有想法吗?我被卡在这里...

1 个答案:

答案 0 :(得分:1)

将下部选项卡的“上边距”设置为负数,以使其延伸到其在网格中位置的上方。将GridSplitter放置在其下方,设置其大小以调整行的大小并水平拉伸(我使用蓝色背景使其可见)。

See image here

<Grid>
    <Grid.ColumnDefinitions>
        <ColumnDefinition></ColumnDefinition>
        <ColumnDefinition Width="10"></ColumnDefinition>
        <ColumnDefinition></ColumnDefinition>
    </Grid.ColumnDefinitions>
    <Grid.RowDefinitions>
        <RowDefinition></RowDefinition>
        <RowDefinition Height="10"></RowDefinition>
        <RowDefinition></RowDefinition>
    </Grid.RowDefinitions>

    <!-- Set the GridSplitter's ResizeDirection to Rows, and its HorizontalAlignment to Stretch -->
    <GridSplitter Grid.Row="1" Grid.Column="0" Height="2" ResizeDirection="Rows" HorizontalAlignment="Stretch" Background="Blue"></GridSplitter>

    <!-- Place the upper TabControl's tabs on the bottom and aligned to the right. -->
    <TabControl Grid.Column="0" Grid.Row="0" TabStripPlacement="Bottom">
        <TabControl.Resources>
            <Style TargetType="TabPanel">
                <Setter Property="HorizontalAlignment" Value="Right"/>
            </Style>
        </TabControl.Resources>
        <TabItem Header="Item 1"></TabItem>
        <TabItem Header="Item 2"></TabItem>
        <TabItem Header="Item 3"></TabItem>
    </TabControl>    

    <!-- Set the lower TabControl's top margin to -30 to extend up out of its location in the grid. -->
    <TabControl Grid.Column="0" Grid.Row="2" Margin="0, -30, 0, 0">
        <TabItem Header="Item 1"></TabItem>
        <TabItem Header="Item 2"></TabItem>
        <TabItem Header="Item 3"></TabItem>
    </TabControl>


</Grid>