WPF Border设置虚线边框

WPF Border设置虚线边框

Border默认显示实线边框,我们也可以其BorderBrush属性来自定义样式实现虚线边框;
方法一:推荐

<Border BorderThickness="1" Margin="20">
            <Border.BorderBrush>
                <VisualBrush>
                    <VisualBrush.Visual>
                        <Rectangle StrokeDashArray="4 2" Stroke="Gray" StrokeThickness="1"
                  Width="{Binding RelativeSource={RelativeSource AncestorType={x:Type Border}}, Path=ActualWidth}"
                  Height="{Binding RelativeSource={RelativeSource AncestorType={x:Type Border}}, Path=ActualHeight}"/>
                    </VisualBrush.Visual>
                </VisualBrush>
            </Border.BorderBrush>

            <TextBlock Text="测试" />
        </Border>

在这里插入图片描述
方法二:

<Border BorderThickness="1" Margin="20">
            <Border.BorderBrush>
                <DrawingBrush Viewport="0,0,8,8" ViewportUnits="Absolute" TileMode="Tile">
                    <DrawingBrush.Drawing>
                        <DrawingGroup>
                            <GeometryDrawing Brush="Black">
                                <GeometryDrawing.Geometry>
                                    <GeometryGroup>
                                        <RectangleGeometry Rect="0,0,50,50" />
                                        <RectangleGeometry Rect="50,50,50,50" />
                                    </GeometryGroup>
                                </GeometryDrawing.Geometry>
                            </GeometryDrawing>
                        </DrawingGroup>
                    </DrawingBrush.Drawing>
                </DrawingBrush>
            </Border.BorderBrush>
            <TextBlock Text="Content Goes Here!" Margin="5"/>
        </Border>

其他:

<Grid Margin="20">
            <Grid.RowDefinitions>
                <RowDefinition Height="100"/>
            </Grid.RowDefinitions>
            <Grid.ColumnDefinitions>
                <ColumnDefinition Width="100"/>
            </Grid.ColumnDefinitions>
            <Rectangle RadiusX="5" RadiusY="5" Fill="White" Stroke="Gray" StrokeDashArray="4,2"/>
            <TextBlock Padding = "4,2" Text="测试"/>
        </Grid>

在这里插入图片描述