Disable button in UI disappear until mouse curso move over it

I am hiding a button, which is part of a panel.

I want this button and panel show only in a specific case; it works fine until the mouse goes in the area where the button is located. In that case, the background of the button appear, and remain on screen.

I did try to use disabled and interactable, and in both case, when I set it to false, the button frame is displayed, which is not what I want.

This is the code that I am using; this works perfectly, until I move the mouse and the pointer enter in the area where the button is; then the outer image of the button appear, and stay on screen. How do I disable this? I want the button and image to stay hidden unless I tell it otherwise.

void Start()
{
    // hide panel and button
    the_panel.CrossFadeAlpha(0f, 0f, true);
    the_button.image.CrossFadeAlpha(0f, 0f, true);
    the_button.GetComponentInChildren<text>().CrossFadeAlpha(0f, 0f, true);
}

void ShowButton()
{
    the_panel.CrossFadeAlpha(1f, 0f, true);
    the_button.image.CrossFadeAlpha(1f, 0f, true);
    the_button.GetComponentInChildren<text>().CrossFadeAlpha(1f, 0f, true);
}

void HideButton()
{
    the_panel.CrossFadeAlpha(0f, 0f, true);
    the_button.image.CrossFadeAlpha(0f, 0f, true);
    the_button.GetComponentInChildren<text>().CrossFadeAlpha(0f, 0f, true);
}

Problem solved.

Set interactable to false and set the alpha for the disabled color to 0, so it will be totally transparent and not visible, even when you hover with the mouse on it.

If you want the button to be inactive, then just call SetActive(false) to disable it.

I did try that but the button won’t disappear from the canvas

OK, a better solution is to have the parent of the Button use a CanvasGroup, then set the Alpha to 0 to hide it or 1 to activate it. You can also set whether child objects are “interactable”.
If your parent object is the camvas, then create an empty UI GO on the canvas and pace the button within it. (also read up on CanvasGroups in the manual)

I did try that; but I have many buttons that does not fall into a specific category; which translate in 20-30 canvas to turn on and off individually. Same thing that I would do for a button in the end; but I believe there is an overhead for each canvas that you create…not sure, I need to check.

Considering the time spent to set up a ton of canvas, each with one button; I find much faster to change one single parameter on the alpha of the disabled button; but the approach that you suggest is pretty good too.

1 Like