WPF以像素为单位的平铺背景

Question

我试图平铺我的画布相对于像素大小的背景。这是我目前有...

我希望它看起来像这样... 我只是想创建使用代码背景平铺网格。我不想使用PNG或图像文件来创建网格。

<Window x:Class="graph_view.MainWindow" 
     xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation" 
     xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml" 
     xmlns:d="http://schemas.microsoft.com/expression/blend/2008" 
     xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006" 
     xmlns:local="clr-namespace:graph_view" 
     mc:Ignorable="d" 
     Title="MainWindow" Height="200" Width="200"> 
    <Grid > 
     <Grid.RowDefinitions> 
      <RowDefinition Height="20"/> 
      <RowDefinition Height="*"/> 
     </Grid.RowDefinitions> 

     <TextBox Grid.Row="0" Text="10"></TextBox> 
     <Canvas Grid.Row="1"> 
      <Canvas.Background> 
       <DrawingBrush TileMode="Tile" Viewbox="0,0,20,20" ViewportUnits="RelativeToBoundingBox" AlignmentX="Left" AlignmentY="Top"> 
        <DrawingBrush.Drawing> 
         <GeometryDrawing Brush="sc# 1.0, 0.02, 0.02, 0.02"> 
          <GeometryDrawing.Geometry> 
           <GeometryGroup> 
            <RectangleGeometry Rect="0,0,20,20" /> 
           </GeometryGroup> 
          </GeometryDrawing.Geometry> 
          <GeometryDrawing.Pen> 
           <Pen Thickness="1" Brush="red"/> 
          </GeometryDrawing.Pen> 
         </GeometryDrawing> 
        </DrawingBrush.Drawing> 
       </DrawingBrush> 
      </Canvas.Background> 
     </Canvas> 
    </Grid> 
</Window> 

Answer 1

<Canvas> 
    <Canvas.Background> 
     <VisualBrush TileMode="Tile" Stretch="Uniform" Viewport="10,10,10,10" ViewportUnits="Absolute"> 
      <VisualBrush.Visual> 
       <Rectangle Width="10" Height="10" Fill="Black" Stroke="Red"/> 
      </VisualBrush.Visual> 
     </VisualBrush> 
    </Canvas.Background> 
</Canvas> 

变化矩形StrokeThickness值更厚度电网。将ViewPort和Width和Height更改为更大的网格。

<Canvas > 
    <Canvas.Background> 
     <VisualBrush TileMode="Tile" Stretch="Uniform" Viewport="20,20,20,20" ViewportUnits="Absolute"> 
      <VisualBrush.Visual> 
       <Rectangle Width="20" Height="20" Fill="Black" Stroke="Red" StrokeThickness="0.1"/> 
      </VisualBrush.Visual> 
     </VisualBrush> 
    </Canvas.Background> 
</Canvas> 

Answer 2

名在XAML网格。

在您的代码隐藏文件中，创建一个循环实际网格宽度并循环网格实际高度的方法。

在宽度循环内，您将在网格中添加一个新列，高度循环将添加一个新行，然后添加一个带有黑色背景和红色边框的新边框。

在init之后调用构造函数中的方法。

只需将宽度传递给提供网格行和列宽度和高度属性的方法即可。

这也可以用XAML很容易地完成。