如何强制WPF控件进行平滑渲染？

Question

我正在创建一个简单的 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>

- Christoph Meißner

---

你需要发布代码或提供一个能够复现的示例项目，才能进行测试。我们只能猜测，可能是机器资源有限。如果可能的话，你可以形成一个新的图像，该图像由4个原始图像组成，并将此新图像放入你的“ScrollViewer”中。这样，在视图中，你只处理1个图像，因此不应该出现这样的问题，但在后台，你可以跟踪哪个区域的图像对应哪个源。 - Viv

我已经在上面添加了一个简单的代码示例，展示了使用一些网格显示相同的问题。将图像合并为一个图像并不是我的意图！有限的资源绝对不是我的机器的问题。 - Christoph Meißner

你提供的复现问题的代码在我的电脑上并没有出现你所遇到的问题。当我滚动时，或者没有白色边框的交叉区域只是一个黑色区域（或者我没看到）。 - Viv

尽管我当前无法重现这个问题，但我记得我曾通过设置EdgeMode.Aliased解决过类似的问题。 - Clemens

是的，这是正确的 - 这就是解决方案。我已经自己找到了这个解决方案并在下面发布了它。但还是谢谢你！ - Christoph Meißner

Answer 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>

- Christoph Meißner