我需要在 WPF 中的 Canvas 上构建函数绘制网格线:
void DrawGridLine(double startX, double startY, double stepX, double stepY,
double slop, double width, double height)
{
// How to implement draw gridline here?
}
我该怎么做?
最佳答案
您实际上不必使用 WPF“绘制”任何东西。如果要绘制线条,请使用适当的几何图形来绘制它们。
在您的情况下,它可能真的很简单。您只是在绘制一个网格,因此您可以创建一个 DrawingBrush
来绘制一个网格正方形并将其平铺以填充其余部分。要绘制瓷砖,您可以将其视为绘制 X。所以要有一个 20x10
tile(对应于 stepX
和 stepY
):
(另外,斜率 slop
是多余的,因为您已经有了水平和垂直步长)
<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>
负责绘制线条。现在为了能够在您的网格中从边缘绘制它们的偏移量,您需要有另一个画笔,您可以在其中绘制一个具有所需尺寸的矩形,并填充您的瓷砖。所以要有一个 (30, 45)
的起始位置(对应于 startX
和 startY
)和 width
和高度
,130x120
:
<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;
}
关于c# - 如何在 WPF Canvas 上绘制网格线?,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/6434284/