Scale in modal UI prefab in Unity

Question

I'm developing a learning game in Unity that has many UI elements. Sometimes I need to show up a modal, which is an instance of a prefab and I want to add a zoom in effect. I have tried with DOTween with the following code:

GameObject modalPrefab = Instantiate 
                                (
                                    Resources.Load<GameObject>(prefabName),
                                    new Vector3(0, 0, 0), Quaternion.identity
                                );
Vector3 scale = modalPrefab.transform.localScale; // Store the current scale
modalPrefab.transform.DOScale(0, 0); // Set size to zero
modalPrefab.transform.DOScale(scale, 0.8f); // Scale in

This approach works, but not very well, because it displays the prefab at full size for a millisecond before making it small, and it's very noticeable. Any ideas about how to doing this in a better way (with or without DOTween)? Thanks.

Answer 1

You could use animations for the zoom effect. Just change the scale of the Modal prefab from 0 to 1 when activating and vice versa.

Answer 2

I found the tutorial from Game Dev Guide very helpful. He uses "Lean Tween" in his video. Take a look You're Animating Your UI Wrong in Unity

Answer 3

Finally I found the solution, which is pretty simple. Instead of using DOTween for scaling to zero, simply do it in the Unity way:

modalPrefab.transform.localScale = Vector2.zero;