如何强制 WPF 控件的平滑渲染？答案

【问题标题】：How to force smooth rendering of WPF Controls?如何强制 WPF 控件的平滑渲染？
【发布时间】：2013-08-18 11:59:01
【问题描述】：

我正在创建一个简单的 WPF 应用程序，它应该在一个可滚动区域内组合几个图像。这些图像应该绝对没有边框，只要正确定位它们应该没有问题。

当我启动应用程序时，一切都按预期呈现。但是当我开始滚动图像之间的一些（白色）边框时。（见截图）

我认为当我在ScrollViewer 内开始缩放/缩放时会出现同样的问题。

所以我的问题是，如何在 WPF 应用程序中，尤其是在 ScrollViewer 中避免此类边界？

以下代码应该足以重现问题：

<Window x:Class="Test.MainWindow"
    xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
    xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
    Title="MainWindow" Height="350" Width="525">
<Grid>
    <ScrollViewer HorizontalAlignment="Stretch" Name="scrollViewer1" VerticalAlignment="Stretch" VerticalScrollBarVisibility="Auto" HorizontalScrollBarVisibility="Auto">
        <Grid>
            <Grid Background="Black" Width="500" Height="500" VerticalAlignment="Top" HorizontalAlignment="Left"/>
            <Grid Background="Black" Width="500" Height="500" Margin="500,0,0,0" VerticalAlignment="Top" HorizontalAlignment="Left"/>
            <Grid Background="Black" Width="500" Height="500" Margin="500,500,0,0" VerticalAlignment="Top" HorizontalAlignment="Left"/>
            <Grid Background="Black" Width="500" Height="500" Margin="0,500,0,0" VerticalAlignment="Top" HorizontalAlignment="Left"/>
        </Grid>
    </ScrollViewer>
</Grid>

【问题讨论】：

您需要发布代码或提供一个重现此内容的示例项目，甚至可以对其进行测试。对于我们所能猜测的一切，它可能是资源有限的机器。如果可能的话，您可以形成一个由 4 个原始图像组成的新图像，并将这个新图像放入您的 ScrollViewer。你不应该有这样的问题，因为在视图中，你只处理 1 个图像，但在后台你可以跟踪图像的哪个区域对应于哪个源。
我在上面添加了一个简单的代码示例。这使用一些网格显示了同样的问题。不打算将图像组合成一张图像！有限的资源绝对不是我机器的问题。
您重现该问题的代码不会导致您在我的机器上遇到的问题。在滚动或不滚动时，我在交叉区域只有一个没有白色边框的黑色区域（或者我对此视而不见）
虽然我目前无法重现该问题，但我记得我曾经通过设置EdgeMode.Aliased 解决了此类问题。
是的，这是正确的——这就是解决方案。我自己找到了这个解决方案，并在下面发布了它。但也谢谢你！

标签： c# wpf image rendering

【解决方案1】：

答案是明确将RenderOptions.EdgeMode 设置为Aliased 用于具有此类边框的控件。

对于我上面的示例，代码如下所示：

<Window x:Class="Test.MainWindow"
    xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
    xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
    Title="MainWindow" Height="350" Width="525">
<Grid>
    <ScrollViewer HorizontalAlignment="Stretch" Name="scrollViewer1" VerticalAlignment="Stretch" VerticalScrollBarVisibility="Auto" HorizontalScrollBarVisibility="Auto">
        <Grid>
            <Grid Background="Black" Width="500" Height="500" VerticalAlignment="Top" HorizontalAlignment="Left" RenderOptions.EdgeMode="Aliased"/>
            <Grid Background="Black" Width="500" Height="500" Margin="500,0,0,0" VerticalAlignment="Top" HorizontalAlignment="Left" RenderOptions.EdgeMode="Aliased"/>
            <Grid Background="Black" Width="500" Height="500" Margin="500,500,0,0" VerticalAlignment="Top" HorizontalAlignment="Left" RenderOptions.EdgeMode="Aliased"/>
            <Grid Background="Black" Width="500" Height="500" Margin="0,500,0,0" VerticalAlignment="Top" HorizontalAlignment="Left" RenderOptions.EdgeMode="Aliased"/>
        </Grid>
    </ScrollViewer>
</Grid>

【讨论】：