x


Is there a simple way of fading a Texture2D

Hi,

Is there a simple way of fading a Texture2D used in gui? Something like

Fade(Texture2Dcopy , fadeTime, "In");    
//Fades a Texture2D copy over the course of fadeTime, using a specific type of fade

Im not using a GUITexture. I know how to set up the function..but not sure how to change the actual alpha of the texture.

Any thoughts?

more ▼

asked Apr 21 '12 at 01:18 AM

hijinxbassist gravatar image

hijinxbassist
2k 23 31 38

(comments are locked)
10|3000 characters needed characters left

1 answer: sort voted first

You can control the texture alpha with GUI.color.a:

var texture: Texture2D; // the texture to draw

private var alpha: float = 1.0;
private var fading = false;

function Fade(fadeTime: float, in: boolean){
  if (fading) return; // aborts other calls to Fade when already fading
  fading = true; // starts fading
  var t: float = 0.0;
  while (t < 1.0){
    t += Time.deltaTime/fadeTime;
    alpha = Mathf.Clamp01(in? t : 1-t); // copy t or 1-t to alpha
    yield; // continue next frame
  }
  fading = false; // fading ended
}

function OnGUI(){
  GUI.color.a = alpha; // alpha ramps 0->1 or 1->0 when fading
  GUI.DrawTexture(Rect(...), texture); // draw the texture
  GUI.color.a = 1.0; // restore alpha for other GUI elements, if any
  ... // other GUI elements
}

If you want to fade to some color, draw a colorful mask after the main texture and control its alpha:

var mask: Texture2D; // drag the mask here...

function OnGUI(){
  GUI.DrawTexture(Rect(...), texture); // draw the texture
  GUI.color.a = alpha; // alpha ramps 0->1 or 1->0 when fading
  GUI.DrawTexture(Rect(...), mask); // draw the mask
  GUI.color.a = 1.0; // restore alpha for other GUI elements, if any
  ... // other GUI elements
}

NOTE 1: Call Fade(time, true) to fade in and Fade(time, false) to fade out;
NOTE 2: When fading to a color, the logic is reversed - Fade(time, false) fades in and Fade(time, true) fades out.

more ▼

answered Apr 21 '12 at 02:22 AM

aldonaletto gravatar image

aldonaletto
41.6k 16 42 197

This is from the 3D Buzz tutorial (game manager). Fades in and out the logo when the player is idle.

GUI.color = Color(1, 1, 1, 1 - logoFadeInTimer / logoFadeInDelay); // set alpha to 1 - [number] (fade in)

GUI.color = Color(1, 1, 1, logoFadeOutTimer / logoFadeOutDelay); // fade out

So you could compare from the script in the tutorial :

private var logoFadeInDelay : float = 3.0;
private var logoFadeOutDelay : float = 0.5;
private var logoFadeInTimer : float = 3.0;
private var logoFadeOutTimer : float = 0.5;
private var logoTexture : Texture;

       if (showLogo)
       {
         if (logoFadeInTimer > 0)
         {
          logoFadeInTimer -= Time.deltaTime;
          GUI.color = Color(1, 1, 1, 1 - logoFadeInTimer / logoFadeInDelay);
          GUI.DrawTexture(Rect(Screen.width - 316, Screen.height - 134, 316, 129), logoTexture);
         }
         else
         {
          GUI.color = Color.white;
          GUI.DrawTexture(Rect(Screen.width - 316, Screen.height - 134, 316, 129), logoTexture);
         }
       }
       else
       {
         if (logoFadeOutTimer > 0)
         {
          logoFadeOutTimer -= Time.deltaTime;
          GUI.color = Color(1, 1, 1, logoFadeOutTimer / logoFadeOutDelay);
          GUI.DrawTexture(Rect(Screen.width - 316, Screen.height - 134, 316, 129), logoTexture);
         }
       }
Apr 21 '12 at 02:24 AM alucardj

Simultaneous post! Follow Aldo's advice =]

Apr 21 '12 at 02:25 AM alucardj

@aldonaletto Beautiful! Just one question, in? is to make function var(in) usable? Ive never seen ?variable before. Can you enlighten me to this use of "?var". As for my script, im gonna throw a switch(fadeCase) ((Thus the "In")) in there so i can determine whether the texture is fading in or out. I suppose a boolean is just as good with 2 cases, if i added a third case id have to disregard the bool method.

Ill post my script when im done, its an update to the "Custom 2D Pointer" script using OnGUI instead of GUITexture.

Apr 21 '12 at 02:40 AM hijinxbassist

Lol! Thanks, anyway!

Apr 21 '12 at 02:46 AM hijinxbassist

This is one of the good inventions of the C language: the question mark selects one of the two following alternatives (first if true, second if false) - it's like a ultra compact IF.
You're right: switch is the best choice if you intend to have more than two alternatives - something like this:

  while (t < 1.0){
    t += Time.deltaTime/fadeTime;
    switch (inOut){
      case "In": 
        alpha = Mathf.Clamp01(t); 
        break;
      case "Out": 
        alpha = Mathf.Clamp01(1-t); 
        break;
      case "OtherThing":
        ...
    }
    yield; // continue next frame
  }
Apr 21 '12 at 03:49 AM aldonaletto
(comments are locked)
10|3000 characters needed characters left
Your answer
toggle preview:

Up to 2 attachments (including images) can be used with a maximum of 524.3 kB each and 1.0 MB total.

Follow this question

By Email:

Once you sign in you will be able to subscribe for any updates here

By RSS:

Answers

Answers and Comments

Topics:

x330
x189
x3
x1

asked: Apr 21 '12 at 01:18 AM

Seen: 1875 times

Last Updated: Apr 21 '12 at 03:57 AM