99 lines
4.3 KiB
Markdown
99 lines
4.3 KiB
Markdown
# DOTween Timeline
|
|
[](LICENSE)
|
|
|
|
A pocket timeline solution for DOTween Pro. Configure and organize complex tween animations directly in the Inspector.
|
|
|
|
|
|
|
|
## Installation
|
|
> [!IMPORTANT]
|
|
> **Required**: [**PRO**](https://dotween.demigiant.com/pro.php) version of DOTween.
|
|
|
|
### Releases page
|
|
Easiest way is to install DOTween Timeline as an asset package.
|
|
1. Download the latest ```.unitypackage``` file from the [Releases page](https://github.com/medvejut/dotween-timeline/releases).
|
|
2. Import it into your project via **Assets > Import Package > Custom Package**.
|
|
|
|
### Git UPM
|
|
You can also install this package via Git URL using Unity Package Manager.
|
|
1. Since DOTween is not distributed as a upm package by default, you need to manually generate `.asmdef` files for it:\
|
|
Open **Tools > Demigiant > DOTween Utility Panel**, click **Create ASMDEF**
|
|
2. Then, add the following line to your `Packages/manifest.json`:
|
|
```
|
|
"com.medvejut.dotweentimeline": "https://github.com/medvejut/dotween-timeline.git#upm"
|
|
```
|
|
|
|
## How to use
|
|
Add the **DOTween > DOTween Timeline** component to a GameObject (use a separate GameObject for each animation sequence).
|
|
|
|
Control the timeline from code:
|
|
|
|
```c#
|
|
[SerializeField] private DOTweenTimeline timeline;
|
|
|
|
var tween = timeline.Play();
|
|
|
|
tween.OnComplete(() => Debug.Log("OnComplete"));
|
|
tween.Pause();
|
|
```
|
|
|
|
### Sample
|
|
A sample scene is included to help you get started. You can find it here: `Plugins/DOTweenTimeline/Sample`\
|
|
Open it to see an example of how to configure and use the timeline in practice.
|
|
<details>
|
|
<summary>To make the sample scene work, enable TextMeshPro support in DOTween and set up TMP.</summary>
|
|
|
|
1. Go to **Tools > Demigiant > DOTween Utility Panel**, press **"Setup DOTween..."**, enable **TextMeshPro**:
|
|
|
|
2. **Window > TextMeshPro > Import TMP Essential Resources**
|
|
</details>
|
|
|
|
## Recommendations
|
|
|
|
#### 1. Disable default DOTween Pro preview controls
|
|
In the Inspector, on any DOTween animation component:
|
|
|
|
|
|
|
|
#### 2. Use a separate GameObject for each animation sequence
|
|
|
|
|
|
|
|
## Extras
|
|
### DOTween Timeline Player component
|
|
Automatically plays animations without code.\
|
|
Just add the **DOTween > DOTween Timeline Player** component to the same GameObject with the Timeline.
|
|
|
|
### Extra Actions
|
|
In addition to standard tweens, you can add special timeline actions via the Add dropdown:\
|
|
|
|
|
|
#### DOTweenCallback component
|
|
A visual replacement for Sequence.InsertCallback().\
|
|
Use the `onCallback` UnityEvent in the Inspector or from code:
|
|
```c#
|
|
[SerializeField] private DOTweenCallback callback;
|
|
|
|
callback.onCallback.AddListener(() => Debug.Log("Callback"));
|
|
```
|
|
<img width="477" src="https://github.com/user-attachments/assets/746fca7e-1d70-4127-ba92-330c0f7470e6" />
|
|
|
|
#### DOTweenFrame component
|
|
Triggers immediate state changes in a single frame.\
|
|
Perfect for setting position, rotation, color, and more, without animation.
|
|
|
|
<img width="490" src="https://github.com/user-attachments/assets/df9226e8-dc83-419b-b1ca-daaf6b70811a" />
|
|
|
|
#### DOTweenLink component
|
|
A reference to another Timeline. Useful for complex animations with a large number of child tweens.\
|
|
See the Sample scene for usage details.
|
|
|
|
<img width="343" height="156" alt="image" src="https://github.com/user-attachments/assets/114cc9bc-8d4b-4373-a896-fa94f5c45023" />
|
|
|
|
## Contributing
|
|
Please report bugs in [Issues](https://github.com/medvejut/dotween-timeline/issues).\
|
|
Feel free to ask questions and share thoughts in [Discussions](https://github.com/medvejut/dotween-timeline/discussions).
|
|
|
|
**This project is inspired by:**\
|
|
[Animation Creator Timeline (UI Tween)](https://assetstore.unity.com/packages/tools/animation/animation-creator-timeline-ui-tween-186589)\, [DOTween Timeline Preview](https://www.youtube.com/watch?v=hrX0xZ3JCXU) & [Jitter](https://jitter.video/)
|