c# - UWP 中的位图平滑

Question

我想弄清楚如何在不损失 UWP 质量的情况下调整图像大小。我知道在 WPF 中有一个选项可以使用这个来平滑图像:RenderOptions.BitmapScalingMode="HighQuality" 但我似乎无法在 UWP 中找到等效项。

这是图像的样子:

它应该是什么样子:

如果你仔细看，你会发现图片像素化严重。我如何在 UWP 中实现这一目标？

我正在通过 XAML(圆形裁剪)调整它的大小:

<Ellipse x:Name="personImageContainer" Width="50" Height="50">
    <Ellipse.Fill>
        <ImageBrush x:Name="personImage" ImageSource="/Assets/BlankContact.png" Stretch="Uniform" />
    </Ellipse.Fill>
</Ellipse>

然后像这样设置图像:

personImage.ImageSource = new BitmapImage(new Uri("http://lorempixel.com/500/500/"));

我似乎无法在 ImageBrush 和 BitmapImage 中找到任何其他设置。

Answer 1

作为一种优化，框架通常会以较小的分辨率解码图像以匹配屏幕上显示的目标 Image 元素的大小，但这只有在框架可以立即确定什么时才会发生目标 Image 的大小将是。如果框架无法推断出这一点，那么它将以全分辨率加载图像并由 GPU 缩小，而不是可能具有破旧的线性插值，这使得图像在缩小时看起来很粗糙。

我认为这就是您的示例中发生的情况，因为 ImageBrush 不知道它所应用的 Ellipse 的大小。 (这是一种显示图像的自定义方式。)

由于您提前知道Ellipse 的大小，您可以明确告诉框架以您指定的分辨率解码图像。

<!-- Bad: image will be full resolution -->
<Ellipse Width="50" Height="50">
    <Ellipse.Fill>
        <ImageBrush Stretch="UniformToFill" ImageSource="Assets/Cat.jpg"/>
    </Ellipse.Fill>
</Ellipse>

<!-- Better: image is scaled down nicely and uses less memory -->
<Ellipse Width="50" Height="50">
    <Ellipse.Fill>
        <ImageBrush Stretch="UniformToFill">
            <ImageBrush.ImageSource>
                <BitmapImage UriSource="Assets/Cat.jpg" DecodePixelType="Logical" DecodePixelWidth="50"/>
            </ImageBrush.ImageSource>
        </ImageBrush>
    </Ellipse.Fill>
</Ellipse>

有关此的更多信息 here .