代码之家 › 专栏 › 技术社区 › Edward Tanguay

如何在Silverlight中的border元素上创建点式边框?

dotted-line border silverlight .net c#

7

Edward Tanguay · 技术社区 · 15 年前

如何使此border Silverlight元素的下边框具有红色 星罗棋布的 红色里面固体线路?

Border border = new Border();
border.CornerRadius = new CornerRadius(5);
border.BorderThickness = new Thickness(0, 0, 0, 1);
border.BorderBrush = new SolidColorBrush(Colors.Red);

2 回复 | 直到 12 年前

1

12

Stephan 15 年前

你能用网格替换边框并给它一个填满整个区域的矩形吗?

<Rectangle Stretch="Fill" RadiusX="10" RadiusY="10" StrokeDashArray="10, 2" Stroke="Black" Fill="White" />

strokedHasArray可以用来绘制点,但边框没有这样的属性。

编辑:

既然我注意到你只是在打底边,你就可以这样做。

<Border Width="100" Height="100" Background="Blue" BorderThickness="0,0,0,1">
    <Border.BorderBrush>
        <LinearGradientBrush StartPoint="0,0" EndPoint=".2,0" SpreadMethod="Repeat" >
            <GradientStopCollection>
                <GradientStop Color="Transparent" Offset="0" />
                <GradientStop Color="Transparent" Offset="0.3" />
                <GradientStop Color="Red" Offset="0.3" />
                <GradientStop Color="Red" Offset="0.6" />
                <GradientStop Color="Transparent" Offset="0.6" />
                <GradientStop Color="Transparent" Offset="1" />
            </GradientStopCollection>
        </LinearGradientBrush>
    </Border.BorderBrush>
</Border>

调整 Offset 中间两个渐变停止点,用于调整红点/短划线的宽度。您可能还需要调整端点,使其以所需的间隔重复。

2

6

Drew Noakes 13 年前

斯蒂芬的回答很有帮助。但是,如果希望在调整大小时不拉伸的简单虚线,请尝试此XAML:

<!-- Horizontal dotted line -->
<Border HorizontalAlignment="Stretch" Height="1" BorderThickness="0,0,0,1">
  <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>                              
</Border>

下面是垂直虚线的另一种选择:

<!-- Vertical dotted line -->
<Border VerticalAlignment="Stretch" Width="1" BorderThickness="0,0,1,0">
  <Border.BorderBrush>
    <LinearGradientBrush StartPoint="0,0" EndPoint="0,2"
                         SpreadMethod="Repeat" MappingMode="Absolute">
        <GradientStop Color="Transparent" Offset="0" />
        <GradientStop Color="Transparent" Offset="0.499" />
        <GradientStop Color="#999" Offset="0.5" />
    </LinearGradientBrush>
  </Border.BorderBrush>                              
</Border>

巧合的是,如果你在一个不是1像素宽/高的区域使用这种刷子,那么你会得到一个漂亮的细条纹图案。