Question

我试图为ListView创建一个graphpaper背景几个小时。为了更好地理解，我将描述我的意思。我想用XAML实现它。到目前为止，我完成了10px边距的小矩形，但我需要另一个网格，更大的线条，边距为100px，我不太了解路径标记语言。

这是我的代码：

    <DrawingBrush x:Key="ListBackgroundBrush" Viewport="0,0,10,10" ViewportUnits="Absolute" TileMode="Tile">
    <DrawingBrush.Drawing>
        <DrawingGroup>
            <!--  Linien alle 10 Pixel -->
            <GeometryDrawing Geometry="M0,0 L1,0 1,0.1, 0,0.1Z" Brush="#EAEAEA" /><!-- Wagerecht-->
            <GeometryDrawing Geometry="M0,0 L0,1 0.1,1, 0.1,0Z" Brush="#EFEFEF" /><!--  Senkrecht -->

            <!-- Linien alle 100 Pixel Senkrecht  -->
            <GeometryDrawing Geometry="M0,0 L1,0 1,0.2, 0,0.2Z" Brush="Red" />
            <!-- Linien alle 100 Pixel Wagerecht -->
            <GeometryDrawing Geometry="M0,0 L1,0 1,0.2, 0,0.2Z" Brush="Green" />
        </DrawingGroup>
    </DrawingBrush.Drawing>
</DrawingBrush>    
<ControlTemplate TargetType="ListView">
                <Border CornerRadius="2" Background="{StaticResource ListBackgroundBrush}" BorderThickness="1,1,1,1" BorderBrush="#E1E1E1"  SnapsToDevicePixels="True">
</ControlTemplate>

这就是我到目前为止所做的，但我不知道如何修改几何参数以使线条之间的边距更大。

我会对每个答案感到高兴！

Answer 1

GeometryDrawing.Brush是填充或背景颜色。 GeometryDrawing.Pen是线条颜色。您似乎打算为Graph纸张的线条着色，但是您使用的是错误的属性。当我修复它时，我注意到你的10px网格线不会在你想要的100px网格线下重复，所以这就是我提出的解决方案。

<DrawingBrush x:Key="ListBackgroundBrush" Viewport="0,0,100,100" ViewportUnits="Absolute" TileMode="Tile">
    <DrawingBrush.Drawing>
        <DrawingGroup>

            <!-- Geometry for the 10px squares -->
            <GeometryDrawing Brush="White">
                <GeometryDrawing.Geometry>
                    <GeometryGroup>
                        <PathGeometry  Figures="
                          M10,0 L10,100 
                          M20,0 L20,100
                          M30,0 L30,100 
                          M40,0 L40,100
                          M50,0 L50,100 
                          M60,0 L60,100
                          M70,0 L70,100 
                          M80,0 L80,100
                          M90,0 L90,100

                          M0,10 L100,10 
                          M0,20 L100,20
                          M0,30 L100,30 
                          M0,40 L100,40
                          M0,50 L100,50 
                          M0,60 L100,60
                          M0,70 L100,70 
                          M0,80 L100,80
                          M0,90 L100,90"  />
                    </GeometryGroup>
                </GeometryDrawing.Geometry>
                <GeometryDrawing.Pen>
                    <Pen Thickness="1" Brush="Green" />
                </GeometryDrawing.Pen>
            </GeometryDrawing>

            <!-- Geometry for the 100px squares -->
            <GeometryDrawing Brush="Transparent">
                <GeometryDrawing.Geometry>
                    <GeometryGroup>
                        <PathGeometry  Figures="M0,0 L100,0 L100,100" />
                    </GeometryGroup>
                </GeometryDrawing.Geometry>
                <GeometryDrawing.Pen>            
                    <Pen Thickness="3" Brush="Green" />
                </GeometryDrawing.Pen>
            </GeometryDrawing>

        </DrawingGroup>
    </DrawingBrush.Drawing>
</DrawingBrush> 

<Grid Background="{StaticResource ListBackgroundBrush}" />

使用XAML和路径标记语言的Graphpaper背景

1 个答案: