Make overlapping picturebox transparent in C#.net

Question

I have two overlapping pictureboxes.The images of both picture boxes have some transparent pixels.I want to see the bottom picture box through the transparent pixels of the overlapping picture box.

I tried setting the background color of both picture boxes as transparent.But it just sets the back color of the picture box to the background color of the form.

Cullie

possible duplicate of A PictureBox Problem – Dimitry

Answer 1

Clearly you are using Winforms. Yes, transparency is simulated by drawing the pixels of the Parent. Which is the form, you only see the form pixels, stacking effects don't work. There's a KB article that shows a workaround for this. It is painful. Another approach is to not use PictureBox controls but just draw the images in the form's Paint event.

Consider WPF, it has a very different rendering model that easily supports transparency.

Monohydric

Answer 2

Solutions to that problem might be various, and it mainly depends on your skills and amount of work will depend on kind of images you're dealing with. For example if images are always same resolution, size and overlapping image supports transparency you could try to do manipulation of two Image objects and draw one over another, then display it in PictureBox. Or if you will need to do it multiple times in various places of your app you could even consider creating your own UserContriol.

Code in answer of this question, method ResizeImagein particular, show how to create resized, good quality image, all you need it is to change it a little. Make it to get two Images as input parameters, and change it to draw one image over another.

Changes might look like this

    public static Bitmap CombineAndResizeTwoImages(Image image1, Image image2, int width, int height)
    {
        //a holder for the result
        Bitmap result = new Bitmap(width, height);

        //use a graphics object to draw the resized image into the bitmap
        using (Graphics graphics = Graphics.FromImage(result))
        {
            //set the resize quality modes to high quality
            graphics.CompositingQuality = System.Drawing.Drawing2D.CompositingQuality.HighQuality;
            graphics.InterpolationMode = System.Drawing.Drawing2D.InterpolationMode.HighQualityBicubic;
            graphics.SmoothingMode = System.Drawing.Drawing2D.SmoothingMode.HighQuality;
            //draw the images into the target bitmap
            graphics.DrawImage(image1, 0, 0, result.Width, result.Height);
            graphics.DrawImage(image2, 0, 0, result.Width, result.Height);
        }

        //return the resulting bitmap
        return result;
    }

And use it, for example, like this:

  pictureBox1.Image = CombineAndResizeTwoImages(Image.FromFile("c:\\a.png"), Image.FromFile("c:\\b.png"), 100,100);

But that its only example, and you must tune it up to your needs. Good luck.

Pinckney

This should be the approved answer. I have been working on this problem for 4 days on and off and despite all the reading and searching I have done, suggestions tried, pictureBox2.Controls.Add(pictureBox1), using panels instead, and so on and so on, nothing worked. This works "perfectly" – Frederiksen

Answer 3

If it's one PictureBox inside another, you can use:

innerPictureBox.SendToBack(); innerPictureBox.Parent = outerPictureBox;

Bonds