XAML Ellipse

The element of XAML is used to draw and fill an ellipse. This article shows how to use the Ellipse element to draw and fill ellipse in XAML.
  • 3304
The <Ellipse /> element of XAML is used to draw and fill an ellipse and circle (ellipse with equal height and width). The Height and Width attributes represent the height and width of the ellipse. The Stroke and StrokeThickness represents the color and thickness of the ellipse boundary. The Fill attribute fills the ellipse with a color.

The following code draws an ellipse with height 100 and width 300.

<Ellipse Name="MyEllipse" Height="100" Width="300" StrokeThickness="5" Stroke="Black" Fill="Gold" />

 The output looks like Figure 1.


Figure 1. Drawing and Filling an Ellipse

Ellipse also supports events like any other controls. The following code adds MouseDown event handler to the Ellipse:

<Ellipse Name="MyEllipse" Height="100" Width="300" StrokeThickness="5" Stroke="Black" Fill="Gold" MouseDown="EllipseMouseDown" />

Here is the MouseDown event handler in .cs file.

void EllipseMouseDown(object sender, MouseButtonEventArgs e)
    MessageBox.Show("Mouse was down");

Now when you mouse down on the ellipse, the output looks like Figure 2. 


  Figure 2. Ellipse with mouse event


Further Readings
You may also want to read these related articles.
Ask Your Question 
Got a programming related question? You may want to post your question here


© 2019 DotNetHeaven. All rights reserved.