koobas.hobune.stream
Help fading a canvas image - after changing the image from remote script.
I’m having trouble with displaying a "bonus score" prompt to the user. The prompt is made of two gameobjects - One contains an image and one contains TextMeshPro (the TextMeshPro being a child of the Image object). Each object has a script attached that fades the alpha to 0 from 1 when called.
When calling the fade method from another script I am able to change the image and fade the new image on the first call of this method but subsequent calls only change the image. The TextMeshPro has the exact same setup but does not have this issue. I assume this is because changing the text is not the same as passing a brand new sprite.
Can anyone offer any help?
I've tried adding the GetComponent(); to the start of every coroutine in case this part needed refreshing after changing the sprite but it made no difference. I can see the alpa being changed in the code each time the method is called but any new images after the first new image fail to fade.
Fading Code Attached To Image:
Image bonusImage;
private void Start()
{
//Set alpha to 0 when starting as it contains a dummy image
bonusImage = GetComponent<Image>();
Color fadeColor = bonusImage.color;
fadeColor.a = 0;
bonusImage.color = fadeColor;
}
public void FadeBonusInfo()
{
StartCoroutine(FadeImage());
}
IEnumerator FadeImage()
{
for (float i = 1; i >= 0; i -= Time.deltaTime)
{
Color fadeColor = bonusImage.color;
fadeColor.a = i;
bonusImage.color = fadeColor;
yield return null;
}
}
Change Image And Request Fade Code Attached To Other GameObject:
public Sprite[] awards;
public GameObject bonusScoreImage;
ObjectFade bonusScoreImageScript;
void Start()
{
bonusScoreImageScript = bonusScoreImage.GetComponent<ObjectFade>();
}
private void AwardBonus(int spritToUse)
{
Sprite theSprite = bonusScoreImage.GetComponent<Image>().sprite = awards[spritToUse];
bonusScoreImageScript.FadeBonusInfo();
}
Not sure whether this is helpful, but personally I use CanvasGroup for this purpose.
Have a parent GameObject named canvas. Add CanvasGroup component to it.
Have your text and image GameObjects as children of canvas in the scene hierarchy.
Then the following lines can be used as required:.
public CanvasGroup canvas; //assign in Editor
// Make it all visible
canvas.alpha=1;
// Make it all invisible
canvas.alpha=0;
// Stop it from being interactive or clickable
canvas.interactable=false;
// Allow interaction
canvas.interactable=true;
I hope this helps.
Thanks for your input - while this does allow me to toggle the canvasgroup on or off and I can update the image - it doesn't appear to allow me to fade the canvasgroup (I'm assu$$anonymous$$g this is due to a lack of colour component on canvasgroup meaning that Alpha is either 1 or 0? (please forgive any ignorance on my part this is my attempt at learning Unity in my spare time as a hobby))
I'd like to be able to display the bonus score and image instantly then fade away rather than just on and off so I'll keep trying for the moment. Thanks again!
I think I see what you've done. You don't need to use the code you had for changing the color component etc. You literally just adjust the .alpha on the CanvasGroup. Thats the only thing you need to change. The examples I used above were just individual examples of different controls, I hoped you'd be able to incorporate that into your fade routine, but i'll provide the fade script too :)
IEnumerator FadeCanvas()
{
for (float i = 1; i >0; i -= Time.deltaTime)
{
canvas.alpha = i;
yield return null;
}
}
Thank you soo much that works a treat! I think on my initial testing of your answer I forgot to call the IEnumerator method with the StartCoroutine call - hence the lack of any fade. I've got it working now. So once again thank you!!!
The problem seems to occur after changing the image.
If I comment out the image update part of the calling script and call the fade script then my default placeholder image does exactly what I want - which is to appear instantly at the beginning of the FadeImage Coroutine method (as the alpha is set back to 1 before fading to 0). This method can be called any number of times and fades as expected - but if I update / uncomment the "change image part" and a image from another script is loaded first - while the alpha value does appear to cycle down from 1 to 0 (according to my Debug.Log monitoring) it makes no effect on the new image being displayed.
Its as if it is changing the alpha on the original image and not the updated image - even though the new image is the one being displayed....
