I am trying to create a button that has two triangles. One in the top right corner and one on the bottom left corner as shown below. And each would be displayed based on a boolean value (for example, ShowBottoCyan or ShowUpperGreen). I was hoping to do this in .xaml
I am using C#. I was trying polygons but having trouble understanding them.
I am trying to create a button that has two triangles. One in the top right corner and one on the bottom left corner as shown below. And each would be displayed based on a boolean value (for example, ShowBottoCyan or ShowUpperGreen). I was hoping to do this in .xaml
I am using C#. I was trying polygons but having trouble understanding them.
Share Improve this question edited Apr 1 at 7:23 Uwe Keim 40.8k61 gold badges190 silver badges304 bronze badges asked Mar 31 at 20:44 John GroveJohn Grove 557 bronze badges 1- You can use a LinearGradientBrush for the background (and even animate it). The "offsets" are little tricky ("off center"); but satisfying once you get them right. – Gerry Schmitz Commented Apr 1 at 17:53
1 Answer
Reset to default 3You need the following Polygon
elements in the Button
element in your XAML code:
<Polygon x:Name="TopTriangle"
Points="0,0 15,0 15,15"
Fill="Green"
Stroke="Cyan"
HorizontalAlignment="Right"
VerticalAlignment="Top"
Margin="3"/>
<Polygon x:Name="BottomTriangle"
Points="0,0 0,15 15,15"
Fill="Cyan"
Stroke="Cyan"
HorizontalAlignment="Left"
VerticalAlignment="Bottom"
Margin="3"/>
Consider inverted cartesian product, top triangle points are:
And bottom triangle points are: