背景与。不透明度会产生不必要的边

Question

我有一个带有两个TabItem的TabControl，它在Visual Studio 2013中的可视化设计器中看起来是无缝的 - 但是当我运行我的解决方案时，会创建一个边框，我似乎无法摆脱它。在图像中，它看起来像是在网格周围，但它是标签页眉和标签内容之间的边界，与我有关。

如果我从背景中替换透明度，而是使用纯色，问题就会消失。看起来它与半透明度有关。

在视觉设计师中，它看起来像这样：

我构建并运行时的结果：

代码有点直截了当，将所有BorderThickness设置为0。

<Window>
    <Window.Resources>
        <SolidColorBrush x:Key="HasSelectedBrush" Color="White" Opacity="0.65" />
        <SolidColorBrush x:Key="NoSelectedBrush" Color="White" Opacity="0.5" />

        <Style TargetType="{x:Type TabControl}">
            <Setter Property="Template">
                <Setter.Value>
                    <ControlTemplate TargetType="{x:Type TabControl}">
                        <StackPanel>
                            <TabPanel x:Name="HeaderPanel" Panel.ZIndex="1" Margin="0" IsItemsHost="True" KeyboardNavigation.TabIndex="1" Background="Transparent" />
                            <Border x:Name="Border" BorderBrush="Transparent" BorderThickness="0" Margin="0" KeyboardNavigation.TabIndex="2" Background="Transparent">
                                <ContentPresenter ClipToBounds="True" Margin="0" ContentSource="SelectedContent" />
                            </Border>
                        </StackPanel>
                    </ControlTemplate>
                </Setter.Value>
            </Setter>
        </Style>
        <Style TargetType="{x:Type TabItem}">
            <Setter Property="Template">
                <Setter.Value>
                    <ControlTemplate TargetType="{x:Type TabItem}">
                            <Border x:Name="Border" Margin="0" Background="{ StaticResource NoSelectedBrush }" BorderThickness="0">
                                <ContentPresenter x:Name="ContentSite" VerticalAlignment="Center" HorizontalAlignment="Center" ContentSource="Header" Margin="0, 20, 0, 20" />
                            </Border>
                        <ControlTemplate.Triggers>
                            <Trigger Property="IsSelected" Value="True">
                                <Setter Property="Panel.ZIndex" Value="100" />
                                <Setter TargetName="Border" Property="Background" Value="{ StaticResource HasSelectedBrush }" />
                            </Trigger>
                        </ControlTemplate.Triggers>
                    </ControlTemplate>
                </Setter.Value>
            </Setter>
        </Style>
    </Window.Resources>
    <Grid>
        <Grid x:Name="MainViewGrid">
            <Grid.Background>
                <ImageBrush Stretch="Fill" ImageSource="Assets/Images/Background.jpg" />
            </Grid.Background>
            <TabControl Width="500" Height="400" Margin="0" Padding="0" Background="Transparent">
                <TabItem Header="Tab One" Width="250">
                    <controls:FirstTabControl />
                </TabItem>
                <TabItem Header="Tab Two" Width="250">
                    <controls:SecondTabControl />
                </TabItem>
            </TabControl>
        </Grid>
    </Grid>
</Window>

更新

经过一些测试，我得出结论，这取决于窗口大小。看起来边框来自抗锯齿，但将SnapsToDevicePixels设置为true并不能解决我的问题。

Answer 1

没有答案，只是对问题进行了改进。

在问题之后我做了很多实验，我发现了另一个有趣的事实。

当它在TabControl中时，堆栈面板没有连续放置Childs！

这是一个例子。在此代码中

鉴于此代码：

<Grid Background="Black"  Width="150">
    <StackPanel>
        <Border Background="White" Height="50" />
        <Border Background="White" Height="50" />
        <Border Background="White" Height="50" />
    </StackPanel>
</Grid>

结果：

但在TabControl中，如：

    <TabControl Background="Black" Width="150" >
        <TabItem Header="Tab" >
            <StackPanel>
                <Border Background="White" Height="50" />
                <Border Background="White" Height="50" />
                <Border Background="White" Height="50" />
            </StackPanel>
        </TabItem>
    </TabControl>

为什么Borders上有划线？