在 WPF 中对齐选项卡项和选项卡控件边框答案

【问题标题】：Align Tab Item and Tab Control Border in WPF在 WPF 中对齐选项卡项和选项卡控件边框
【发布时间】：2015-03-17 21:34:57
【问题描述】：

我有下面的 XAML：

<Page
xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml">

<TabControl Margin="10" TabStripPlacement="Left" BorderBrush="gray">
<TabControl.Resources>
  <Style TargetType="TabItem">
    <Setter Property="Height" Value="40" />
    <Setter Property="Border.BorderBrush" Value="gray" />
    <Setter Property="Border.Background" Value="lightgray" />
    <Style.Resources>
        <Style TargetType="Border">
          <Setter Property="CornerRadius" Value="6,0,0,6" />
          <Setter Property="Margin" Value="0,1.5" />
        </Style>
    </Style.Resources>
  </Style>      
</TabControl.Resources>
  <TabItem Header="Tab 1">
    Conten1
  </TabItem>
  <TabItem Header="Tab 2">
    Content2
  </TabItem>
  <TabItem Header="Tab 3">
    Content2
  </TabItem>
</TabControl>

</Border>

我需要在上面的 xaml 中进行哪些更改，以使 TabItem 顶部和底部边框与选项卡控件边框对齐？我希望它看起来好像顶部选项卡项控件和顶部选项卡控件边框形成一行。与底部边框相同。

【问题讨论】：

标签： wpf xaml

【解决方案1】：

试试下面的代码。变化很少。希望对您有所帮助。

<TabControl Margin="10" TabStripPlacement="Left" HorizontalContentAlignment="Left" BorderBrush="gray">
        <TabControl.Resources>
            <Style TargetType="TabItem">

                <Setter Property="Border.BorderBrush" Value="gray" />
                <Setter Property="Border.Background" Value="lightgray" />
                <Style.Resources>
                    <Style TargetType="Border">
                        <Setter Property="CornerRadius" Value="6,0,0,6" />
                        <!--<Setter Property="Margin" Value="0,1.5" />-->
                    </Style>
                </Style.Resources>
            </Style>
        </TabControl.Resources>
        <TabItem Header="Tab 1" HorizontalAlignment="Stretch" HorizontalContentAlignment="Stretch">
            Conten1
        </TabItem>
        <TabItem Header="Tab 2" HorizontalAlignment="Stretch" HorizontalContentAlignment="Stretch">
            Content2
        </TabItem>
        <TabItem Header="Tab 3" HorizontalAlignment="Stretch" HorizontalContentAlignment="Stretch">
            Content2
        </TabItem>
    </TabControl>

【讨论】：