如何在WPF画布上绘制网格线？

如何解决如何在WPF画布上绘制网格线？

| 我需要在WPF的画布上构建功能图网格线：

void DrawGridLine(double startX,double startY,double stepX,double stepY,double slop,double width,double height)
{
    // How to implement draw gridline here?
}

我将如何处理？

解决方法

您实际上不需要使用WPF来“绘制”任何东西。如果要绘制线，请使用适当的几何形状进行绘制。就您而言，这可能确实很简单。您只是在绘制网格，所以可以创建一个create1ѭ来绘制单个网格正方形并将其平铺以填充其余部分。要绘制您的图块，您可以将其视为绘制X \。因此，有一个20x10磁贴（对应于stepX和stepY）：（例如，斜率“ 5”是多余的，因为您已经有了水平和垂直步长）

<DrawingBrush x:Key=\"GridTile\" Stretch=\"None\" TileMode=\"Tile\"
              Viewport=\"0,0 20,10\" ViewportUnits=\"Absolute\">
                  <!-- ^^^^^^^^^^^ set the size of the tile-->
    <DrawingBrush.Drawing>
        <GeometryDrawing>
            <GeometryDrawing.Geometry>
                <!-- draw a single X -->
                <GeometryGroup>
                    <!-- top-left to bottom-right -->
                    <LineGeometry StartPoint=\"0,0\" EndPoint=\"20,10\" />

                    <!-- bottom-left to top-right -->
                    <LineGeometry StartPoint=\"0,10\" EndPoint=\"20,0\" />
                </GeometryGroup>
            </GeometryDrawing.Geometry>
            <GeometryDrawing.Pen>
                <!-- set color and thickness of lines -->
                <Pen Thickness=\"1\" Brush=\"Black\" />
            </GeometryDrawing.Pen>
        </GeometryDrawing>
    </DrawingBrush.Drawing>
</DrawingBrush>

这需要画线。现在要能够在网格中从边缘偏移地绘制它们，您需要使用另一只画笔在其中绘制具有所需尺寸的矩形，并用瓷砖填充。因此，以with10ѭ，height，130x120为起始位置of7 of（对应于startX和startY）：

<DrawingBrush x:Key=\"OffsetGrid\" Stretch=\"None\" AlignmentX=\"Left\" AlignmentY=\"Top\">
    <DrawingBrush.Transform>
        <!-- set the left and top offsets -->
        <TranslateTransform X=\"30\" Y=\"45\" />
    </DrawingBrush.Transform>
    <DrawingBrush.Drawing>
        <GeometryDrawing Brush=\"{StaticResource GridTile}\" >
            <GeometryDrawing.Geometry>
                <!-- set the width and height filled with the tile from the origin -->
                <RectangleGeometry Rect=\"0,0 130,120\" />
            </GeometryDrawing.Geometry>
        </GeometryDrawing>
    </DrawingBrush.Drawing>
</DrawingBrush>

然后最后要使用它，只需将其设置为网格（或其他面板）的背景即可：

<Grid Background=\"{StaticResource OffsetGrid}\">
    <!-- ... -->
</Grid>

最终结果如下：如果要动态生成笔刷，这是基于上述XAML的等效函数：

static Brush CreateGridBrush(Rect bounds,Size tileSize)
{
    var gridColor = Brushes.Black;
    var gridThickness = 1.0;
    var tileRect = new Rect(tileSize);

    var gridTile = new DrawingBrush
    {
        Stretch = Stretch.None,TileMode = TileMode.Tile,Viewport = tileRect,ViewportUnits = BrushMappingMode.Absolute,Drawing = new GeometryDrawing
        {
            Pen = new Pen(gridColor,gridThickness),Geometry = new GeometryGroup
            {
                Children = new GeometryCollection
                {
                    new LineGeometry(tileRect.TopLeft,tileRect.BottomRight),new LineGeometry(tileRect.BottomLeft,tileRect.TopRight)
                }
            }
        }
    };

    var offsetGrid = new DrawingBrush
    {
        Stretch = Stretch.None,AlignmentX = AlignmentX.Left,AlignmentY = AlignmentY.Top,Transform = new TranslateTransform(bounds.Left,bounds.Top),Drawing = new GeometryDrawing
        {
            Geometry = new RectangleGeometry(new Rect(bounds.Size)),Brush = gridTile
        }
    };

    return offsetGrid;
}