仅在角和 space 之间制作边框
Make a border with only the corners and space betwen
我不知道如何解释标题,但任何人都知道如何在没有网格的情况下制作红色角。如果可能,只使用 BorderBrush ?
编辑:
<Grid>
<Grid.Resources>
<Style TargetType="{x:Type Path}">
<Setter Property="Stroke" Value="#FF006E8C"/>
<Setter Property="StrokeThickness" Value="1"/>
<Setter Property="RenderOptions.EdgeMode" Value="Aliased"/>
</Style>
</Grid.Resources>
<Canvas Width="8" Height="8" ClipToBounds="True" HorizontalAlignment="Left" VerticalAlignment="Top">
<Path Canvas.Left="1" Canvas.Top="1" Data="M0,8L0,0L8,0"/>
</Canvas>
<Canvas Width="8" Height="8" ClipToBounds="True" HorizontalAlignment="Right" VerticalAlignment="Top">
<Path Canvas.Left="0" Canvas.Top="1" Data="M0,0L8,0L8,8"/>
</Canvas>
<Canvas Width="8" Height="8" ClipToBounds="True" HorizontalAlignment="Left" VerticalAlignment="Bottom">
<Path Canvas.Left="1" Canvas.Top="0" Width="8" Height="8" Data="M8,8L0,8L0,0"/>
</Canvas>
<Canvas Width="8" Height="8" ClipToBounds="True" HorizontalAlignment="Right" VerticalAlignment="Bottom">
<Path Canvas.Left="0" Canvas.Top="0" Data="M8,0L8,8L0,8"/>
</Canvas>
</Grid>
如果您不介意使用 Grid
,如示例代码所示,您可以使用 Border
控件并根据它们代表的角修改它们的 BorderThickness
:
<Grid>
<Border
VerticalAlignment="Top"
HorizontalAlignment="Left"
BorderThickness="1,1,0,0"
BorderBrush="Red"
Width="10" Height="10"
/>
<Border
VerticalAlignment="Top"
HorizontalAlignment="Right"
BorderThickness="0,1,1,0"
BorderBrush="Red"
Width="10" Height="10"
/>
<Border
VerticalAlignment="Bottom"
HorizontalAlignment="Left"
BorderThickness="1,0,0,1"
BorderBrush="Red"
Width="10" Height="10"
/>
<Border
VerticalAlignment="Bottom"
HorizontalAlignment="Right"
BorderThickness="0,0,1,1"
BorderBrush="Red"
Width="10" Height="10"
/>
<TextBlock
Text="Add"
HorizontalAlignment="Center"
VerticalAlignment="Center"
/>
</Grid>
我不知道如何解释标题,但任何人都知道如何在没有网格的情况下制作红色角。如果可能,只使用 BorderBrush ?
编辑:
<Grid>
<Grid.Resources>
<Style TargetType="{x:Type Path}">
<Setter Property="Stroke" Value="#FF006E8C"/>
<Setter Property="StrokeThickness" Value="1"/>
<Setter Property="RenderOptions.EdgeMode" Value="Aliased"/>
</Style>
</Grid.Resources>
<Canvas Width="8" Height="8" ClipToBounds="True" HorizontalAlignment="Left" VerticalAlignment="Top">
<Path Canvas.Left="1" Canvas.Top="1" Data="M0,8L0,0L8,0"/>
</Canvas>
<Canvas Width="8" Height="8" ClipToBounds="True" HorizontalAlignment="Right" VerticalAlignment="Top">
<Path Canvas.Left="0" Canvas.Top="1" Data="M0,0L8,0L8,8"/>
</Canvas>
<Canvas Width="8" Height="8" ClipToBounds="True" HorizontalAlignment="Left" VerticalAlignment="Bottom">
<Path Canvas.Left="1" Canvas.Top="0" Width="8" Height="8" Data="M8,8L0,8L0,0"/>
</Canvas>
<Canvas Width="8" Height="8" ClipToBounds="True" HorizontalAlignment="Right" VerticalAlignment="Bottom">
<Path Canvas.Left="0" Canvas.Top="0" Data="M8,0L8,8L0,8"/>
</Canvas>
</Grid>
如果您不介意使用 Grid
,如示例代码所示,您可以使用 Border
控件并根据它们代表的角修改它们的 BorderThickness
:
<Grid>
<Border
VerticalAlignment="Top"
HorizontalAlignment="Left"
BorderThickness="1,1,0,0"
BorderBrush="Red"
Width="10" Height="10"
/>
<Border
VerticalAlignment="Top"
HorizontalAlignment="Right"
BorderThickness="0,1,1,0"
BorderBrush="Red"
Width="10" Height="10"
/>
<Border
VerticalAlignment="Bottom"
HorizontalAlignment="Left"
BorderThickness="1,0,0,1"
BorderBrush="Red"
Width="10" Height="10"
/>
<Border
VerticalAlignment="Bottom"
HorizontalAlignment="Right"
BorderThickness="0,0,1,1"
BorderBrush="Red"
Width="10" Height="10"
/>
<TextBlock
Text="Add"
HorizontalAlignment="Center"
VerticalAlignment="Center"
/>
</Grid>