I have a transparent form that overlays the desktop in a c# .NET winforms application. The transparency is done by setting the BackColor
to bright orange and then setting the TransparencyKey
to the same bright orange.
So far this works great and it creates a transparent form. I then want to create a control on the transparent form that draws a rectangle around items on the desktop. So essentially you can think of a transparent button with a rectangular border. To make this happen I currently extend Control and setup the control like this inside of the parent form which is also transparent:
public class CustomControl : Control
{
public CustomControl(Size size, Point point)
{
SetStyle(ControlStyles.SupportsTransparentBackColor, true);
this.BackColor = Color.Transparent;
this.Size = size;
this.Location = point;
}
protected override void OnPaint(PaintEventArgs e)
{
base.OnPaint(e);
Pen pen = new Pen(Color.Red, 2f);
e.Graphics.DrawRectangle(pen, this.ClientRectangle);
}
}
This creates the exact effect I'm looking for in that there is a control with a solid opaque rectangle border inside a transparent form and you can see the desktop through the control and form (see image below on left side).
The problem is that the transparent area of the control does not receive any mouse events. In fact, it basically doesn't exist. For example, when your mouse goes over the red rectangular border of the control that triggers the Mouse Hover, Mouse Enter, and Mouse Leave events and changes the cursor to whatever you set as this.Cursor
for the control. Once, the mouse is in the transparent portion of the control none of these things trigger.
How can I keep things the way they are now in regards to the look of the control but still receive mouse events in the transparent area. In particular I want to receive Mouse Hover and have the controls Cursor
value be honored. Note that if I make the BackColor
of the control anything other than Color.Transparent
then mouse events work fine.
Thank you!
Update
Based on Hans comment I would like to add that we have implemented the above and that it has usually worked (i.e., the transparent area does respond to mouse events). The reason this issue came up is because I recently rebuilt my machine with all the Windows 8.1 updates and latest ATI graphic drivers and after that the above setup no longer works ever (transparent areas on the control no longer receive any mouse events and for all intents and purposes are not part of the control) On my colleague's machine it almost always works although we've occasionally noticed that it won't work but we could never consistently reproduce the issue.
My assumption was that we did something wrong to cause the transparent areas to not respond to mouse events. However, based on Hans' comment, it seems as though the above code should never work and that the only reason it worked was because of a bug in Aero.
The exact color of our transparency key is rgb(255, 128, 0)
. In addition we did notice that any label controls placed on the transparent form look terrible (per Han's comment).
Update 2
Based on Han's additional comment regarding the Aero transparency bug I have the following updated questions.
The Final Answer (that usually works)
The answered provided by Reza below did work for me on some of my computers. However, my primary desktop continued to stubbornly refuse to cooperate. Even when copying the exact project between computers using the same version of windows and .NET the problem existed. The issue when it arose was that transparent areas would not trigger mouse events and were not treated as part of the control.
In addition, I noticed the same thing Reza noticed which was that certain TransparencyKey colors flat out did not work. Although I don't know any details of the bug I would have to agree with Hans that there are bugs involved with transparency on WinForms and if anyone is starting from scratch I would go the WPF route and save yourself any possible future headaches.
In the end we ended up implementing a work around based on some of Hans' answers that required using a timer to check the mouse location and nesting two forms (one with opacity set) to be able to manage the mouse cursor. This solution has worked on all our systems and will hopefully hold up until we move over to WPF. I accepted Reza's answer because it seems to work in most places but be aware that it might not work you and there is no rhyme or reason as to why.
For detailed information on the two workaround we implemented please see the following questions and answers by Hans.
MouseHover and MouseLeave Events controlling
How can I add transparency to a c# form while keeping controls visible?
Important
Consider set BackgroundColor
of form to Red and TransparencyKey
to Red and BackGroundColor
of transparent control to Transparent and it will work!
the strange thing that I see is, the approach doesn't work with for example Magenta but works with Red and Blue.
I think you should create your transparent control this way:
Transparent Control Code
public class TransparentControl : Control
{
public TransparentControl()
{
this.SetStyle(ControlStyles.SupportsTransparentBackColor, true);
}
private const int WS_EX_TRANSPARENT = 0x20;
protected override CreateParams CreateParams
{
get
{
CreateParams cp = base.CreateParams;
cp.ExStyle = cp.ExStyle | WS_EX_TRANSPARENT;
return cp;
}
}
}
And for the mouse events and rendering border when the mouse enters, here is the sample I did Using .Net 4.5
On Windows 8.1
:
Create a Form
and put a TransparentControl
that we created using above code, on it, then handle MouseEnter
and MouseLeave
and Paint
events and paint the border when mouse is in control bouds and handle Click
event and show a message.
Form Code
private bool drawBorder;
private void transparentControl1_MouseLeave(object sender, EventArgs e)
{
drawBorder = false;
transparentControl1.Invalidate();
}
private void transparentControl1_MouseEnter(object sender, EventArgs e)
{
drawBorder = true;
transparentControl1.Invalidate();
}
private void transparentControl1_Paint(object sender, PaintEventArgs e)
{
if(drawBorder)
{
using (var pen = new Pen(this.ForeColor, 5))
{
e.Graphics.DrawRectangle(pen, 0, 0, this.transparentControl1.Width - 1, this.transparentControl1.Height - 1);
}
}
}
private void transparentControl1_Click(object sender, EventArgs e)
{
MessageBox.Show("Clicked");
}
Screenshot
The mouse cursor is in the control's area so the black border has been painted.
Important Note
If you draw border the same color as form's transparency key, the border will not be shown.