UTween

<div align="center"> <img src="images/Logo_1200x284.png" width = "480" height = "112"/> </div>

UTween is an interpolation animation component for Unity. You can quickly configure animations through built-in components or write animations through code.

[中文文档]

Official QQ Group：1070645638

<!-- vscode-markdown-toc -->

• 1. Quick Start
  • 1.1. Features
  • 1.2. Environment
  • 1.3. Preview
  • 1.4. Installation
• 2. Parameter
• 3. Built-in Function
  • 3.1. Core
    • 3.1.1. Tweener
    • 3.1.2. TweenManager
    • 3.1.3. TweenPool
    • 3.1.4. TweenAnimation
    • 3.1.5. TweenAnimationAsset
  • 3.2. Data Type
  • 3.3. Ease Function
    • 3.3.1. Standard
    • 3.3.2. Additional
  • 3.4. Tween Type
• 4. Execute Flow
• 5. Performance Testing
• 6. Usage Example
  • 6.1. Common Usage
  • 6.2. Chain Style
  • 6.3. Quick API
  • 6.4. Unity Component Extension
  • 6.5. Sequential / Parallel
  • 6.6. Dynamic Start / End
  • 6.7. Animation Group
  • 6.8. Configuration Assets
• 7. User Extension
  • 7.1. Add Custom Ease Function
  • 7.2. Add Custom Interpolation Animation
• 8. The End

<!-- vscode-markdown-toc-config numbering=true autoSave=true /vscode-markdown-toc-config --> <!-- /vscode-markdown-toc -->

1. <a name='QuickStart'></a>Quick Start

1.1. <a name='Features'></a>Features

• Provide detailed parameters to achieve high freedom of custom animation.
• Built-in animation realization of translation, rotation, scaling, value, color, etc. of a large number of commonly used components.
• Built-in a large number of commonly used ease functions, and provide custom curves for independent setting of different axes.
• Provide three usage modes of editor component, configuration file and code call.
• All animations can be exported and saved as configuration files to realize animation resource management and reuse.
• Support dynamic starting point, dynamic adjustment of parameters during animation (only available in script mode).
• Provide high-performance material animation based on MaterialPropertyBlock.
• Except for animations related to operating strings, it basically achieves 0 GC.
• Good chain programming support.

1.2. <a name='Environment'></a>Environment

1.3. <a name='Preview'></a>Preview

Add components and use rich built-in animation and easing functions:

<div align="center"> <img src="images/UTween_TwweenType_EaseType.gif"/> </div>

Build-in ease functions:

<div align="center"> <img src="images/UTween_EaseCurvePreview.gif"/> </div>

Support each axis independent curve:

<div align="center"> <img src="images/UTween_InspectorMultiCurve.png"/> </div>

The editor previews the animation in real time, what you see is what you get:

<div align="center"> <img src="images/UTween_EditorPreview.gif"/> </div>

Built-in curve path editor:

<div align="center"> <img src="images/UTween_PathEditor.gif"/> </div>

1.4. <a name='Installation'></a>Installation

• 1. Download the latest release version of unitypackage.
• 2. Install via OpenUPM:

openupm add com.ls9512.utween

• 3. Install via Unity Package Manager - Git URL:

"com.ls9512.utween": "git+https://github.com/ls9512/utween"

• 4. Download the repository source code and install it manually.
• 5. May be released to AssetStore in the future.

2. <a name='Parameter'></a> Parameter

• From: Starting value for interpolation

• To: The end of the interpolation

• Curve: Custom interpolation animation curve will be accumulated on the calculation result of the easing function

• Curve Target: You can choose whether the calculation result of the curve is applied to the interpolation factor or the value of the interpolation result

• Curve Mode: You can choose a single curve to act on the whole or use separate curve control for each axis

• Play Type: Play type, optional Once, Loop, LoopCount, PingPong, PingPongCount

• Ease Type: Built-in easing function type, the default is linear, there are many optional effects, please test by yourself.

• Loop Count: Loop count

• Duration:: Duration of interpolation process, unit s

• Interval: Repeat interval time, only available in Loop and PingPong modes

• Speed Based: Based on speed instead of time interpolation, the Duration parameter will be used as the speed value when selected

• Start Delay: Delay time of interpolation start, unit s

• Auto Play: Timing of auto play, default None, no auto play, optional Awake, Start, Enable, if you select Enable, it will be triggered multiple times

• Update Type: Calculate the timing of the update, adjust it according to the actual needs of the animation, the default is Update, optional LateUpdate and FixedUpdate

• Time Scale: Time scale, determine whether the animation is affected by the time scale speed change, you can control the separation of the interpolation animation from the game process

• Self Scale: Self time scaling, used to adjust the animation playback speed, will change the actual running time of the animation

• Time Smooth: Whether to use Time.smoothDeltaTime to prevent the animation from jittering due to frame rate fluctuations, only available when Time Scale is true

• Auto Kill: Whether to automatically destroy after playing (only valid for non-infinite loop type playback)

• Callback: Used to register callbacks at the beginning and end of interpolation

---

3. <a name='Built-inFunction'></a>Built-in Function

3.1. <a name='Core'></a>Core

3.1.1. <a name='Tweener'></a>Tweener

The smallest component that realizes a single animation effect corresponds to a complete set of animation parameters, and each Tweener component runs independently.

3.1.2. <a name='TweenManager'></a>TweenManager

It is used to manage and schedule all Tweener components, maintain all TweenPools, is controlled by the Unity MonoBehaviour life cycle, and provides Update / LateUpdate / FixedUpdate update modes.

3.1.3. <a name='TweenPool'></a>TweenPool

The internal object pool of the component is used for the recycling and reuse of Tweener components.

3.1.4. <a name='TweenAnimation'></a>TweenAnimation

Tweener's editor class, used to configure animation in Inspector, and provide different configuration interfaces for different Tweeners. But TweenAnimation itself does not provide any logical functions, the operation of animation still relies on TweenManager, and components only provide data and configuration interfaces.

3.1.5. <a name='TweenAnimationAsset'></a>TweenAnimationAsset

Animation configuration resource files based on ScriptableObject can be imported and exported from TweenAnimation, and can be called by code to create animation.

3.2. <a name='DataType'></a>Data Type

• float
• Vector2
• Vector3
• Vector4
• Quaternion
• Color
• Rect
• Transform(Position Vector3/Rotation Vector3/Scale Vector3)

3.3. <a name='EaseFunction'></a>Ease Function

3.3.1. <a name='Standard'></a>Standard

• Linear
• Circular
• Quad
• Cubic
• Cubic
• Quart
• Sine
• Expo
• Circ
• Back
• Bounce
• Elastic

3.3.2. <a name='Additional'></a>Additional

• Flash
• Step
• Parabola
• Trigonometric

3.4. <a name='TweenType'></a>Tween Type

• Position
• Poition UGUI
• Rotation EulerAngles
• Rotation Quaternion
• Scale
• Transform
• Size
• Width
• Height
• Color
• ColorBlock
• Alpha
• CanvasGroup Alpha
• AudioSource Volume
• Scrollbar
• Slider
• Text
• Shkae
• Value
• Material Color
• Material Float
• Material Tilling
• Material OFfset
• Material Vector4
• Gradient
• Path
• Sequence
• Parallel

4. <a name='ExecuteFlow'></a>Execute Flow

• Prepare all necessary parameters.
• Calculate the interpolation factor through RunTime / Duration.
• Substitute the actual interpolation factor into the EaseFunction of the corresponding EasyType to calculate.
• When CurveMode == Factor, multiply the difference factor by the curve calculation result.
• Use the final interpolation factor to calculate the interpolation result value.
• When CurveMode == Value, multiply the interpolation result by the curve calculation result.
• Apply the interpolation result to