在WPF中渲染清晰的线条

Question

如果我呈现以下内容:

<Grid>
  <Canvas SnapsToDevicePixels="True">  
    <Path Fill="#FF000000" SnapsToDevicePixels="True" Data="M 0.00,0.00 L 2.50,0.00 0.00,10.00 " />
    <Path Fill="#FF260014" SnapsToDevicePixels="True" Data="M 2.50,0.00 L 7.50,0.00 2.50,10.00 0.00,10.00 " />
    <Canvas.RenderTransform>
      <ScaleTransform ScaleX="{Binding ElementName=slider,Path=Value}" ScaleY="{Binding ElementName=slider,Path=Value}" />
    </Canvas.RenderTransform>
  </Canvas>
  <Slider x:Name="slider" Minimum="0" Maximum="50" Value="30"/>
</Grid>

我得到这个结果(Kaxaml):

注意两个形状之间的细白线.我四处搜索,发现这与像素对齐有关.我希望设置SnapsToDevicePixels="True"足以摆脱线路,但这不起作用!

任何想法如何摆脱白线？

Answer 1

尝试使用RenderOptions打开边缘别名,如下所示(请参阅网格属性)

<Grid RenderOptions.EdgeMode="Aliased">
  <Canvas SnapsToDevicePixels="True">  
        <Path Fill="#FF000000" SnapsToDevicePixels="True" Data="M 0.00,0.00 L 2.50,0.00 0.00,10.00 " />
        <Path Fill="#FF260014" SnapsToDevicePixels="True" Data="M 2.50,0.00 L 7.50,0.00 2.50,10.00 0.00,10.00 " />
        <Canvas.RenderTransform>
          <ScaleTransform ScaleX="{Binding ElementName=slider,Path=Value}" ScaleY="{Binding ElementName=slider,Path=Value}" />
        </Canvas.RenderTransform>
  </Canvas>

  <Slider x:Name="slider" Minimum="0" Maximum="50" Value="30"/>
</Grid>