Change color of label when hover and clicked

Question

I have a problem regarding changing appearance of a label. Here is the screenshot:

That is the color when you hover the mouse and I want it like that. What I want is for it to stay that color when I clicked it. But because of my mouseleave control it would not work like I want it.

Here is the code:

   private void btnArchives_MouseEnter(object sender, EventArgs e)
    {
        lblArchives.BackColor = Color.FromArgb(9, 18, 28); //darkercolor
    }

   private void btnArchives_MouseLeave(object sender, EventArgs e)
   {
       lblArchives.BackColor = Color.FromArgb(15, 34, 53); //lightercolor
   }

I tried mouse hover too. It looked the same as mouse enter though. Bottom line is I want the color to change to the darker color when hovered over them and change back to the lighter color when hovered out of them. But I also what it to stay dark color when I clicked it. And then turn back to lighter color then I click another button and that other button will now turn to darker color. Thank you!

EDIT: i used label instead of buttons. Im currently trying some of the comments below thank you very much.

Answer 1

I use this technique, just tested it and I think its what you want.

    Label clickedLabel;
    private void mouseEnter(object sender, EventArgs e)
    {
        Label theLabel = (Label)sender;
        if (theLabel != clickedLabel)
            theLabel.BackColor = Color.Red;
    }

    private void mouseLeave(object sender, EventArgs e)
    {
        Label theLabel = (Label)sender;
        if (theLabel != clickedLabel)
            theLabel.BackColor = Color.Yellow;
    }

    private void labelClick(object sender, EventArgs e)
    {
        setColor();//Calling this here so clickedLabel is still the old value
        Label theLabel = (Label)sender;
        clickedLabel = theLabel;
    }

    public void setColor()
    {
        if(clickedLabel != default(Label))
            clickedLabel.BackColor = Color.Yellow;
        //Resetting clicked label because another (or the same) was just clicked.
    }

Explanation:
These events are only set to labels so we can do (Label)sender which means label that activated the event. I made a Label clickedLabel variable and set it to the clicked label, as soon as the other is clicked the variable will change and the checks will work.

Best thing about this method is it doesn't matter how many Labels you have, you never reference them as name only as sender.

Answer 2

You can remove the event handlers btnArchives_MouseLeave and button1_MouseEnter when button clicked to prevent it. But you need to add it back when the button is clicked again:

private void btnArchives_Click(object sender, EventArgs e)
{
            if (!clicked)
            {
                btnArchives.MouseEnter-= new EventHandler(btnArchives_MouseEnter);
                btnArchives.MouseLeave-= new EventHandler(btnArchives_MouseLeave);
                clicked = true;
                return;
            }

            btnArchives.MouseEnter += new EventHandler(btnArchives_MouseEnter);
            btnArchives.MouseLeave += new EventHandler(btnArchives_MouseLeave);
            clicked = false;
  }

  void btnArchives_MouseLeave(object sender, EventArgs e)
  {
              this.btnArchives.BackColor = Color.FromArgb(15, 34, 53);
  }

  void btnArchives_MouseEnter(object sender, EventArgs e)
  {
              this.btnArchives.BackColor = Color.FromArgb(9, 18, 28);
  }

Answer 3

maybe add a 'if' in btnArchives_mouseLeave EventHandler like:

{
     if(！btnArchives.IsClicked())
     {
          btnArchives.BackColor = Color.FromArgb(15, 34, 28);//lightercolor
     }
}

or： remove EventHandler on PressEvent

  private void btnArchives_MouseClick(object sender, EventArgs e)
  {
    btnArchives.BackColor = Color.FromArgb(9, 18, 28); //darkercolor
    btnArchives.OnMouseLeave-= btnArchives_MouseLeave
  }

i like the first..

Answer 4

You can save your selected Label in the OnClick event. And check in the other methods if it's selected.

Something like this:

private void label_MouseClick(object sender, MouseEventArgs e)
{
    var label = (Label)sender;
    if (label == this.selectedLabel || this.selectedLabel == null) return;

    this.selectedLabel.BackColor = Color.FromArgb(15, 34, 53); //lightercolor
    this.selectedLabel= label;
}

private void label_MouseLeave(object sender, EventArgs e)
{
    var label = (Label)sender;
    if (label == this.selectedLabel || this.selectedLabel == null) return; 
    label.BackColor = Color.FromArgb(15, 34, 53); //lightercolor
}

private void label_MouseEnter(object sender, EventArgs e)
{
    var label = (Label)sender;
    label.BackColor = Color.FromArgb(9, 18, 28); //darkercolor
}

Note, that this is generic and you should add the same methods to all your labels
This will also make sure that when you click one label the other one will be deselected.

In your class just add a private Label selectedLabel

Answer 5

private string activeLabel;

private void btnArchives_Click(object sender, EventArgs e)
    {
        activeLabel = btnArchives.Text;
    }

private void btnArchives_MouseEnter(object sender, EventArgs e)
    {
        lblArchives.BackColor = Color.FromArgb(9, 18, 28); //darkercolor
    }

private void btnArchives_MouseLeave(object sender, EventArgs e)
{

    if (activeLabel = btnArchives.Text)
    {
       lblArchives.BackColor = Color.FromArgb(9, 18, 28); //darkercolor
    }
    else
    {
       lblArchives.BackColor = Color.FromArgb(15, 34, 53); //lightercolor
    }

}

There is no function to check if the label is clicked therefore, you use a global string variable to collect the label currently clicked. And then make the forecolor darker if the label is the currently clicked else return back to the lightercolor.