相同的按钮但看起来不同 WPF答案

【问题标题】：Same buttons but looks differently WPF相同的按钮但看起来不同 WPF
【发布时间】：2017-03-12 12:30:50
【问题描述】：

我的 Window.xaml 上有几个按钮，有趣的事实是，当我运行应用程序时，即使我为每个应用程序使用相同的代码，它们看起来也不同..

这是截图：

可能会注意到它们的边框看起来不一样（特别是在 Y 按钮上）..

这是每个自定义按钮的代码：（X、Y 和 Z）

<Button x:Name="btnX"
        Grid.Column="1"
        FontSize="15"
        BorderThickness="1"
        Content="X"
        HorizontalContentAlignment="Center"
        VerticalContentAlignment="Center"
        Foreground="Black"
        Background="#d3d3d3"
        BorderBrush="Black" Margin="5">
        <Button.Template>
            <ControlTemplate TargetType="{x:Type Button}">
                <Border BorderThickness="{TemplateBinding BorderThickness}"
                    BorderBrush="{TemplateBinding BorderBrush}"
                    Background="{TemplateBinding Background}">
                    <ContentPresenter HorizontalAlignment="{TemplateBinding HorizontalContentAlignment}"
                        VerticalAlignment="{TemplateBinding VerticalContentAlignment}" />
                </Border>
            </ControlTemplate>
        </Button.Template>
    </Button>

    <Button x:Name="btnZ"
        Grid.Column="2"
        FontSize="15"
        Content="Z"
        BorderThickness="1"
        HorizontalContentAlignment="Center"
        VerticalContentAlignment="Center"
        Foreground="Black"
        Background="#d3d3d3"
        BorderBrush="Black" Margin="5">
        <Button.Template>
            <ControlTemplate TargetType="{x:Type Button}">
                <Border BorderThickness="{TemplateBinding BorderThickness}"
                    BorderBrush="{TemplateBinding BorderBrush}"
                    Background="{TemplateBinding Background}">
                    <ContentPresenter HorizontalAlignment="{TemplateBinding HorizontalContentAlignment}"
                        VerticalAlignment="{TemplateBinding VerticalContentAlignment}" />
                </Border>
            </ControlTemplate>
        </Button.Template>

    </Button>


        <Button x:Name="btnY"
        Grid.Column="2"
        Grid.Row="1"
        FontSize="15"
        Content="Y"
        BorderThickness="1"
        HorizontalContentAlignment="Center"
        VerticalContentAlignment="Center"
        Foreground="Black"
        Background="#d3d3d3"
        BorderBrush="Black" Margin="5">
        <Button.Template>
            <ControlTemplate TargetType="{x:Type Button}">
                <Border BorderThickness="{TemplateBinding BorderThickness}"
                    BorderBrush="{TemplateBinding BorderBrush}"
                    Background="{TemplateBinding Background}">
                    <ContentPresenter HorizontalAlignment="{TemplateBinding HorizontalContentAlignment}"
                        VerticalAlignment="{TemplateBinding VerticalContentAlignment}" />
                </Border>
            </ControlTemplate>
        </Button.Template>
</Button>

【问题讨论】：

有什么不同？
@NikhilAgrawal 你没注意到它们的边界看起来不一样吗？我为每个按钮使用了黑色边框画笔，其中一些看起来像我实际使用了灰色......？

标签： c# wpf button styles

【解决方案1】：

我发现在我的按钮上设置SnapsToDevicePixels="True" 和UseLayoutRounding="True" 解决了这个问题，我不确定这是否是最好的答案，但这肯定对我有帮助..

设置此属性后的按钮：

边框现在看起来一样了，应该是黑色的。

【讨论】：

I'm not sure if that was best answer but that definately helped me. 是。 WPF 使用亚像素渲染，当控件位于两个像素之间时会导致这种奇怪的效果（通常是因为您在某个地方有一个使用百分比进行定位的容器）。您找到的属性会稍微改变控件的位置，使其适合屏幕像素。为什么默认情况下不激活它超出了我的理解。
@KevinGosse 是的，我可以说当 BorderThickness 为 1 时它真的很好，但如果你将它更改为 1.5 或 smth，那么它会再次开始看起来很糟糕，就像你给顶部边框 1.5 和底部一样边框为 1.5，其余为 1，真的很奇怪，所以我现在将其保持为 1 px 厚度。