WPF中Button内Path线条设置1px却显示2px问题求助

问题分析 #

在125% DPI缩放（120DPI）环境下，WPF的逻辑像素1对应1.25物理像素。当设置StrokeThickness="1"时，WPF为避免线条模糊会向上取整渲染为2物理像素，常规的UseLayoutRounding、SnapsToDevicePixels等设置因元素对齐逻辑，在该场景下未生效。

可行解决方案 #

方案1：按DPI比例动态计算StrokeThickness

利用WPF识别的DPI缩放系数，将StrokeThickness设置为1 / 缩放系数，确保最终渲染为1物理像素：

// 代码中获取缩放系数并设置
PresentationSource presentationSource = PresentationSource.FromVisual(yourButton);
double scale = presentationSource.CompositionTarget.TransformToDevice.M11;
yourPath.StrokeThickness = 1 / scale;

也可在XAML中通过值绑定实现（需自定义转换器）：

<Path Stroke="Black" 
      StrokeThickness="{Binding RelativeSource={RelativeSource AncestorType=Button}, 
                                Converter={StaticResource DpiScaleConverter}}"
      Data="M0,0 L10,0" 
      VerticalAlignment="Center" HorizontalAlignment="Center"/>

转换器代码：

public class DpiScaleConverter : IValueConverter
{
    public object Convert(object value, Type targetType, object parameter, CultureInfo culture)
    {
        if (value is UIElement element)
        {
            var source = PresentationSource.FromVisual(element);
            if (source != null)
            {
                double scale = source.CompositionTarget.TransformToDevice.M11;
                return 1 / scale;
            }
        }
        return 1;
    }

    public object ConvertBack(object value, Type targetType, object parameter, CultureInfo culture)
    {
        throw new NotImplementedException();
    }
}

方案2：用Rectangle替代Path绘制线条

Rectangle的尺寸渲染逻辑更稳定，直接通过宽高模拟线条：

<ControlTemplate TargetType="{x:Type Button}">
    <Grid Background="{TemplateBinding Background}">
        <Rectangle Width="10" Height="1" Fill="Black"
                   VerticalAlignment="Center" HorizontalAlignment="Center"
                   SnapsToDevicePixels="True" UseLayoutRounding="True"/>
    </Grid>
</ControlTemplate>

方案3：强制线条对齐设备像素边界

通过RenderTransform偏移0.5逻辑像素，让线条对齐到设备像素的完整边界：

<Path Stroke="Black" StrokeThickness="1" Data="M0,0 L10,0" 
      VerticalAlignment="Center" HorizontalAlignment="Center"
      SnapsToDevicePixels="True" UseLayoutRounding="True">
    <Path.RenderTransform>
        <TranslateTransform X="0.5" Y="0.5"/>
    </Path.RenderTransform>
</Path>

额外验证建议 #

在Window级别开启全局渲染对齐设置，覆盖所有子元素的渲染行为：

<Window ... UseLayoutRounding="True" SnapsToDevicePixels="True">

内容的提问来源于stack exchange，提问作者D .Stark