绘制虚线边框

Question

我正在将应用程序从 WPF 移植到 UWP。到目前为止，我一直使用以下代码绘制虚线边框。

<Border.BorderBrush>
    <VisualBrush>
        <VisualBrush.Visual>
            <Rectangle StrokeDashArray="1.0 1.0"
                       Stroke="{StaticResource ListBorderColor}"
                       StrokeThickness="2"
                       RadiusX="{Binding RelativeSource={RelativeSource AncestorType={x:Type Border}}, Path=CornerRadius.TopRight}"
                       RadiusY="{Binding RelativeSource={RelativeSource AncestorType={x:Type Border}}, Path=CornerRadius.BottomLeft}"
                       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>

不幸的是，此代码在 UWP 中不再起作用。我尝试了以下代码，但从视觉角度来看结果不一样

<Border.BorderBrush>
     <LinearGradientBrush StartPoint="0,0" EndPoint="2,0"
                          SpreadMethod="Repeat" MappingMode="Absolute">
         <GradientStop Color="Transparent" Offset="0" />
         <GradientStop Color="Transparent" Offset="0.499" />
         <GradientStop Color="#999" Offset="0.5" />
     </LinearGradientBrush>
</Border.BorderBrush>

有谁知道如何在 UWP 中实现均匀的圆角边框？

Answer 1

虽然 Romasz 解决方案很好，但也有一种方法可以在没有模板化控件的情况下实现这一点。

下面是我会怎么做。

<Grid Background="{StaticResource ApplicationPageBackgroundThemeBrush}">
    <Ellipse Fill="{StaticResource ApplicationPageBackgroundThemeBrush}" HorizontalAlignment="Stretch" VerticalAlignment="Stretch" 
             Height="100" Width="100"
             StrokeDashCap="Flat" StrokeDashOffset="1.5" 
             StrokeDashArray="1" Stroke="{StaticResource AppBarForeground}" StrokeThickness="3" >
    </Ellipse>
    <TextBlock Text="Drag Here" HorizontalAlignment="Center" VerticalAlignment="Center" Foreground="{StaticResource AppBarForeground}"/>
</Grid>