Transparent control in .net (currently using picturebox)


I have transparent gif. I load my gif into my picturebox

pb.image = image

The picturebox will not be transparent, it will get the parent forms background color.
How can I make it be transparent?

I have tried alot of things, for example:

Dim bm As New Bitmap(pb.Image)
MyBase.Image = bm

I tried to rewrite the Paint-event in the picturebox and trying to paint my picturebox with the graphic-object and using ColorMatrix to get an alpha on the background but I only succeed changing the alpha for the whole picture.

I have also tried using a panel but nothing seems to work.
If you have an idea of a form control that can hold a picture and have transparent background and that will solve my problem I will give you the points!

Nothing I have tried works...

Any suggestions?
Who is Participating?
Mike TomlinsonConnect With a Mentor Middle School Assistant TeacherCommented:
Place your transparent gif into a PictureBox (PictureBox1) as you have done before, and set its BackColor property to Transparent as zinno has shown you.

    PictureBox1.BackColor = System.Drawing.Color.Transparent

On your form place a Panel Object (Panel1).  Now set the parent property of your PictureBox to your Panel.

    PictureBox1.Parent = Panel1

Now load up your map tiles into Images.

    Dim grass As Image = Image.FromFile("c:\maps\grass.gif") ' or something like that
    Dim road1 As Image = Image.FromFile("c:\maps\road1.gif")

In your Paint event for your panel, draw the tiles onto the panel to build your map:

    Private Sub Panel1_Paint(ByVal sender As Object, ByVal e As System.Windows.Forms.PaintEventArgs) Handles Panel1.Paint
        e.Graphics.DrawImage(grass, 50, 50)
        e.Graphics.DrawImage(road1, 100, 50)
        ' etc.....
    End Sub

Now you can move your PictureBox around the Panel like this
    PictureBox1.Left = 65
    PictureBox1.Top = 71

The transparent portions of your gif will take on the background colors of its parent container (the panel) that are directly below it.  Since you painted your map tiles directly onto the panel with DrawImage(), you gif will appear above your map tiles correctly since it will take the backgound color of what ever it is above on the panel.


Private pbImg As New PictureBox
Private bitmap As Bitmap

bitmap = New Bitmap("WaterDropsTransparent.gif")
With pbImg
.SizeMode = PictureBoxSizeMode.AutoSize
.Location = New Point(724, 96)
.Image = bitmap
.BackColor = System.Drawing.Color.Transparent
End With
Me.Controls.Add(pbImg )

be sure that u have a transparent image. "bm.MakeTransparent(pb.BackColor)" works if have the exact color, in RGB aka blue background is bm.MakeTransparent(0,0,255)
BrimbaAuthor Commented:
That is what I have already tried. It will only set the picturebox background to the forms background color. And that is not transparent, since I have different pictures on the form and my picturebox will move over the form and over the other pictures (road, grass, bridges). But all that it will show is my character and he is inside a grey box.
The grey color is the default forms color.

I really need to get rid of that box...

Keep up with what's happening at Experts Exchange!

Sign up to receive Decoded, a new monthly digest with product updates, feature release info, continuing education opportunities, and more.

BrimbaAuthor Commented:
Thank you!

I have a problem though...
Now it will paint my background everytime I move my character or a computer character is moving.
Is there any good way to get some speed in this? Or do I need to think in another way when trying to build a tile-based-game with ?
Mike TomlinsonMiddle School Assistant TeacherCommented:
You are probably repainting the entire visible portion of your map in the Paint event of your Panel.  The "e" argument to the Paint event actually tells you which part of the Panel needs to be repainted.  You can access this information like this:

    Dim r As Rectangle = e.ClipRectangle

Now you can use "r" to figure out which part of the map has been invalidated and just repaint those tiles that are affected instead of the whole map.

BrimbaAuthor Commented:
Works perfect!

There is only one small thing.

If I dont override the paint-method then everything is good (except the transparency).

But when I override the paint-method I get some weird error..

I have this code:

Dim pb As PictureBox
Dim r As Rectangle
r = e.ClipRectangle

For Each pb In p.Controls
        If r.IntersectsWith(New Rectangle(pb.Left, pb.Top, pb.Image.Width, pb.Image.Height)) Then
                e.Graphics.DrawImageUnscaled(pb.Image, pb.Location)I
        End If

When the form is loaded all obstacles (pb) are 1½ of the original size. But when I walk on that ½ obstacle that shouldnt be there it disappears.. So after I have walked around the whole map it looks good again but to start with it looks a bit weird.
I have tried to change locations and tried to paint all controls but it doesnt matter.
Mike TomlinsonMiddle School Assistant TeacherCommented:
Not sure I understand the 1 1/2 starting size vs. walking over 1/2 an obstacle.  Can you explain that part in a different way?

Mike TomlinsonMiddle School Assistant TeacherCommented:
Not sure I understand the 1 1/2 starting size vs. walking over 1/2 an obstacle.  Can you explain that part in a different way?

BrimbaAuthor Commented:

Look at this picture:

Before: I am using my own paint-method now and my obstacle will look like this
After: I have walked near the obstacle. As you can see it will remove some of the stone since the stone isnt really there (i am doing a hittest on the picturebox, and that is why I can walk on some of the stone)

Orignal: This is what the stone should look like. And it looks like this if i dont override the paint-method of the panel.

Mike TomlinsonMiddle School Assistant TeacherCommented:

Your using this in your Paint Method:

   e.Graphics.DrawImageUnscaled(pb.Image, pb.Location)

What are you using to draw the 1 1/2 starting size?  Can't you use that same code in your Paint Method to put it back the way it was before?

BrimbaAuthor Commented:
What I do is that I have an arraylist. and add all my obstacles to that.. like this:

aListObstacles.Add(New Stone(100, 100))

Stone inherits a picturebox.
The constructor of stone takes one x and one y parameter.

What I do then is that I add all the controls in the arraylist to my panel like this:

Dim itm As Obstacle
For Each itm In aListObstacles

gameBoard is of type panel

Mike TomlinsonMiddle School Assistant TeacherCommented:
Is the code to paint the initial map tiles at 1 1/2 size any different from that used to repaint a tile after it has been touched?

BrimbaAuthor Commented:
I only have one paint-method and that is the one for the panel.

I believe it will call my paint-method first thing to do when I add my controls (pictureboxes(stones)).

So I dont know why it paint my obstacles 1½ times... since the width and height of the control really is 25*25 but the first time it is like 37*37 or something like that. (like you saw)...

Mike TomlinsonMiddle School Assistant TeacherCommented:
Yeah...that is what I was trying to figure out as you have an initial size for your Picturebox?  Do you have the SizeMode set to AutoSize maybe?
Question has a verified solution.

Are you are experiencing a similar issue? Get a personalized answer when you ask a related question.

Have a better answer? Share it in a comment.

All Courses

From novice to tech pro — start learning today.