Fading UI Image

Unity 5.3.4


I’m attempting to fade a UI Image

graphics_to_fade[0] = image_sender.GetComponent();

graphics_to_fade[0].CrossFadeAlpha(0, 3, false);

This is making the image disappear, but it does not fade at all. If the 0 that is sent to CrossFadeAlpha is replaced with 0.1f or another number, nothing happens.

The same thing happens when using:
var clr = new Color(1, 1, 1, transparency);
image_sender.GetComponent().material.color = clr;

It goes from normal to invisible and never fades/shows transparency.

Any ideas what I can do to have the image fade?


You have to actually fade the color over time in Update().

using UnityEngine;
using System.Collections;
using UnityEngine.UI;

public class Fade : MonoBehaviour {
    public float FadeRate;
    private Image image;
    private float targetAlpha;
	// Use this for initialization
	void Start () {
        this.image = this.GetComponent<Image>();
            Debug.LogError("Error: No image on "+this.name);
        this.targetAlpha = this.image.color.a;
	// Update is called once per frame
	void Update () {
        Color curColor = this.image.color;
        float alphaDiff = Mathf.Abs(curColor.a-this.targetAlpha);
        if (alphaDiff>0.0001f)
            curColor.a = Mathf.Lerp(curColor.a,targetAlpha,this.FadeRate*Time.deltaTime);
            this.image.color = curColor;

    public void FadeOut()
        this.targetAlpha = 0.0f;

    public void FadeIn()
        this.targetAlpha = 1.0f;