0

I want to create a shape which kinda looks like a match. The head is an Ellipse with a solid Stroke and a somewhat transparent Fill. The stick is a border with a solid BorderBrush and a somewhat transparent Background.

I can combine those two elements and it actually looks fine. The issue is, that the Fill of the Ellipse is transparent so you can see the beginning of the border (red part in the image).

Now my question is: How can I clip this part of my Border?

maybe someone can edit this post so the images can be inline

Example Code

<Grid>
    <Ellipse Fill="#33000000"
             Stroke="#FF000000"
             StrokeThickness="2"
             HorizontalAlignment="Left" VerticalAlignment="Bottom"
             Width="15" Height="15" />

    <Border Height="9" Margin="10 0 0 3"
            HorizontalAlignment="Stretch" VerticalAlignment="Bottom"
            BorderThickness="0 2"
            BorderBrush="#FF000000"
            Background="#33000000" />
</Grid>
cgdkkblvjxlkkxpbde
  • 9
  • 1
  • You will need to construct the non-regular area using geometry operations, and create a geometry shape from that, rather than attempting to combine higher-level shape objects directly. See marked duplicate. – Peter Duniho Mar 27 '20 at 17:24
  • @PeterDuniho hm okay. How do I create a `BorderThicknes="0 2"` equivalent though? `Path.StrokeThickness` is just a `double` – cgdkkblvjxlkkxpbde Mar 30 '20 at 10:24
  • Obviously, you will need to construct the "border" part of your shape using multiple paths so that you can specify the parts the way you need. – Peter Duniho Mar 30 '20 at 15:06

0 Answers0