.net - How can a hover effect be created for a grouping of controls?

Question

This seems so simple but I just can't seem to figure it out.

See the image below:

It is a panel with 5 labels on it.

The behavior I want is that if the mouse enters the box (anywhere), the background color changes (for ex: AliceBlue instead of White). The problem is in Windows Forms, the transparency is wierd among other problems. If I set the background of the panel on mouse enter, the labels all still have white backgrounds and so I have white blocks around the labels. Etc.

I am sure others have run into this problem. And I'm sure it's simple. I just can't get it.

Answer 1

BackColor is an 'ambient' property. It doesn't work right because you set the labels' BackColor explicitly. Right-click the BackColor property of the labels and click Reset so it is no longer shown in bold. Changing the panel's BackColor will now automatically change the labels' BackColor as well.

This however still doesn't solve your problem. The panel's MouseLeave event will fire when you move the mouse across one of the labels. There is no clean solution for this in Winforms, subscribing all the labels and the panel's MouseEnter/Leave events doesn't eliminate corner cases. Like when the user very quickly moves the mouse from a label that's close to the edge of the panel. You'll get the MouseLeave for the label but not the MouseEnter + Leave for the panel.

The only good fix for this is a timer or the Application.Idle event. Like this:

public partial class Form1 : Form {
    public Form1() {
        InitializeComponent();
        Application.Idle += Application_Idle;
    }
    protected override void OnFormClosed(FormClosedEventArgs e) {
        Application.Idle -= Application_Idle;
        base.OnFormClosed(e);
    }
    void Application_Idle(object sender, EventArgs e) {
        var pos = panel1.PointToClient(Cursor.Position);
        if (panel1.DisplayRectangle.Contains(pos)) panel1.BackColor = Color.Red;
        else panel1.BackColor = this.BackColor;
    }
}