Reputation: 165
Please help me make a circle with a thickness of 2. I was able to draw a filled circle (code below). How do I make it unfilled with a thickness of 2?
M 0,0 A 180,180 180 1 1 1,1 Z
Upvotes: 2
Views: 3015
Reputation: 1146
I have attached two images; one is the actual control image (radio button), and a graphic explanation of the Path/Data.
<Border x:Name="Border"
Width="24"
Height="24"
CornerRadius="10"
BorderBrush="{StaticResource Light5Brush}"
Background="White"
Margin="0"
BorderThickness="2">
<Grid>
<Path x:Name="CheckMark"
Visibility="Collapsed"
Width="18"
Height="18"
SnapsToDevicePixels="False"
StrokeThickness="3"
Fill="{StaticResource PrimaryBrush}"
Stroke="{StaticResource PrimaryBrush}"
Data="M 9,2 A 7,7 180 1 1 9 16 A 7,7 180 1 1 9 2 Z">
</Path>
Upvotes: 0
Reputation: 128013
You can't create a full circle with path markup because start and end point would be identical. You can only draw at least two circle segments, e.g. two semi-circles:
<Path Stroke="Blue" StrokeThickness="2"
Data="M 0,100 A 100,100 0 1 1 200,100 A 100,100 0 1 1 0,100"/>
You may perhaps better use an EllipseGeometry:
<Path Stroke="Blue" StrokeThickness="2">
<Path.Data>
<EllipseGeometry Center="100,100" RadiusX="100" RadiusY="100"/>
</Path.Data>
</Path>
Upvotes: 5