Search Unity

UI Button Transparency

Discussion in 'UGUI & TextMesh Pro' started by HarryIsBeast, May 29, 2017.

Thread Status:
Not open for further replies.
  1. HarryIsBeast

    HarryIsBeast

    Joined:
    Aug 25, 2015
    Posts:
    19
    I've been trying to find a way to make a UI button transparent and all I can ever find is how to make it transparent and clickable, etc, etc, not a script that can make it transparent or non transparent. Can someone show me how I would make this work?
    Code (CSharp):
    1. void Update(){
    2.  
    3. public Button leaveButton;
    4. public Button backButton;
    5.  
    6. if (Input.GetKeyDown (KeyCode.Escape)) {
    7.             //Make buttons non transparent
    8.         }
    9. }
    10. public void backToGame(){ //This would be attached to the backButton
    11.             //Make buttons transparent
    12. }
    13.  
    Thanks for anyone willing to help, there are so many things I need to fix that this script will help.
     
  2. methos5k

    methos5k

    Joined:
    Aug 3, 2015
    Posts:
    8,712
    That script isn't written correctly.
    I'm pretty sure what you're looking for is :
    Code (csharp):
    1.  
    2. Color col = GetComponent<Image>().color;
    3. col.a = 0;
    4. GetComponent<Image>().color = col;
    5.  
    This still leaves the text visible, so .. I don't know if you want it a percentage of transparency, but not completely? Just modify the 'col.a =' to something between 0 and 1. :)
     
    Dmotorny likes this.
  3. JoshuaMcKenzie

    JoshuaMcKenzie

    Joined:
    Jun 20, 2015
    Posts:
    916
    or add a CanvasGroup Component and modify the alpha value for it to affect the button and its children (including the text).
     
    wing3s, Correalf and Kiwasi like this.
  4. methos5k

    methos5k

    Joined:
    Aug 3, 2015
    Posts:
    8,712
    Another good option :)
     
  5. Halyconian

    Halyconian

    Joined:
    Jan 14, 2017
    Posts:
    1
    If you want the button to disappear. Try
    Button.gameObject.setActive (false)
     
  6. born2doubleup

    born2doubleup

    Joined:
    May 29, 2019
    Posts:
    1
    Not sure if anyone is still looking for a solution but I accomplished this by just setting the capacity low on my .png file I was using to display the button.
     
  7. HarryIsBeast

    HarryIsBeast

    Joined:
    Aug 25, 2015
    Posts:
    19
    Bit of a necropost, no idea how you found this. But, assuming you are using like 5.0+ UI, just use a CanvasGroup and CanvasGroup.alpha value to change transparency.
     
  8. rogodoy

    rogodoy

    Joined:
    Jan 24, 2013
    Posts:
    21
    In the inspector, change Color alpha to a value you want, normal button color will be transparent, in script you use this simple code.

    Code (CSharp):
    1.  itemImage.GetComponent<Image>().color = Color.white;
    The white color will override the alpha or any color you used in the button before. This is because the white color is a default color of the image in Unity standards. White color is RGB(1,1,1,1), if you use RGB(1,1,1,0.4) it always override the value in the inspector to a default state.
     
  9. TryingOutSomething

    TryingOutSomething

    Joined:
    Dec 5, 2020
    Posts:
    2
    I'm not sure if anyone else still has trouble with this.

    In Unity 2019.4, select the button > Image tab > color and change the alpha (capital A) value to 0.

    The button will be transparent. I'm not sure if it works for other versions earlier than this.

    Sorry for the necropost
     
    Dani1113 likes this.
  10. kevcarr111

    kevcarr111

    Joined:
    Sep 9, 2021
    Posts:
    6
    Brilliant and simple, this helped me so much. Thanks.
     
Thread Status:
Not open for further replies.