在WPF中創建對角線圖案

Question

我想在WPF中創建對角線圖案。我使用下面的XAML代碼來生成它：

<VisualBrush 
    x:Key="HatchBrushnew" 
    TileMode="Tile" Viewport="0,0,30,30" 
    ViewportUnits="Absolute" Viewbox="0,0,30,30"  
    ViewboxUnits="Absolute"> 
     <VisualBrush.Visual> 
      <Canvas> 

       <Path Stroke="Gray" StrokeThickness="0.1cm" > 
        <Path.Data> 
         <LineGeometry StartPoint="0,0" EndPoint="30,30" /> 
        </Path.Data> 
       </Path> 

      </Canvas> 
     </VisualBrush.Visual> 
    </VisualBrush> 

但是兩條線之間的與該圖案填充形狀後，我得到小的間隙。任何人都可以提出一種避免這種小差距的方法嗎？

Answer 1

一個DrawingBrush會比VisualBrush簡單得多。

除了中央對角線，這一個繪製了兩個附加的行（這當然可以更短），以覆蓋刷瓦片的頂部右側和底部左側角：

<DrawingBrush x:Key="HatchBrush" TileMode="Tile" 
       Viewport="0,0,30,30" ViewportUnits="Absolute" 
       Viewbox="0,0,30,30" ViewboxUnits="Absolute"> 
    <DrawingBrush.Drawing> 
     <GeometryDrawing> 
      <GeometryDrawing.Pen> 
       <Pen Brush="Black" Thickness="5"/> 
      </GeometryDrawing.Pen> 
      <GeometryDrawing.Geometry> 
       <Geometry>M0,0 L30,30 M15,-15 L45,15 M-15,15 L15,45</Geometry> 
      </GeometryDrawing.Geometry> 
     </GeometryDrawing> 
    </DrawingBrush.Drawing> 
</DrawingBrush> 

---

如Balázs給出的答案所示，您也可以設置Brush的Transform屬性，並使用例如單個垂直LineGeometry：

<DrawingBrush x:Key="HatchBrush" TileMode="Tile" 
       Viewport="0,0,30,30" ViewportUnits="Absolute" 
       Viewbox="0,0,30,30" ViewboxUnits="Absolute"> 
    <DrawingBrush.Transform> 
     <RotateTransform Angle="45"/> 
    </DrawingBrush.Transform> 
    <DrawingBrush.Drawing> 
     <GeometryDrawing> 
      <GeometryDrawing.Pen> 
       <Pen Brush="Black" Thickness="5"/> 
      </GeometryDrawing.Pen> 
      <GeometryDrawing.Geometry> 
       <LineGeometry StartPoint="0,15" EndPoint="30,15"/> 
      </GeometryDrawing.Geometry> 
     </GeometryDrawing> 
    </DrawingBrush.Drawing> 
</DrawingBrush> 

Answer 2

你可以使用VisualBrush.Transform：

<VisualBrush x:Key="HatchBrushnew" 
    TileMode="Tile" 
    Viewport="0,0,30,30" 
    ViewportUnits="Absolute" 
    Viewbox="0,0,30,30"  
    ViewboxUnits="Absolute"> 
    <VisualBrush.Transform> 
     <RotateTransform Angle="135" CenterX=".5" CenterY=".5" /> 
    </VisualBrush.Transform> 
    <VisualBrush.Visual> 
     <Canvas> 
     <Path Stroke="Gray" StrokeThickness="0.1cm" > 
      <Path.Data> 
      <LineGeometry StartPoint="15,0" EndPoint="15,30" /> 
      </Path.Data> 
     </Path> 
     </Canvas> 
    </VisualBrush.Visual> 
    </VisualBrush> 

，其結果是：

這似乎有點稀疏，你可以玩弄修復該問題的值爲VisualBrush.Viewport。由於我們正在旋轉135度，因此間距實際上比原始間距大2倍，您可以將其用作提示。