[vb6] Transparent PictureBox

Side Note. As of Windows 8, controls can now be made semi-transparent by applying the WS_EX_LAYERED extended window style via SetWindowLong or CreateWindowEx. This option previously existed only for the main-level window/form. However, VB picturebox still won't work since it has a class style of CS_OWNDC. That style along with the CS_CLASSDC prevents WS_EX_LAYERED from taking effect. To test a child control for compatibility:

Code:

---

Declare Function GetClassLong Lib "user32" Alias "GetClassLongA" (ByVal hWnd As Long, ByVal nIndex As Long) As Long
Const GCL_STYLE = -26&
Const CS_CLASSDC = &H40
Const CS_OWNDC = &H20

If (GetClassLong(childHwnd, GCL_STYLE) And (CS_CLASSDC Or CS_OWNDC)) = 0 Then ' can use WS_EX_LAYERED

---

Note: In order to use layered child windows, the application has to declare itself Windows 8-aware in the manifest

Updated: 27 Feb 2011
Added OpacityPercent property to control. Allows picturebox to appear between 0% to 100% opaque.
--------------------------------------------------------------------------------------------------------------

The attached usercontrol and module will allow a picturebox to fake transparency very well. It can also fake transparency for any option buttons and checkboxes contained within the picturebox. Labels are your responsibility, simply set their backstyle property to transparent.

How to use the usercontrol and module. The module is used for subclassing only.
Subclassing will only be used if checkboxes or option buttons are to be made to fake transparency.
1) Simply add them to your project. It was not designed as a stand-alone ocx
2) Add one usercontrol for each picturebox you want to fake transparency
3) Picturebox borders are up to you. Control will work with/without them
4) On form_load, assign the usercontrol its picturebox via the AttachBuddy function
5) Read the short comments at the top of the control's code for more details.

Sample with themed controls
Attachment 82778

Some notes. As already mentioned, subclassing is only in play if you opt to make checkboxes or option buttons fake transparency.
Using gradient backgrounds might be a good example, but using textured backgrounds and placing text over them can be hard on your users' eyes. I, for example, am very color blind. Captchas over textured backgrounds drive me nuts. So would your app if it had similar appearance.
Also, you should test your app with and without a manifest (themed controls). For example, you may lose your text forecolor with themed controls. So placing a checkbox with white text over a very dark background looks good un-themed, but text may become invisible when themed. Keep this in mind, you may want 2 different color schemes. You can call the ValidateThemeEmployed function.

Limitations for the ucPicBuddy
1) One ucPicBuddy per picturebox. It must exist on the same form as the picturebox. The ucPicBuddy control will move itself appropriately.
2) Do not place any non-windowless controls between the picturebox and its container (i.e., form, frame, other picturebox)
-- picturebox looks transparent but is not. Placing controls behind it will not allow you to click on them & they won't show through
3) You can place any windowless controls between the picturebox and its container. They will show through & are not clickable.
4) You should ensure the picturebox and its ucPicBuddy control have synchronized .Visible property settings to avoid unnecessary paints
5) Option buttons/checkboxes with .Style property = Graphical are not supported
6) Some actions at runtime require you to refresh what changed: Form's BackColor, Option Button/CheckBox caption at runtime
7) Changing option button/checkbox .Alignment property at runtime requires you to call the AttachChildControl to re-add it to the ucPicBuddy control.
-- This is because VB destroys that checkbox/option button & recreates a new one with the new Alignment property
.

Great Job La volpe,I noticed that in both modules, you are putting : ''Attribute VB_Name = "modPicBuddy" , it's creating a conflict here when i am opening them, is it normal ?

Try downloading again. I changed the name and accidentally included both in the zip you downloaded. I didn't want to use module1.bas. You downloaded it too fast :)

LOL, yes I was impatient about a solution that's why I downloaded it fastly :)
I checked it again, and it seems to work fine, but I didn't integreated it yet into my project, i tried it in a new project, because I really have headache due to cold, but once i recover i will implemented into my project and test it well and let you know if all is fine at 100% or not !

By the way, I suggest you with time to try to apply it to all controls not only optionbox, checkbox and picturebox (just an idea of improving it)

BIG THANKS

Once again LaVolpe you are one of the best developper I ever knew, your projects on pscode and your replies here prove this :)
I got the chance to meet in reality, 3 of best microsoft's developpers(one of them wrote some code in the .net 3.5 framework) and i consider you one of this calibers of developpers

Happy new year to all, and thanks a lot for your effort LaVolpe, I was in vacation, couldn't test at all your code on my project, untill today and I am getting a bug ....

In case I put true the parameters to make the checkboxes and options boxes transparents I am getting an error, so calling on form load the following works :

vb.net Code:

Call ucPicBuddy1.AttachBuddy(frmopt, False, False)

but,

The bug occurs if I do something like :

vb.net Code:

Call ucPicBuddy1.AttachBuddy(frmopt, True, True)

By the way, it's not only frmopt that is giving me the errors, but if i call the same way any of the frames that I replaced by picture boxes ! Thus, I think the problem is not from the picture boxes them selves but maybe the presence of other kind of controls in the form are causing this ?

I can note that if i take a new project and i add picture boxes and try your code, it works very well without bugs, but when I integrate it into my project it's giving this bug ...
I am wondering is this because I still have frames in my screen that I didn't replace by picture boxes ? or maybe I do have other controls in my screen that are causing this ? any idea ?

The attached picture shows the error message that I am getting

That error kind of confused me at first. What VB controls don't have a container property, then it hit me.... menus!

I tweaked it with an On Error statement to get past such issues. Try downloading updated version in first post above. Thanx for the bug report.

You are welcome man ... You really saved me with your work ... Thanks a lot once again.
You are right, I have menus in the form that caused the bug !!!
I tried your update, the bug is fixed, but what I noticed is that the checkboxes and options if they are on the form directly they are not transparent, they must be on a picturebox (usercontrol) .. is it the right way it works ? or there is another bug that makes them not transparents if they are on a form ?

I have to use it elsewhere so i will let you know if i got more bugs, but once again you did a great job and very usefull

Quote:

---

Originally Posted by justgreat

...but what I noticed is that the checkboxes and options if they are on the form directly they are not transparent, they must be on a picturebox (usercontrol) .. is it the right way it works ? or there is another bug that makes them not transparents if they are on a form ?

I have to use it elsewhere so i will let you know if i got more bugs, but once again you did a great job and very usefull

---

You are correct. This control is only for pictureboxes. If you want to subclass the form to make the option/checkboxes transaprent, you will have to do that. The trick to make them transparent is to watch for a couple of messages sent to the container of the option/checkbox. Depending whether the form is themed or not, determines which messages to look for

--Themed. WM_CTLCOLORSTATIC.
-- Unthemed. WM_CTLCOLORSTATIC & sent to the actual control: WM_ERASEBKGND

You can see this in the module. When unthemed, WM_ERASEBKGND will erase the background else it won't. For unthemed WM_CTLCOLORSTATIC is not always preceeded with WM_ERASEBKGND. For themed, the option/checkbox is always erased/repainted.

Thanks for the information...
I am really so so late in my project, so for the moment I will put the option and checkboxes into a picturebox without borders and later on, i will improve the code, to make them independant of picturebox as you suggested :)

Lavolpe, I am facing a little bit problem when i change the caption of the optionbox (i have a picture box, on it option box, and called the attachbuddy with true parameter).
The problem is when setting a new caption, it's appearing for a while under the old one (like if i have the new caption written above the old one), which is not so nice to see, any idea why ?

Look again at post #1 above, limitaiton #6. Simply refresh the option button. There are some things VB does internally without sending messages. Those things I cannot test for without a ton of workaround code. In this case, simply easier to educate the user & have them refresh in the few specific scenarios.

You are right, thanks

Just found this thread, and it might help me out. I need to put graphics onto transparent layers. Think of it like an overhead view of a railroad. (I'm in UK, but I'll use US terminology). Tracks are drawn on the bottom layer using VB Line and Circle methods, but could change as switches are thrown. That part of the app is done and works OK. Now I need to draw freight cars on the next layer, and cars could be drawn as JPGs or BMPs if there's a picture available, or as a plain rectangle. But whatever the graphic, it needs to be moved in X and Y directions, or rotated, to show its position relative to the track. If it's not a rectangle, it may have an irregular shape, and I need to show a transparent border around the real shape. I'm investigating using a Cairo wrapper, which can do the rotation for me (but otherwise has a lot of heavyweight functionality I don't need). The wrapper can handle all the individual objects and then blit them onto the hdc of the underlying form, or PictureBox, but can't do that transparently AFAIK. Maybe I can use a combination of your code and the Cairo wrapper, but maybe your transparent PictureBox can be persuaded to rotate? (Not just multiples of 90degrees, but eg 10 degrees, 15 degrees etc.) I tried one or two techniques for rotating pictures, but they all result in a distorted image.

Can you give me any pointers please?

(If I can get this thing to work, I have one or two other improvements I can do to this project's graphics, using similar mechanisms.) Thanks!

I can't see this control working for you. A picturebox is a window and rotating it is impossible, it will always be a rectangle. Any rotation of windows is probably done via window regions and the result I'm sure would be far less than ideal: jaggies along the rotated edges. This is because the window is still rectangular, but sections of it were cut away to give the impression of rotation.

If interested you may want to visit my Alpha Image Control, linked in my signature below. It has same functionality as VB's Image control, supports transparency, rotation, and much much more. Because it is a control, it can be moved around and overlapped with other windowless controls (VB image controls, line, shape, & labels for example).

Even if that proves not very useful, suggest you post a thread in the graphics/games section of the forum and ensure you include which VB version you are using (classic or .Net)

OK, thanks. I don't think an Image control or something similar to it would do the job, because it won't support my existing and extensive use of Line and Circle methods. I might have found something to complement the Cairo wrapper, though. The code was intended to create a glass form by using the SetLayeredWindowAttributes function from user32. Maybe if I apply it to a PictureBox rather than a form, I can then blit rotated images onto it from Cairo, having matched the Alpha channel between the two. Worth a go, perhaps.

Well, I don't want to start a graphics forum here, but SetLayeredWindowAttributes works with top level forms, not controls. If you are only interested in rendering to a picturebox/form, you may wish to consider GDI+ which handles rotation easily. A non-GDI+ dll which renders alpha channels is called AlphaBlend but it's usage can be a bit limited and requires manually modifying pixels into what is called pre-multiplied form. PlgBlt will rotate easily, but its rendering is low quality (non-blurred edges). GDI+ has same requirements when drawing to DCs, but it handles a lot of it for you. If not familiar with GDI+, there is a significant learning curve.

Edited:

Quote:

---

Originally Posted by GJChurchward

OK, thanks. I don't think an Image control or something similar to it would do the job, because it won't support my existing and extensive use of Line and Circle methods....

---

You might be surprised. I wrote that control for infinite flexibility. One of its options is to allow the coder to draw on it before it is rendered, basically acting like a transparent picturebox (in image control form). In other words, if you can render to a Picturebox, you can simply PaintPicture to the control during its rendering phase. Not saying it is a solution, just tooting my own horn for my foresight; don't get to do that too often. ;)

Buddy control modified to use an opacity setting. The OpacityPercent property allows opacity to be set at a percentage from 0 (default, full transparency) to 100% (no transparency). If using a setting other than 0, you'll want to ensure the picturebox backcolor is set appropriately for your situation. The semi-transparency will be rendered onto that backcolor.

Quote:

---

Originally Posted by LaVolpe

Buddy control modified to use an opacity setting. The OpacityPercent property allows opacity to be set at a percentage from 0 (default, full transparency) to 100% (no transparency). If using a setting other than 0, you'll want to ensure the picturebox backcolor is set appropriately for your situation. The semi-transparency will be rendered onto that backcolor.

---

It works perfect. The semi-transparency of Buddy can be rendered onto that backcolor of picturebox.

LaVolpe? Should I also use the updated version ? you improved things on it, or I can keep the old version for my case ?

Quote:

---

Originally Posted by justgreat

LaVolpe? Should I also use the updated version ? you improved things on it, or I can keep the old version for my case ?

---

I added an API declaration and about 20 lines of new code overall. If you don't need the semi-transparency option, you don't need the update. Your choice.

Hello LaVolpe, I am facing a bug that am unable to solve with the buddy usercontrol :( ...
I have a listbox that i put inside a picture box (this picture box is shaped using the buddy control to make it appears transparent)...
What is going on, is that I have a BrowseButton that uses the API (GetOpenFileName)...once the open dialog is opened, if you drag and drop a file from the open Dialog to the listbox it crashes and the application close , if you drag it from windows explorer no error occurs !
the weird thing is that i am not getting any error except on runtime when i make an exe, if i am in the IDE, the drag and drop seems not causing error (it's kinda disabled) !!!
I tried to change the properties of the drag and drop of the listbox and of the picture box , or even to disable the whole form (form1.enabled=false), and still getting this bug, it's driving me crazy, cuz am not able to debug it in IDE...any idea how to solve this bug ?

You can't debug in IDE because the dialog window is modal and vb doesn't forward many messages when modal windows are displayed. When you call GetOpenFileName, what hWnd are you passing? Maybe you might want to pass the form's hWnd? Also, in other replies above, you indicated you may be writing/tweaking subclassing for other purposes. If so, look hard at any modifications you made. Also ensure you are not getting an error in your listbox's OLEDragDrop event! Use On Error if needed.

I can't test this at the moment, it will have to wait a day or two. From what I gather, the scenario is like so:
1. Dialog opened from same form the picbox is on. The command button is or is not in the picbox?
2. The listbox is in the picbox and its OLEDropMode=Manual
3. You are not using any additional subclassing code and you have not modified the code I provided?
4. When compiled, dragging a file from the API dialog to the listbox crashes

Thanks LaVolpe for your fast comment....Here are the answers to what you asked :

- I didn't make any changes on your code.

- The Browse button is a picture box in real and it's on the same form and same frame as the ListBox.

- The ListBox has OLEDropMode=Manual yes, but even if i put the Drag to None or automatic nothing changes !

-Even if i disable the whole form or the picture box that represent the frame I got the error which is very weird !

-Yes I do use other subclassing for mousehover etc... (code down)

Here are the weird things I noted :


- If I delete the Buddy control from my form (I keep it's code, but I delete the controls that I added on the form and the related code
"Call ucPicBuddy1.AttachBuddy(frmOp, True, True)"


There is no error, my code works good ... but of course the transparency is not made !

-If I take the buddy to a stand alone project and I use the API (GetOpenFileName), no error occurs and the code works fine !

It's driving me crazy ! Your code alone works fine, if i added it to my project there is this Crash, If i remove it from my project, there is no Crash !

To conclude, as it seems, your code alone is fine, my code alone is fine, combined to each others, it makes crash ...


here is the code that I use for subclassing mouseHover etc...

vb Code:

Public Function fnWndProc(ByVal hWnd As Long, ByVal uMsg As Long, ByVal wParam As Long, ByVal lParam As Long) As Long
     Dim Indexe As Integer
    
'The SetDefaultPictures and SetHoverPictures, are subs that changes the 
'Picture of the button using your Render and Region help, to give them shape 'depending on the state if mouse is over the control or not
 
 Select Case uMsg
         Case WM_MOUSELEAVE
             SetProp hWnd, "bOver", False
             '-- Mouse Left
             '-- Do Something
              Debug.Print "Mouse Left"
             
               Indexe = GetProp(hWnd, "Indexe")
'               
               Call SetDefaultPictures(Indexe)
  
         Case WM_MOUSEHOVER
             If GetProp(hWnd, "bOver") <> 1 Then
                 '-- Mouse Hovering
                 '-- Do something
                  Debug.Print "Mouse Hovering"
             
               Indexe = GetProp(hWnd, "Indexe")
                 Call SetHoverPictures(Indexe)
  
             End If
   
             SetProp hWnd, "bOver", 1
         
         Case WM_MOUSEMOVE
             Debug.Print "Mouse Move"
             RequestTracking hWnd
     End Select
'   
     fnWndProc = CallWindowProc(GetProp(hWnd, "pOldWndProc"), hWnd, uMsg, wParam, lParam)
 End Function
 
 Public Sub RequestTracking(hWnd As Long)
     Dim ET As TRACKMOUSEEVENTTYPE
     
     ET.cbSize = Len(ET)
     ET.hwndTrack = hWnd
     ET.dwFlags = TME_LEAVE Or TME_HOVER
     ET.dwHoverTime = 1
     TrackMouseEvent ET
 End Sub

What are you subclassing? The picturebox acting like a command button, or the same picturebox that the buddy control is attached to?

The picture box acting like buttons , the picture that the button is attached too is just used as frame nothing more

I'm taking a guess here since I can't get to helping troubleshooting right away.

In the buddy control's module, make the following change and see if problem is resolved
Function: picBuddyWindowProc
Change from: lProc = GetProp(hwnd, "WndProc")
Change to:
lProc = GetProp(hwnd, "WndProc")
If lProc = 0 Then Exit Function

If the crashes stop but your picbox/cmdbutton isn't drawing correctly, let me know.
Are you using any of these property names in your SetProp commands? WndProc, EraseBkg, ChildBtn. I see you are using pOldWndProc, Indexe and a couple of others.


If the above doesn't work, find this line in the same routine and rem it out and run test again: SendMessage hwnd, WM_PAINT, wParam, ByVal 0&

Thanks again for your support LaVolpe, I tried what you suggested and the bug still on...I've made a kind of prototype of my program that I attach here so that you can see by yourself what is going on ...
I will attach the code, so that you can compile yourself the .exe.
just click on browse and try to drag and drop a file from the common dialog into the listbox (just from the .Exe, in the IDE no bug occurs).

I want to mention, that I have a code to make Drag and Drop from The win Explorer to the list, but I removed it cuz it's not related to the bug as it seems...

ps: am on Win XP-PRO

some rambling removed.

A separate test I tried to replicate the problem
1. New project completely. Add 1 command button & 1 listbox to your new form
2. Set listbox OLEDropMode = Manual
3. Add code behind button's click event to show the open dialog window. Compile project
4. Try dragging files from it now... You can't. The form & listbox won't accept them
5. While that dialog is still open, try dragging files from Windows Explorer... You can't for same reason
6. Close that open dialog window now
7. Now drag files from Windows Explorer... You can. The listbox will accept them

Then curiosity caught hold & I was determined to figure this thing out....

Edited: I figured it out. It's the buddy control, but not really. It's a bug with VB6!
I haven't tested all the other usercontrol properties and scenarios, but this simple test will cause the same problems
Repeat above steps #1 thru #3 above, but before compiling... Then do this
3a. Add new, blank usercontrol to your new project. By blank I mean a new control, not an existing one
3b. Set these usercontrol properties: Backstyle=Transparent, ClipBehavior=None, Windowless=True
3c. Place one instance of the usercontrol, with absolutely no code in the usercontrol, onto the form
Skip the rest of those steps and now compile project

Now dragging & dropping will be "allowed" but will crash the compiled project.

Edited yet again. A bit of further testing....
1. Placing such a usercontrol in a picturebox prevents the error. This kind of negates the use of many windowless usercontrols. One point of being windowless is the ability to render with transparency. If control is in a picturebox, then the control is forced to draw on the picturebox. My thoughts anyway. In other words, if the windowless, transparent, no-clip behavior usercontrol is on the form itself, the bug is present. If it is in another container, it is not present.
2. I played with disabling and making the uc invisible while on the form itself. Bug remained.
3. I don't have an immediate workaround for this bug, other than putting uc in a picbox, but that would make the uc useless in this case. Never encountered the bug before.
4. Using VB's common dialog did not crash in the same way as the API dialog did. Though it did not crash, it locked the compiled project up and I had to terminate it with task manager. I honestly think it is a bug with VB6.

Edited and yet again
More playing. I can get rid of the crash only partially now....
1. Create a new form for your project. Nothing will ever be on it, no code needed in that form.
2. Set your OpenFile structure's hWnd = that new form's hWnd
3. Immediately after calling GetOpenFileName, unload that new form. It will be loaded as soon as you reference it's hWnd
Now no crash when file dropped on the listbox (assuming listbox's OLEDropMode is not None). In fact, you can drag & drop during IDE now too. But when compiled and file is dropped on any container (form, picturebox, frame) with the OLEDropMode property set to None --- crash!

And the last post -- A complete fix for the bug
1. Add a new form as I described just above
2. Use that form's hWnd in the OPENFILE structure's hWnd member
3. Unload that form immediately after calling the API to show the dialog window
4. To fix the bug where containers accept dropped objects then crash the app...
a. For each container (form, frame, picturebox), that will NOT be used as an OLE drop target, set its OLEDropMode to Manual
b. For each of those containers, add this in their OLEDragOver events: Effect = vbDropEffectNone

P.S. That was fun and a good challenge :D
And one tip to go.... Don't set the OpenFile.hInstance to anything. Read the MSDN documentation for that structure

LaVolpe,Thanks a lot !! I used your last suggestion "A complete fix for the bug", no bug anymore ! I am impressed again by your high caliber in programming ... I agree with you that it's a bug somehow from VB6 , I don't know how to report it to microsoft, but anyway they don't care anymore cuz they stopped the support of VB6.
Out of subject,but want to mention that the button (browse), I made it based on your suggestions (hope i succeeded :p), it's largely nicer than default vb buttons :p !! I will post later on when i get time in bank code the code for that in a project, so that if someone else a day has same question about buttons he will be able to check it

justgreat, regarding the buttons and using regions to shape them... If you don't do this to like 100+ buttons, you shouldn't have any problems. But the regions you create are GDI objects and as such, are limited by memory. Regions are a nice tool to shape windows, but comes at a cost. A low cost, but quantity is the key.

Thanks LaVolpe, I have 35-50 buttons in total , till now I didn't get problem with that...In case you have a link for a better way than GDI, to do buttons with such effects please pass it to me. By the way, about GDI way that I used didn't I apply well what you told me before, or I made it not with the right way ?(If you want, you can answer me to this question in Private or in this thread to keep the code bank thread just focused on transparency)

I really wanted to thank you all those controls that developers have done to your AlphaImageControl is the best control I've seen and I've saved a lot of research and effort, thank you very much sir LaVolpe for his dedication to the development of controls for vb 6, paint. net ...

David Devi

thnx LaVolpe

I second you, big Thanks to LAVOLPE, where is is hiding since a while am not seeing him arround ! Hope all is fine with him

This is so clever and useful. Thanks for this, LaVolpe! You are an amazing contributor.:bigyello:

anyone knows where is LaVolpe Hiding ? it has been long time since he didn't connect ! Honestly he was for me the most helpfull contributor on this forum, hope he is fine.

This appears to be an answer to something I've been trying to do for some time now. While I'm very knowlegeable in much of VB6, I've never used user controls, and I'm at a loss on how to call or use LaVolpe's ucPicBuddy. With a picture box on the form, how do I make it semi-transparent?? Tnx, Brad

Hi, how can I make transparent the picturebox using your control. I'm new in vb6. Please help thanks!

Quote:

---

Originally Posted by earvinnill

Hi, how can I make transparent the picturebox using your control. I'm new in vb6. Please help thanks!

---

WS_EX_LAYERED on child controls(Transparent Activex Control)-VBForums
https://www.vbforums.com/showthread....tivex-Control)

Quote:

---

Originally Posted by xiaoyao

WS_EX_LAYERED on child controls(Transparent Activex Control)-VBForums
https://www.vbforums.com/showthread....tivex-Control)

---

There is no PngOcx_Layer.ctl user-control in the sample project. This is faking it by re-parenting a transparent form to simulate the fake child "flower control".

Since commit ea789f6 "Add transparency for containers lacking windowless controls support" of the poor man's AlphaBlendImage control you can add the single-file user control to a project and set Windowless = False from properties window for a true WS_EX_LAYERED transparency on a true VB6 user-control.

This requires Win8+ to work and a proper manifest for the final executable (and VBIDE).

cheers,
</wqw>

p.s. @mods: You can delete my post along with quoted SPAM, please!

If you just want to make the picturebox transparent, you can try the simplest way: take out the client area coordinates of the picture box, and then hide the control.
Take a screenshot from the screen or the form, set it as the back view of the picture box, and then display the control (move off the screen, or set the width and height to 0)
It would be great if there were fewer lines of code.
I saw a transparent Picturebox control before, and found that the picture displayed in high DPI was incomplete.
There is another way, if there are 2 other controls on the Picturebox, you can hollow out the other vacant places (CreateRectRgn),
This is truly transparent. If you move the Picturebox, you can see the real situation of other forms or controls below.