WPF 像素网格线

Question

我正在尝试在我的 canvas 上绘制一个网格，其中：

线条总是一个像素粗
正方形图块的大小以像素表示，换句话说，每条水平线和垂直线之间的距离以像素为单位，并且可能绑定到后面的代码，以便我可以在运行时更改它.

这是我的第一次尝试，但可能我使用了错误的控件。

<Canvas  Panel.ZIndex="0"  x:Name="TileCanvas">
    <Grid Panel.ZIndex="5">
        <Rectangle Width="{Binding ElementName=TileCanvas, Path=ActualWidth}" Height="{Binding ElementName=TileCanvas, Path=ActualHeight}" 
            Stroke="Black" StrokeThickness="0"> 

            <Rectangle.Fill>
                <DrawingBrush ViewportUnits="Absolute" TileMode="Tile">
                    <DrawingBrush.Viewport>
                        <MultiBinding Converter="{StaticResource RectConverter}">
                            <...>
                        </MultiBinding>
                    </DrawingBrush.Viewport>
                    <DrawingBrush.Drawing>
                        <DrawingGroup>
                            <GeometryDrawing Geometry="M0,0 L1,0 1,0.1, 0,0.1Z" Brush="Green" RenderOptions.BitmapScalingMode="NearestNeighbor"/>
                            <GeometryDrawing Geometry="M0,0 L0,1 0.1,1, 0.1,0Z" Brush="Green" RenderOptions.BitmapScalingMode="NearestNeighbor"/>
                        </DrawingGroup>
                    </DrawingBrush.Drawing>
                    <DrawingBrush.Transform>
                        <ScaleTransform ScaleX="1" ScaleY="1"/>
                    </DrawingBrush.Transform>
                </DrawingBrush>

            </Rectangle.Fill>

        </Rectangle>
    </Grid>

此解决方案允许我改变每个图块的大小，但是：

我没找到固定线宽为一个像素的方法
当我用转换器更改 DrawingBrush.Viewport 时，我确实放大了瓷砖（太棒了！）但是线条的粗细增加了（嘘）。

Answer 1

我有一个非常相似的问题。您可以使用单个几何体，如果您想避免厚度 increase\decrease，则必须通过 thickness = 1/tileWidth 之类的比率来表示瓷砖宽度的厚度。如果您使用 WPF 控件更改图块的大小，则可以使用转换器相应地更新厚度。

<GeometryDrawing Geometry="M10,0 L10,10 0,10 10,10 10,0Z"  Brush="Green" RenderOptions.BitmapScalingMode="NearestNeighbor"/>
    <GeometryDrawing.Pen>
        <Pen Thickness="{Binding ElementName=[TILE SIZE CONTROL VAL], Converter={StaticResource RatioConverter}}"/>
    </GeometryDrawing.Pen>
</GeometryDrawing>

public object Convert(object value, Type targetType, object parameter, CultureInfo culture)
{
    return (1 / (double)value);
}

WPF 像素网格线

WPF pixel gridlines

c#

wpf

drawingbrush