How to make a panel with a truly transparent background

1

I have a transparent image that I have made in Photoshop which has a 30% opacity to it.

Now I am trying to put that as background image for a panel. But an ordinary panel even if putting the background color to transparent, shows a white/control background. The panel doesn't become transparent.

So I have found the TransparentPanel class. But when I use that panel, I can't see the image that I put in the code?

I know I can put the background color of the panel to the same as the parent. But that will not work in this case, as the panel is on top of a video control where images are moving underneath.

So I need a completely transparent control that can show the image. I am not sure if this TransparentPanel can be used?

void addpanel()
{
    TransparentPanel tp = new TransparentPanel();
    //Panel tp = new Panel();
    tp.BackColor = Color.Transparent; //This doesn't work?
    tp.BackgroundImage = Properties.Resources.arrowup; //This image is a 30% transparent image (opacity 30%)
    tp.Size = new System.Drawing.Size(54, 54);
    tp.Location = new Point(20, 20);
    panel219.Controls.Add(tp);
    tp.BringToFront();
}
public class TransparentPanel : Panel
{
    protected override CreateParams CreateParams
    {
        get
        {
            CreateParams cp = base.CreateParams;
            cp.ExStyle |= 0x00000020; // WS_EX_TRANSPARENT
            return cp;
        }
    }
    protected override void OnPaintBackground(PaintEventArgs e)
    {
        //base.OnPaintBackground(e);
    }
}

EDIT

I have tried this approach also. But still the image in the panel has the color of the CONTROL color which is almost white. One should see through the image that I have since it is 30% opacity?

void addpanel()
{
    TransparentPanel tp = new TransparentPanel(Properties.Resources.arrowup);
    tp.BackColor = Color.Transparent; //This doesn't work?
    tp.Size = new System.Drawing.Size(54, 54);
    tp.Location = new Point(20, 20);
    panel219.Controls.Add(tp);
    tp.BringToFront();
}

class TransparentPanel : Panel
{
    public Image image { get; set; }

    public TransparentPanel(Image img)
    {
        image = img;
        SetStyle(ControlStyles.AllPaintingInWmPaint |
            ControlStyles.OptimizedDoubleBuffer |
            ControlStyles.ResizeRedraw |
            ControlStyles.SupportsTransparentBackColor |
            ControlStyles.UserPaint, true);
        UpdateStyles();
    }

    protected override void OnPaintBackground(PaintEventArgs pevent)
    {
        //base.OnPaintBackground(pevent);
    }

    protected override void OnPaint(PaintEventArgs pevent)
    {
        base.OnPaint(pevent);

        var g = pevent.Graphics;

        if (Parent != null)
        {
            Rectangle rect = new Rectangle(Left, Top, Width, Height);

            g.TranslateTransform(-rect.X, -rect.Y);

            try
            {
                using (PaintEventArgs pea =
                            new PaintEventArgs(g, rect))
                {
                    pea.Graphics.SetClip(rect);
                    InvokePaintBackground(Parent, pea);
                    InvokePaint(Parent, pea);
                }
            }
            finally
            {
                g.TranslateTransform(rect.X, rect.Y);
            }
        }

        if (image != null)
        {
            g.SmoothingMode = System.Drawing.Drawing2D.SmoothingMode.HighQuality;

            var rectSrc = new Rectangle(0, 0, image.Width, image.Height);
            var rectDes = new Rectangle(0, 0, Width, Height);

            //if (State == MouseState.Over)
                rectDes.Inflate(2, 2);

            g.DrawImage(image, rectDes, rectSrc, GraphicsUnit.Pixel);
        }
    }
}
c#
winforms
transparent-control
asked on Stack Overflow Nov 19, 2019 by Andreas • edited Nov 19, 2019 by Peter Duniho

1 Answer

2

Should be like this:

public class TransparentPanel : Panel
{

    public TransparentPanel()
    {
        SetStyle(ControlStyles.AllPaintingInWmPaint |
            ControlStyles.OptimizedDoubleBuffer |
            ControlStyles.ResizeRedraw |
            ControlStyles.SupportsTransparentBackColor |
            ControlStyles.UserPaint, true);
        UpdateStyles();
    }

    public TransparentPanel(Image img) : this()
    {
        image = img;
    }

    public Image image { get; set; }

    protected override void OnPaintBackground(PaintEventArgs pevent)
    {
        //base.OnPaintBackground(pevent);
    }

    protected override void OnPaint(PaintEventArgs pevent)
    {
        base.OnPaint(pevent);

        var g = pevent.Graphics;

        if (Parent != null)
        {
            Rectangle rect = new Rectangle(Left, Top, Width, Height);

            g.TranslateTransform(-rect.X, -rect.Y);

            try
            {
                using (PaintEventArgs pea =
                            new PaintEventArgs(g, rect))
                {
                    pea.Graphics.SetClip(rect);
                    InvokePaintBackground(Parent, pea);
                    InvokePaint(Parent, pea);
                }
            }
            finally
            {
                g.TranslateTransform(rect.X, rect.Y);
            }
        }

        if (image != null)
        {
            g.SmoothingMode = System.Drawing.Drawing2D.SmoothingMode.HighQuality;

            var rectSrc = new Rectangle(0, 0, image.Width, image.Height);
            var rectDes = new Rectangle(0, 0, Width, Height);

            //if (State == MouseState.Over)
            rectDes.Inflate(2, 2);

            g.DrawImage(image, rectDes, rectSrc, GraphicsUnit.Pixel);
        }
    }
}
answered on Stack Overflow Nov 19, 2019 by (unknown user)

User contributions licensed under CC BY-SA 3.0