图像根据位置呈现不同的效果

Question

我有一个显示按钮列表的 ItemsControl。每个按钮都有一个图像作为其内容 (png)，但每行的图像看起来略有不同。

下图是我所看到的放大版本：

这是 xaml：

<ItemsControl ItemsSource="{Binding Items}">
    <ItemsControl.ItemTemplate>
        <DataTemplate>
            <StackPanel   Orientation="Horizontal">
                <TextBlock Name="tb1">hello</TextBlock>
                <Button Height="{Binding ElementName=tb1, Path=ActualHeight}" Padding="0,-3,-3,-3" BorderBrush="Transparent" Background="Transparent" >
                    <Image Stretch="Fill"  Source="stock_standard_filter.png" Margin="0">
                    </Image>
                </Button>
            </StackPanel>
        </DataTemplate>
    </ItemsControl.ItemTemplate>
</ItemsControl>

我有一个 之前有类似问题，并能够使用 SnapsToDevicePixels="True" 解决该问题，但这次该解决方案不起作用。我还尝试过 UseLayoutRounding="True" 和 RenderOptions.EdgeMode="Aliased"

Answer 1

按钮的高度受到限制，因此图像将被拉伸以填充按钮。由于 WPF 使用双精度（1/96 英寸单位），因此必然会进行一些舍入。当您在 StackPanel 上使用 SnapsToDevicePixels 和布局舍入时，它们可能会有所帮助，但只要您拉伸图像，它就会变得模糊。

我最好的猜测是设置“拉伸为无”并尝试 SnapsToDevicePixels 和布局舍入。