Unity UI 动画 工具

 文章目录

前言

一、目标

二、使用

1.编辑面板

2.脚本中使用

最后

---

前言

对于 Unity 中 UI 的动画来说，我们可以使用多种方式去制作，可以使用 Unity 的 Animation 实现，可是单纯手写，不过只有就可复用性就不高了。简单的动画我们使用 Animation 可以快速实现，但是其灵活性就差很多。所以一个好的工具是有必要的，UIAnimeTool 就是这样的理想助手。

---

一、目标

UI 的动画简单来说就是对于画面中各个元素的变化，可以是 位移、缩放、旋转、透明度 等的变化。而这些在 UIAnimeTool  中可以直观表现出来。

 

二、使用

1.编辑面板

Target RectTrans：动画的目标对象，所有的变换都是针对该目标对象实现的

Enable Animation：是否启用动画效果。如果不启用，则没有动画过渡，直接完成变换

Mask

Enable Mask：是否启用背景 mask 遮罩

Mask CanvasGroup：背景遮罩的目标对象。mask遮罩是使用 CanvasGroup来实现

 Enable Mask BlocksRaycasts：对背景遮罩是否启用拦截点击，启用后，则无法点击背景后的其他UI元素

 动画变换的属性：Position、Rotation、Scale、Alpha、Mask

Position：位置变换参数选项卡

Rotation：旋转变换参数选项卡

Scale：缩放变换参数选项卡

Alpha：透明度变换参数选项卡

Alpha：背景遮罩变换参数选项卡

各个动画属性均有的参数：Normal、Duration

 Normal.from：动画变换开始的值，对应Position动画来说就是，从什么位置开始进入

 Normal.stay：动画需要变换的值，对应Position动画来说就是，动画停留在什么位置

Normal.to：动画变换结束的值，对应Position动画来说就是，离开去什么位置

 Duration：所有变换的通用动画执行时长

Reset：重置from、stay、to的参数值为默认值

  每个动画属性都可以单独开启或关闭，动画的时长也可以独自自定义使用。

 Enable Anime：是否启用各自的动画。

From：对应 Normal.from到Normal.stay的动画变换参数

        Use Curse：使用自定义的动画曲线，如果不使用，则会使用预定义的动画曲线

        Use Local Duration：使用局部动画时长，当启用时，会忽略掉动画的通用时长Duration。

To：对应 Normal.stay到Normal.to的动画变换参数

        Use Backward：直接使用From 的参数值来执行To的动画

        Use Curse：同 From 的 Use Curse

         Use Local Duration：同 From 的 Use Local Duration

2.脚本中使用

UIAnimeTool.cs

/// <summary>
/// 动画显示进入执行，from -> stay
/// </summary>
public void Show(){}
        
/// <summary>
/// 动画隐藏退出执行，stay -> to
/// </summary>
public void Hide(){}



public bool isUseAnime = false;//是否使用动画
 
public RectTransform targetRectTrans{get;set}// 设置动画目标
        

public Action OnShowBefore;//动画 显示 前 可以执行的操作
public Action OnShowAfter;//动画 显示 后 可以执行的操作
 
public Action OnHideBefore;//动画 隐藏 前 可以执行的操作
public Action OnHideAfter;//动画 隐藏 后 可以执行的操作

具体使用可参考 demo 示例。

---

最后

以上就是对 UIAnimeTool  的简单介绍，如果觉得不错，欢迎 star ❤~