Giter Site home page Giter Site logo

unity-animate's Introduction

Unity-Animate

Animate any Component in the Unity Editor with ease

Animate.cs is a simple script to facilitate simple animations to the properties for any Unity Component. Just add Animate as a component to the GameObject and setup the property/properties to be animated. Invoke it by its animation state index or call them all together.

Animate Component

Animations in the GIF:

  • Camera: Zoom out.

  • Button: scale up (ease out), color, scale down (ease in), text color, and gameObject deactivated on animation end.

  • Cube: position up (ease out), position down (ease in) loop, rotation.

  • Title: text anchorMax resize, icon color alpha

Use

1- Add "Animate" as a Component to the GameObject:

Animate Component

2- Add an animation state with it property setup

The animation state needs:

  1. A state name (optional).

  2. The exact Component type name (required): It must be the exact name of the component to animate its property.

  3. The exact property name of the component to be animated.

  4. Duration in seconds of the animation.

  5. The interpolation curve of the animation, default: linear interpolation.

  6. The parameter type of the property to animate.

  7. Value of the parameter type to animate.

  8. An (optional) Event that is invoked once the animation has ended. (It may invoke another animation state to create loops).

  9. Linked GameObject (optional), the animation can be linked to any GameObject.

Animate Component

3- Add the code to run the animation

To start all the animation states together:

GetComponent<Animate>().RunAnimations();

If you prefer to run animation state separated (example for the first state):

int  stateIndex = 0;
GetComponent<Animate>().AnimateState(stateIndex);

What it does not do?

The script can not run nested properties. Ex: Trying to animate the color of the material in a MeshRenderer.

GetComponent<MeshRenderer>().material.color

Working parameter types

  1. Vector2

  2. Vector3

  3. Float

  4. Integer

  5. Color

Recomendations

This component is not recommended for heavy use of animations as it use System.Reflection inside while loops that decrease performance in comparison with dedicated animation scripts.

The easy use of the component facilitate to create multiple types of animations for UI interactions and very simple 3d animations.

Advanced Example

Building an interactive UI Button with PointerEnter and PointerExit event listeners

Animate Component

1. The hierarchy:

Button with a text and an icon

Animate Component

2. The animation states

In this example, these are the animated properties for each described gameObject Component.

  • Button RectTransform: offsetMin/offsetMax

  • Button UnityEngine.UI.Image: color

  • Button/TextContainer RectTransform: anchorMax

  • Button/Icon CanvasGroup: alpha

Animate Component

3. Advanced property to reset animations

Enabling "Advanced" allows to modify the reset animations method and duration

Animate Component

4. AnimateUIListener Component:

Attaching AnimateUIListener to the button allows to interact with PointerEnter/PointerExit events, running the comma separated state indexes once the event occurs. If "Reset States" is enabled then the event will reset the animations when the event is triggered.

Animate Component

Acknowledgments

Thanks to @Deadcows for his ConditionalFieldAttribute in MyBox

unity-animate's People

Contributors

ecarrera avatar

Stargazers

 avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar

Watchers

 avatar  avatar

Recommend Projects

  • React photo React

    A declarative, efficient, and flexible JavaScript library for building user interfaces.

  • Vue.js photo Vue.js

    ๐Ÿ–– Vue.js is a progressive, incrementally-adoptable JavaScript framework for building UI on the web.

  • Typescript photo Typescript

    TypeScript is a superset of JavaScript that compiles to clean JavaScript output.

  • TensorFlow photo TensorFlow

    An Open Source Machine Learning Framework for Everyone

  • Django photo Django

    The Web framework for perfectionists with deadlines.

  • D3 photo D3

    Bring data to life with SVG, Canvas and HTML. ๐Ÿ“Š๐Ÿ“ˆ๐ŸŽ‰

Recommend Topics

  • javascript

    JavaScript (JS) is a lightweight interpreted programming language with first-class functions.

  • web

    Some thing interesting about web. New door for the world.

  • server

    A server is a program made to process requests and deliver data to clients.

  • Machine learning

    Machine learning is a way of modeling and interpreting data that allows a piece of software to respond intelligently.

  • Game

    Some thing interesting about game, make everyone happy.

Recommend Org

  • Facebook photo Facebook

    We are working to build community through open source technology. NB: members must have two-factor auth.

  • Microsoft photo Microsoft

    Open source projects and samples from Microsoft.

  • Google photo Google

    Google โค๏ธ Open Source for everyone.

  • D3 photo D3

    Data-Driven Documents codes.