Make an image with rounded corners and a transparent background in C#

[rounded corners]

Recently I wanted to make an image for a gift card that had rounded corners. Unfortunately the Graphics class does not have a method to draw rectangles with rounded corners. Fortunately, I have already described the key method in my earlier post Draw rounded rectangles in C#. That post describes a MakeRoundedRect method that creates a GraphicsPath representing a rectangle that has rounded corners. You can then draw or fill it as needed.

This example uses the following code to create and display an image with rounded corners and a transparent background.

// Make and display the image with rounded corners.
private void ShowImage()
{
    // If the corners are not rounded,
    // just use the original image.
    if ((scrXRadius.Value == 0) || (scrYRadius.Value == 0))
    {
        picImage.Image = OriginalImage;
        return;
    }

    // Make a bitmap of the proper size.
    int width = OriginalImage.Width;
    int height = OriginalImage.Height;
    Bitmap bm = new Bitmap(width, height);
    using (Graphics gr = Graphics.FromImage(bm))
    {
        // Clear with a transparent background.
        gr.Clear(Color.Transparent);
        gr.SmoothingMode = SmoothingMode.AntiAlias;
        gr.InterpolationMode = InterpolationMode.High;

        // Make the rounded rectangle path.
        GraphicsPath path = MakeRoundedRect(
            new Rectangle(0, 0, width, height),
            scrXRadius.Value, scrYRadius.Value,
            true, true, true, true);

        // Fill with the original image.
        using (TextureBrush brush = new TextureBrush(OriginalImage))
        {
            gr.FillPath(brush, path);
        }
    }
    picImage.Image = bm;
}

As you can probably guess, the original image is stored in the variable OriginalImage.

The scrXRadius and scrYRadius scroll bars let the user select the radii used to draw the rounded corners. If either the X or Y radii of the rectangle’s rounded corners are zero, then the result should not have rounded corners. In that case, the method simply displays the original image and returns.

If the X and Y radii are not zero, the method gets the image’s dimensions, makes a Bitmap of the same size, and creates an associated Graphics object. It clears the bitmap with the color Transparent and sets the InterpolationMode to AntiAliass so any shapes that it draws have smooth, anti-aliased edges.

Next, the code calls the MakeRoundedRect method to get a path representing a rectangle with rounded corners. The method then creates a TextureBrush that fills with copies of the original image. It uses the brush to fill the path that defines the rounded rectangle.

The code finishes by displaying the new image in the picImage PictureBox.

Download the example and see the earlier post to learn about additional details.


Download Example   Follow me on Twitter   RSS feed   Donate




About RodStephens

Rod Stephens is a software consultant and author who has written more than 30 books and 250 magazine articles covering C#, Visual Basic, Visual Basic for Applications, Delphi, and Java.
This entry was posted in graphics, image processing and tagged , , , , , , , , , , , . Bookmark the permalink.

Leave a Reply

Your email address will not be published. Required fields are marked *

This site uses Akismet to reduce spam. Learn how your comment data is processed.