Question

我有一个WPF画布，我可以缩放，滚动等等。现在我想在其上绘制（平铺）网格线 - 最好取决于比例尺，这意味着当你缩小时，旧的网格线逐渐消失，新的（更大的比例，但由于变焦看似相同）网格线渐渐消失。

我听说有些人大喊“Tilebrush！”，但我不能谷歌任何一个例子。

任何人都能指出我正确的方向 - 不仅仅是瓷砖刷的MSDN页面，而是如何在我的可缩放画布上有效地绘制网格线？：）

Answer 1

最简单的解决方案是使用VisualBrush绘制网格线：

<Canvas>
  <Canvas.Background>
    <VisualBrush TileMode="Tile" Stretch="Fill" Viewport="0 0 50 50" ViewportUnits="Absolute" ViewboxUnits="Absolute" >
      <VisualBrush.Visual>
        <Grid>
          <Rectangle Width="1" Height="0.03" Fill="Gray" HorizontalAlignment="Left" VerticalAlignment="Top" />
          <Rectangle Height="1" Width="0.03" Fill="Gray" HorizontalAlignment="Left" VerticalAlignment="Top" />
        </Grid>
      </VisualBrush.Visual>
    </VisualBrush>
  </Canvas.Background>
</Canvas>

您可以通过调整视口坐标和网格线宽度来调整矩形高度和宽度（通常为0.03）来更改网格线。

使用DrawingBrush可以获得更有效的解决方案，但使用绘图并不是那么简单。这使用DrawingBrush绘制网格线：

<Canvas>
  <Canvas.Background>
    <DrawingBrush TileMode="Tile" Stretch="Fill" Viewport="0 0 50 50" ViewportUnits="Absolute" ViewboxUnits="Absolute" >
      <DrawingBrush.Drawing>
        <GeometryDrawing Geometry="M0,0 L0,1 0.03,1 0.03,0.03 1,0.03 1,0 Z" Brush="Gray" />
      </DrawingBrush.Drawing>
    </DrawingBrush>
  </Canvas.Background>
</Canvas>

要在缩小时更改网格线，只需在缩放更改时重新计算它们。您可以使用此代码确定给定视觉的放大方式：

var zoom = visual
             .TransformToAncestor(Window.FromVisual(visual))
             .Transform(new Point(1,1));

if(zoom.X>10 || zoom.Y>10)
  // Use finer gridlines
else
  // Use coarser gridlines

如果您真的想要“淡入”网格线，可以在主画布下使用两个Canvasas，并根据使用的精确缩放设置更精细网格线上的不透明度。

具有变换的画布 - 绘制网格的最佳方式是什么

1 个答案: