代码之家 › 专栏 › 技术社区 › Pygmy

带变换的画布-绘制网格的最佳方法是什么

wpf-4.0 tile lines grid canvas

Pygmy · 技术社区 · 15 年前

我有一个WPF画布,我可以缩放,滚动等。现在我想在上面画(平铺)网格线-最好是根据比例,这意味着当你缩小旧的网格线时会逐渐消失,而新的(更大的比例,但由于缩放看起来是一样的)网格线会逐渐消失。

我听到有人喊“蒂莱布鲁什!”,但我不能用谷歌搜索任何例子。

有谁能给我指一个正确的方向-不仅仅是在tilebrush的MSDN页面,而是在我的可缩放画布上如何有效地绘制网格线?:)

1 回复 | 直到 15 年前

Ray Burns 15 年前

最简单的解决方案是使用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可以获得更有效的解决方案,但使用绘图并不是那么简单。这将使用绘图画笔绘制网格线:

<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

如果您真的想“淡入”网格线,可以在主画布下使用两个画布,并将更细网格线上的不透明度设置为使用精确缩放的函数。