0
\$\begingroup\$

The problem is at this part, the color is changing the background also for the PAUSE button and not only for the PLAY/STOP button.

Before i added this part the PAUSE button color changing was working fine but after adding this part in the PLAY/STOP button now the PAUSE part with the colors change is not working good as before. The background colors in the PLAY/STOP button also affecting the PAUSE background color when trying to change the PAUSE button color in runtime in the inspector.

if (test == false)
        {
            GUI.backgroundColor = Color.green;
            test1 = "STOP";
        }
        else
        {
            GUI.backgroundColor = Color.red;
            test1 = "PLAY";
        }

What i want to do is to be able to manipulate the background color for each button individual so one will not override/affect the other/s.

using System.Collections;
using System.Collections.Generic;
using UnityEngine;

public class GUIExamples : MonoBehaviour
{
    public Texture btnTexture;
    public Color color;
    
    public string colorInf;

    private GUIStyle currentStyle = null;
    private Color oldColor;
    private bool test = false;
    private string test1;

    private void Start()
    {
        oldColor = color;
    }

    private void OnGUI()
    {
        if (!btnTexture)
        {
            Debug.LogError("Please assign a texture on the inspector");
            return;
        }

        //GUI.backgroundColor = color;
        if (GUI.Button(new Rect(10, 10, 170, 30), "LOOP"))
            Debug.Log("Clicked the button with an image");

        //GUI.backgroundColor = color;
        if (GUI.Button(new Rect(10, 50, 170, 30), "CHANGE DIRECTION"))
            Debug.Log("Clicked the button with text");

        //GUI.backgroundColor = color;
        if (GUI.Button(new Rect(10, 90, 170, 30), "PING PONG"))
            Debug.Log("Clicked the button with text");

        if (test == false)
        {
            GUI.backgroundColor = Color.green;
            test1 = "STOP";
        }
        else
        {
            GUI.backgroundColor = Color.red;
            test1 = "PLAY";
        }
        if (GUI.Button(new Rect(10, 130, 170, 30), test1))
        {
            Debug.Log("Clicked the button with text");
            test = !test;
        }

        InitStyles(); 
        GUI.Box(new Rect(10, 170, 170, 30), "PAUSE", currentStyle);
        if (GUI.Button(new Rect(10, 170, 170, 30), "PAUSE", currentStyle))
            Debug.Log("Clicked the button with text");

        
    }

    private void InitStyles()
    {
            currentStyle = null;

            if (oldColor != color)
            {
                currentStyle = null;
            }

            if (currentStyle == null)
            {
                currentStyle = new GUIStyle(GUI.skin.box);
                currentStyle.normal.background = MakeTex(2, 2,
                    new Color(color.r, color.g, color.b));

                oldColor = color;
            }
    }

    private Texture2D MakeTex(int width, int height, Color col)
    {
        Color[] pix = new Color[width * height];
        for (int i = 0; i < pix.Length; ++i)
        {
            pix[i] = col;
        }
        Texture2D result = new Texture2D(width, height);
        result.SetPixels(pix);
        result.Apply();
        return result;
    }
}
\$\endgroup\$

1 Answer 1

1
\$\begingroup\$

First of all, It is strongly recommended that you use the updated unity GUI tools. Check UI-system-compare.

Back to this question. Let's look at the definition of GUI-backgroundColor:

Global tinting color for all background elements rendered by the GUI.
This gets multiplied by color.
  1. It's a global value for all elements.
  2. It's not the element color but a "correction value". Just like "multiply blend mode" in photoshop.

Maybe this button Need to have its own GUIStyle object. Try this:

    var playButtonStyle = new GUIStyle(GUI.skin.box);
    if (test == false)
    {
        playButtonStyle.normal.background = MakeTex(2, 2, Color.red);
        test1 = "STOP";
    }
    else
    {
        playButtonStyle.normal.background = MakeTex(2, 2, Color.green);
        test1 = "PLAY";
    }
    if (GUI.Button(new Rect(10, 130, 170, 30), test1, playButtonStyle))
    {
        Debug.Log("Clicked the button with text");
        test = !test;
    }

Another way:

    var defaultColor = GUI.color;
    if (test == false)
    {
        GUI.color = Color.red;
        test1 = "STOP";
    }
    else
    {
        GUI.color = Color.green;
        test1 = "PLAY";
    }
    if (GUI.Button(new Rect(10, 130, 170, 30), test1))
    {
        Debug.Log("Clicked the button with text");
        test = !test;
    }
    GUI.color = defaultColor;

Modify the global color of GUI and restore it after use. This preserves the style of the default button.

\$\endgroup\$
2
  • \$\begingroup\$ How can i get in the Start() any of the buttons original color ? I want that when i change the button/s color for example to green that it will be like in the original button a bit transparent. now when changing to green or red it's filling the background color with full green or red and not like the buttons are in the original a bit transparent. when i changed the color in my code in my question it was fine now when you are using the playButtonStyle the color is too deep. \$\endgroup\$ Apr 21 at 6:56
  • 1
    \$\begingroup\$ Added an edit :-) \$\endgroup\$
    – Mangata
    Apr 21 at 7:15

You must log in to answer this question.

Not the answer you're looking for? Browse other questions tagged .