unity3d中的聊天背景

Question

I want to ask a question. How could I make a chat background similar like this link?

Link

With the auto text (the text will automatically typed one by one words per time).

The thing is, I already done the chat background similar to the image above, but with the transparent background, when I tried to fill the transparent background with the text in it, the text did not show.

Here is the image when it is on transparent background:

And here is the code that I have been using for this one (auto text):

using UnityEngine;
using System.Collections;

public class AutoText : MonoBehaviour 
{
    public float letterPause = 0.5f; // Define and set the pause for each letters

    public AudioClip sound = null; // For the sound

    public GUISkin customLabel = null; // For the label

    public static string message = "Help...! Help...!" + "\n" + "Somebody...! Please Help Me...!"; // The message

    private void Start()
    {
        StartCoroutine(TypedText());
    }

    private void OnGUI()
    {
        GUI.Label(new Rect((Screen.width / 2) - 250, (Screen.height / 2) - 200, 500, 500), message, customLabel.customStyles[0]);
    }

    IEnumerator TypedText()
    {
        // Loop through the message
        foreach (char letter in message.ToCharArray())
        {
            // Set the gui text to be same with message
            guiText.text += letter;

            // If sound available
            if (sound)
            {
                // Play it on each words
                audio.PlayOneShot(sound);

                // Go back to the if statement
                yield return 0;
            }

            // Each letters will be shown for how many seconds delay
            yield return new WaitForSeconds(letterPause);
        }
    }
}

For the text itself, I create a gui text and the gui skinin the unity editor and put the script on it, like the below image:

And also, when I tried to set the chat background to not be transparent, the text is on behind the chat background (so the text not been shown)

Thank you very much sir for answering this question and interest with it

Answer 1

Can't you just try and draw the Texture behind the Text :)?

Start by adding the texture as a variable in the script

public Texture2D Background;

Then change your OnGUI into

private void OnGUI()
{
    GUI.DrawTexture(new Rect((Screen.width / 2) - 250, (Screen.height / 2) - 200, 500, 500), Background);
    GUI.Label(new Rect((Screen.width / 2) - 250, (Screen.height / 2) - 200, 500, 500), message, customLabel.customStyles[0]);
}

Don't forget to assign the background texture in the editor first; Also on the imported texture. Set the Transparency to be from the alpha channel.

Without testing this I can ALMOST guarantee that it will work :-)