StackPanel 内彩色文本块之间的神秘线条 [英] Mysterious line between colored TextBlocks inside a StackPanel

问题描述

这是我的问题:

当我创建一个 StackPanel 并在其中添加两个或多个具有不同背景颜色的 TextBlock 时，有时会出现一条奇怪的细线将它们分开.我想知道可能是什么原因以及如何解决它?

When I create a StackPanel and add two or more TextBlocks inside with different background colors, sometimes there's a curious fine line which separates them. I wonder what might be the cause and how to fix it ?

以下面的代码为例.

<Grid x:Name="Grid" d:LayoutOverrides="LeftPosition, RightPosition" Margin="4">
    <Grid.ColumnDefinitions>
        <ColumnDefinition/>
        <ColumnDefinition/>
    </Grid.ColumnDefinitions>
    <StackPanel x:Name="StackPanel1" Grid.Column="0" Margin="0,0,0.5,0">
        <TextBlock x:Name="textBlock1" Background="#FF3C2C30" Foreground="{x:Null}" Height="60"/>
        <TextBlock x:Name="textBlock2" Background="#FF303646" Foreground="{x:Null}" Height="60"/>
        <TextBlock x:Name="textBlock3" Background="#FF3C2C30" Foreground="{x:Null}" Height="60"/>
        <TextBlock x:Name="textBlock4" Background="#FF303646" Foreground="{x:Null}" Height="60"/>
        <TextBlock x:Name="textBlock5" Background="#FF3C2C30" Foreground="{x:Null}" Height="60"/>
    </StackPanel>
    <StackPanel x:Name="StackPanel2" Grid.Column="1" Margin="0.5,0,0,0">
        <TextBlock x:Name="textBlock6" Background="#FF303646"  Foreground="{x:Null}" Height="42.9"/>
        <TextBlock x:Name="textBlock7" Background="#FF3C2C30" Foreground="{x:Null}" Height="42.9"/>
        <TextBlock x:Name="textBlock8" Background="#FF303646" Foreground="{x:Null}" Height="42.9"/>
        <TextBlock x:Name="textBlock9" Background="#FF3C2C30" Foreground="{x:Null}" Height="42.9" />
        <TextBlock x:Name="textBlock10" Background="#FF303646" Foreground="{x:Null}" Height="42.9"/>
        <TextBlock x:Name="textBlock11" Background="#FF3C2C30" Foreground="{x:Null}" Height="42.9"/>
        <TextBlock x:Name="textBlock12" Background="#FF303646" Foreground="{x:Null}" Height="42.9"/>
    </StackPanel>
</Grid>

下图显示了输出.我希望右侧的 TextBlock 像左侧的一样链接.

The image below shows the output. I would like the TextBlocks on the right side to be linked like those on the left.

输出:未知的分隔符空格

推荐答案

在您的根元素上将 UIElement.SnapsToDevicePixels 属性设置为 true 以在整个 UI 中启用像素捕捉渲染.

Set UIElement.SnapsToDevicePixels Property to true on your root element to enable pixel snap rendering throughout the UI.

<StackPanel x:Name="StackPanel2" Grid.Column="1" Margin="0.5,0,0,0" SnapsToDevicePixels="True">

了解更多WPF 中的 SnapsToDevicePixels 用外行的话说是什么意思?

这篇关于StackPanel 内彩色文本块之间的神秘线条的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！