[EDIT] How do I slowly make a color turn transparent?
I have some UI which uses an image that I want to turn slowly invisible after being ignored for a while. I tried creating an Enumerator but I can't get it to work right.
private IEnumerator fadeOut()
{
int i = 0;
bool finished = false;
while (finished == false)
{
for (i = 0; i < 5; i++)
{
yield return new WaitForSeconds(1f);
}
img.color = new Color(img.color.r, img.color.g, img.color.b, img.color.a - 1);
finished = img.color.a < 1 ? false : true;
yield return new WaitForSeconds(0.2f);
}
}
After a revision, I've edited my code but have the same problem-- the transition isn't smooth, in one frame my alpha levels go from 255 to -1 (rounded up to 0). I'm using an event trigger which uses my functions base on if the mouse goes over my object or leaves it's box.
using System.Collections;
using System.Collections.Generic;
using UnityEngine;
using UnityEngine.UI;
public class boxController : MonoBehaviour {
Animator anim;
Image img;
Coroutine fade;
Coroutine show;
void Start () {
anim = GetComponent<Animator>();
img = GetComponent<Image>();
fade = StartCoroutine(Wait());
}
public void EnterMouse()
{
anim.SetBool("isUp", true);
if(fade != null)
{
StopCoroutine(fade);
fade = null;
}
show = StartCoroutine(FadeIn());
}
public void ExitMouse()
{
anim.SetBool("isUp", false);
if(show != null)
{
StopCoroutine(show);
show = null;
}
fade = StartCoroutine(Wait());
}
private IEnumerator Wait()
{
for (int i = 0; i < 5; i++)
{
yield return new WaitForSeconds(1f);
}
fade = StartCoroutine(FadeOut());
}
private IEnumerator FadeOut()
{
for (int i = (int)img.color.a - 1; i < 1; i--)
{
img.color = new Color(255, 255, 255, i);
yield return new WaitForSeconds(0.01f);
}
}
private IEnumerator FadeIn()
{
for(int i = (int)img.color.a + 1; i > 254; i++)
{
img.color = new Color(255, 255, 255, i);
yield return new WaitForSeconds(0.005f);
}
}
}
Answer by Rugbug_Redfern · Jan 15, 2018 at 12:01 AM
Here's my code: (I made a whole class)
using System.Collections;
using System.Collections.Generic;
using UnityEngine;
using UnityEngine.UI;
public class FadeOut : MonoBehaviour {
public bool fade = false;
Image img;
float speed;
void Start() {
img = GetComponent<Image>();
FadeOutImage(0.5f);
}
void FadeOutImage(float _speed) {
speed = _speed;
fade = true;
}
void Update() {
if(fade) {
img.color = new Color(img.color.r, img.color.b, img.color.g, img.color.a - speed * Time.deltaTime);
}
}
}
Just call FadeOutImage(float speed) in the place where you want the image to start fading out.
I just try to always stay away from IEnumerators.
I tried something like this...
using System.Collections;
using System.Collections.Generic;
using UnityEngine;
using UnityEngine.UI;
public class boxController : $$anonymous$$onoBehaviour {
public int fInSpeed = 150;
public int fOutSpeed = 80;
bool fadingIn = false;
bool fadingOut = false;
Animator anim;
Image img;
Coroutine fade;
void Start () {
anim = GetComponent<Animator>();
img = GetComponent<Image>();
fade = StartCoroutine(Wait());
}
public void Enter$$anonymous$$ouse()
{
anim.SetBool("isUp", true);
if(fade != null)
{
StopCoroutine(fade);
fade = null;
}
fadingIn = true;
}
public void Exit$$anonymous$$ouse()
{
anim.SetBool("isUp", false);
fadingIn = false;
fade = StartCoroutine(Wait());
}
private void Update()
{
if (fadingIn && img.color.a < 255)
{
img.color = new Color(255, 255, 255, img.color.a + fInSpeed * Time.deltaTime);
fadingIn = img.color.a < 255 ? true : false;
}
if (fadingOut && img.color.a > 0)
{
img.color = new Color(255, 255, 255, img.color.a - fOutSpeed * Time.deltaTime);
fadingOut = img.color.a > 0 ? true : false;
}
}
private IEnumerator Wait()
{
for (int i = 0; i < 5; i++)
{
yield return new WaitForSeconds(1f);
}
fadingOut = true;
}
}
...but it did not end up working, and roughly set the alpha level to 0 ins$$anonymous$$d of moving down the value smoothly. Do you think it has anything to do with working on an image component ins$$anonymous$$d of a sprite renderer component?
Answer by Murddock · Jan 15, 2018 at 01:38 AM
(Srry for my bad english )
You should put the color change inside in the for loop ( i think While doesn't was necessary ), your While loop could stop in alpha 0.9 cause its less than 1 and still be completely visible. (alpha goes from 1 to 0 )
I show you an example of how I had make something like that:
I hope that helps you :)
IEnumerator ChangeColor () {
for (float f = 0f; f <= 4; f += 0.1f) {
yield return new WaitForSeconds (0.02f);
Color colorTemp = rend.material.color;
colorTemp.a -= 0.035f;
rend.material.color = colorTemporal;
}
yield return null;
}
}