c# - 如何强制平滑呈现 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>

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>