Question Having problem with PictureBox on Transparent form

luffydev

New member
Joined
Nov 4, 2020
Messages
3
Programming Experience
Beginner
i'm coming with you cause i've a problem with a PNG transparency over a transparent Form in C#. i don't know how this problem is called, but i've take you a screen : https://i.ibb.co/xj37y7M/Capture.png.

For my main for, i've just applied a TransparencyKey with the same color as it own background.

For my picture it doesn't had any background.

Thank a lot for your help !
 
Welcome to the forum.

Attach your image here please. It looks like your png has alpha composition. It doesn't look to be a problem with C#/forms.
 
I've attached my image here, thank for your answer
 

Attachments

  • corner_bottom_left.png
    corner_bottom_left.png
    8.4 KB · Views: 45
Thank for your quick response, this is my Designer code

C#:
namespace wlp_launcher
{
    partial class Main
    {
        /// <summary>
        /// Variable nécessaire au concepteur.
        /// </summary>
        private System.ComponentModel.IContainer components = null;

        /// <summary>
        /// Nettoyage des ressources utilisées.
        /// </summary>
        /// <param name="disposing">true si les ressources managées doivent être supprimées ; sinon, false.</param>
        protected override void Dispose(bool disposing)
        {
            if (disposing && (components != null))
            {
                components.Dispose();
            }
            base.Dispose(disposing);
        }

        #region Code généré par le Concepteur Windows Form

        /// <summary>
        /// Méthode requise pour la prise en charge du concepteur - ne modifiez pas
        /// le contenu de cette méthode avec l'éditeur de code.
        /// </summary>
        private void InitializeComponent()
        {
            this.pictureBox1 = new System.Windows.Forms.PictureBox();
            ((System.ComponentModel.ISupportInitialize)(this.pictureBox1)).BeginInit();
            this.SuspendLayout();
            //
            // pictureBox1
            //
            this.pictureBox1.BackgroundImage = global::wlp_launcher.Properties.Resources.corner_bottom_left;
            this.pictureBox1.BackgroundImageLayout = System.Windows.Forms.ImageLayout.Center;
            this.pictureBox1.Location = new System.Drawing.Point(451, 227);
            this.pictureBox1.Name = "pictureBox1";
            this.pictureBox1.Size = new System.Drawing.Size(121, 128);
            this.pictureBox1.SizeMode = System.Windows.Forms.PictureBoxSizeMode.CenterImage;
            this.pictureBox1.TabIndex = 0;
            this.pictureBox1.TabStop = false;
            this.pictureBox1.Paint += new System.Windows.Forms.PaintEventHandler(this.pictureBox1_Paint);
            //
            // Main
            //
            this.AutoScaleDimensions = new System.Drawing.SizeF(6F, 13F);
            this.AutoScaleMode = System.Windows.Forms.AutoScaleMode.Font;
            this.BackColor = System.Drawing.Color.Silver;
            this.ClientSize = new System.Drawing.Size(1126, 614);
            this.Controls.Add(this.pictureBox1);
            this.DoubleBuffered = true;
            this.FormBorderStyle = System.Windows.Forms.FormBorderStyle.None;
            this.ImeMode = System.Windows.Forms.ImeMode.NoControl;
            this.Name = "Main";
            this.SizeGripStyle = System.Windows.Forms.SizeGripStyle.Show;
            this.StartPosition = System.Windows.Forms.FormStartPosition.CenterScreen;
            this.Text = "Form1";
            this.TransparencyKey = System.Drawing.Color.Silver;
            ((System.ComponentModel.ISupportInitialize)(this.pictureBox1)).EndInit();
            this.ResumeLayout(false);

        }

        #endregion

        private System.Windows.Forms.PictureBox pictureBox1;
    }
}
 
On dark colors => Screenshot
On bright colors => Screenshot
Is this what you're trying to get? To make it smooth on both bright and dark backgrounds?

The nature of your image design makes it harder to create a balance when using transparency. This is due to the design of the image. See this example of the parts I highlighted where you have "shadowing" : Screenshot
Your image has a mix of different cells between brighter and darker shadows. This makes your image look some what "pixelated" when you mix white cells with darker cells in a transparent image. The major part of your problem is that Winforms does not allow for the main form to be transparent. WPF does, and you would be better suited trying this in WPF, only to find it's much easier to do. The nature of Winforms design functionality is also hindering you.

One thing to do is add a panel to your form. Because you can dock the panel to your form then set that forms color to match your transparent key. You can't set your form to a transparent scheme. Placing a panel can help gets around this by then placing the picture box on the panel. this.TransparencyKey = System.Drawing.Color.Silver; is not a great color to use as a transparent key, and that's why you are picking up that gray around your image.

edit : I think I have that right. Your transparent key needs be the same as your form color? Someone will correct me if I'm wrong.
 
Last edited:
I only noticed your image has shadows embedded around it after I downloaded it. You can't notice it by previewing it in the browser. I only seen this upon opening your image with Fireworks and zooming to 600%. If your image had no shadows, you wouldn't have an issue. The larger part of your problem is the image you are using, The other part is the colors you are using in your designer code.
 
Correction... your transparent key needs be transparent.

But then you have the problem of the background color of your form coming through.

You can put a docked panel over your form to help with that.
 
What I done is changed the transparent key color to black, and changed the form background color to black as well.

That made it a bit better when the image overlays darker windows. But it's awful when sitting on top of white windows.

There is a way and a method to make it appear normal, even with your image containing shadows. I know this because I done it as a project for someone a few years ago. I just can't for the life of me remember how I done it back then. But I do know I did use a panel to help with transparency. Maybe one of the other guys can refresh my memory on how to do this?

You really would be better using a more solid image, or move to WPF where this functionality does not come naturally restricted as it is in Winforms.
 
My suggestion is to not use the picture box. Instead use the transparency key to make the entire form transparent, and then in the Paint event handler of the form, use DrawImage() to paint the PNG in the correct location. I'm not sure if this will work or not, though. I'm too brain fried right now to recall the sequence of events when a form is being rendered with the transparency key color set.
 
Back
Top Bottom