Title: Create oval images in C#

This example lets you create oval images with transparent backgrounds. It includes some features such as menus that let you load and save files. Download the example to see those details. The more interesting part is the code that creates the oval images. The process starts when you press the mouse down over the image and the following MouseDown event handler executes.

// Select an elliptical area. private bool Drawing = false; private Point StartPoint, EndPoint; private void picImage_MouseDown(object sender, MouseEventArgs e) { Drawing = true; StartPoint = e.Location; EndPoint = e.Location; }

The Drawing variable is true while you are in the process of selecting an oval area. The StartPoint and EndPoint variables record the corners of the area that you are selecting.

The MouseDown event handler sets Drawing to true and saves the mouse's current location.

When you move the mouse, the following event handler executes.

private void picImage_MouseMove(object sender, MouseEventArgs e) { if (!Drawing) return; EndPoint = e.Location; DrawImage(); }

If Drawing is false, then you are not selecting an area so the method simply returns. Otherwise the method saves the mouse's new location in EndPoint and calls DrawImage (described shortly) to display the selected area.

When you release the mouse, the following event handler executes.

private void picImage_MouseUp(object sender, MouseEventArgs e) { Drawing = false; }

This simply sets Drawing to false to end the current selection.

The following code shows the DrawImage method.

private void DrawImage() { Bitmap bm = new Bitmap(OriginalImage); using (Graphics gr = Graphics.FromImage(bm)) { gr.SmoothingMode = SmoothingMode.AntiAlias; gr.DrawEllipse(Pens.Magenta, SelectedRect(StartPoint, EndPoint)); } picImage.Image = bm; }

This code creates a new bitmap named bm that is a copy of the image stored in OriginalImage. (When you load an image, the program saves a copy of it in OriginalImage.) It then creates an associated Graphics object, sets its SmoothingMode property to produce smooth curves, and draws an ellipse showing the area that you have selected. Finally, the code draws a magenta oval around the selected area and makes the PictureBox display the result.

When you save results, the program uses the following method to create oval images.

private Bitmap MakeOvalImage(Point start_point, Point end_point) { Rectangle rect = SelectedRect(start_point, end_point); Bitmap bm = new Bitmap(rect.Width, rect.Height); using (Graphics gr = Graphics.FromImage(bm)) { gr.SmoothingMode = SmoothingMode.AntiAlias; gr.Clear(Color.Transparent); using (TextureBrush brush = new TextureBrush(OriginalImage, rect)) { rect.X = 0; rect.Y = 0; gr.FillEllipse(brush, rect); } } return bm; }

This method creates a rectangle representing the area that you selected. It then makes a bitmap that has a size to match the size of the area that you selected. It creates an associated Graphics object and sets SmoothingMode to draw smooth curves. The code then clears the new bitmap with the color Transparent to give it a transparent background.

Now comes the tricky part. The code creates a new TextureBrush using the images as its texture. The second parameter to the constructor makes the brush use only the selected part of the picture as its brush. Now if you use the brush to fill a shape, it will fill the shape with copies of the selected part of the picture. The code then simply fills an ellipse with the brush. Note that this rectangle has the size of the area that you selected but has upper left corner at (0, 0). That makes the oval fill the new bitmap.

The only remaining trick to saving oval images is to be sure to save the image in .PNG format. If you save the image in .JPG format or some other lossy format, the file won't preserve the image's transparent background. The program uses the SaveImage method described in the post Save images with an appropriate format depending on the file name's extension in C# to save the image in a format that matches the file extension that you use. See that post for details.

Download the example program for additional details.

Download the example to experiment with it and to see additional details.