lua 基于C#DOTween 插件封装的 utils.animation库 (类似于 animation.css库)
导语
之前接触过还在做web的时候接触过Animation.css库，在现在转行做Unity之后，lua 代码开发成了一种主流（C#无法被替代），每次针对动画需求就会进行费事费力的动画编辑，我就自己封装了几种常用的动画类型，不用改变一开始就去修改预设体，方便后期的优化，调用方法也是比较方便的，基于DOTween的队列动画思路，分步骤实现动画。
具体实现（需要向动画节点添加一个Canvas Groups 组件）
--动画第一阶段
local function ani_first_step( )
animation.movinginto(icon_bg,ani_manager[1])
end
--动画第二阶段
local function ani_scend_step( )
animation.fadeInOut(figure.gameObject,ani_manager[5])
animation.lightFadeIn(figure_bg.gameObject)
animation.lightFadeIn(light.gameObject)
animation.changeRotate(roundness.gameObject)
end
--动画第三阶段
local function ani_third_step( )
animation.scalingAni(text.gameObject,ani_manager[3])
animation.scalingAni(text.gameObject,ani_manager[4])
animation.fadeInOut(text_bg.gameObject,ani_manager[5])
end
--动画第四阶段
local function ani_fourth_step( )
animation.movinginto(icon_panel.gameObject,ani_manager[2])
end
--动画执行
local ani = DOTween.Sequence()
ani:InsertCallback(0,ani_first_step)
ani:InsertCallback(0.2,ani_scend_step)
ani:InsertCallback(0.6,ani_third_step)
ani:InsertCallback(0.9,ani_fourth_step)
ani:Play()
utils.animation.lua 库
-- lua 动画函数（调用C# DOTween插件）
local animation = {}
--物体旋转动画(锚点为圆心)
function animation.changeRotate(_go,_time)
local trans = _go.transform
local ani = DOTween.Sequence()
ani:Append(trans:DORotate(Vector3.New(0,0,90),_time):SetEase(Ease.Linear))
ani:Append(trans:DORotate(Vector3.New(0,0,180),_time):SetEase(Ease.Linear))
ani:Append(trans:DORotate(Vector3.New(0,0,-90),_time):SetEase(Ease.Linear))
ani:Append(trans:DORotate(Vector3.New(0,0,0),_time):SetEase(Ease.Linear))
ani:Play():SetLoops(-1)
end
--呼吸灯动画（淡入淡出循环）
-- 参数Tab格式
--[[
_tab = {
Max_alpha = 1, -- alphe最大值
Min_alpha = 0.5, -- alphe最小值
ani_time = 0.75, -- 单次呼吸动画时间
}
]]
function animation.lightFadeIn(_go,_tab)
local canvas = utils.getcanvas(_go)
canvas.alpha = _tab.Min_alpha
local ani = DOTween.Sequence()
ani:Append(canvas:DOFade(_tab.Max_alpha, ani_time):Play())
ani:Append(canvas:DOFade(_tab.Min_alpha, ani_time):Play())
ani:Play():SetLoops(-1)
end
--调节物体透明度
-- 参数Tab格式
--[[
_tab = {
islucency = ture, -- 是否透明
alpha = 0.5 -- alpha值
}
]]
function animation.lucency(go,_tab)
local _go = utils.getcanvas(go)
if _tab.islucency then
if _tab.alpha then
_go.alpha = _tab.alpha
else
_go.alpha = 0
end
else
_go.alpha = 1
end
end
--物体缩放动画
-- 参数Tab格式
--[[
_tab = {
start_scale = 1, -- 起始尺寸
scaleTime = 3, -- 缩放尺寸
_ani_time = 0.5, -- 动画时间
}
]]
function animation.scalingAni(_go,_tab)
local go = _go.transform
local trans = go.localScale
trans = Vector3(_tab.start_scale,_tab.start_scale,_tab.start_scale)
local canvas = utils.getcanvas(_go)
canvas.alpha = 0
canvas:DOFade(1, 0.2):Play()
local scale
local tween = nil
scale = Vector3(_tab.scaleTime,_tab.scaleTime,_tab.scaleTime)
tween = go:DOScale(scale, _tab._ani_time):SetEase(Ease.Linear)
tween:Play()
end
--物体折返动画
--[[
_tab = {
way = 1, -- 1 x轴 2 y轴 3 z轴
show_time = 0.75 -- 透明度变为1 的时间
start_pos = 700 -- 物体移动到屏幕外的位置
end_pos = 0 -- 物体最后停留的位置
transtime = 0.5 -- 物体从最后停留位置移动到屏幕外的时间
endtime = 0.5 -- 物体从屏幕外移动回来的时间
}
]]
function animation.movinginto(_go,_tab)
local obj_rect = utils.getrect(_go)
local obj_group = utils.getcanvas(_go)
obj_group.alpha = 0
obj_group:DOFade(1, show_time):Play()
local ani = DOTween.Sequence()
if _tab.way == 1 then
ani:Append(obj_rect:DOAnchorPosX(_tab.start_pos,_tab.transtime))
ani:Append(obj_rect:DOAnchorPosX(_tab.end_pos,_tab.endtime))
elseif _tab.way == 2 then
ani:Append(obj_rect:DOAnchorPosY(_tab.start_pos,_tab.transtime))
ani:Append(obj_rect:DOAnchorPosY(_tab.end_pos,_tab.endtime))
elseif _tab.way == 3 then
ani:Append(obj_rect:DOAnchorPosZ(_tab.start_pos,_tab.transtime))
ani:Append(obj_rect:DOAnchorPosZ(_tab.end_pos,_tab.endtime))
end
ani:Play()
end
--物体队列进入动画
--[[
_tab = {
way = 1, -- 1 x轴 2 y轴 3 z轴
start_pos = 800, -- 屏幕外位置
end_pos = 0, -- 动画结束停留的位置
go_size = 102, -- 物体的宽高（根据方向判断）
child_count = 6 -- 加入队列的个数
space = 60 -- 间隔距离
}
]]
function animation.queuetoenter(_go_parent,_tab)
--从原位置上移动到屏幕外
for i = 1, _tab.child_count do
local child_go = utils.findobj(_go_parent,"/"..i)
animation.movinginto(child_go,_tab.way,_tab.start_pos,_tab.end_pos)
end
--从屏幕外队列移动到原位置
for i = 1,_tab.child_count do
local icon = utils.findobj(_go_parent,"/"..i)
local start = _tab.go_size
local space = i*_tab.space
local index = i
local obj_rect = utils.getrect(icon)
local ani = DOTween.Sequence()
ani:Append(obj_rect:DOAnchorPosX(start+space,0.8*index))
ani:Play()
index = index+1
end
end
--物体翻转动画
--[[
_tab = {
way = 1 -- 1 x轴 2 y轴 3 z轴
size = 400 -- gameobject 的 size
transtime = 1 -- 动画时间
isscale = false -- 是否缩放
Max_scale = 1.5 -- 翻转过程中的最大尺寸
}
]]
function animation.overturn(_go,_tab)
local scale = 1
if _tab.isscale then
scale = Max_scale
end
if _tab.way = 1 then
scale = Vector3(scale,1,1)
elseif _tab.way = 2 then
scale = Vector3(1,scale,1)
elseif _tab.way = 3 then
scale = Vector3(1,1,scale)
end
tween = _go:DOScale(scale, _tab.transtime):SetEase(Ease.Linear)
end
--物体淡入淡出动画
--[[
_tab = {
type = 1 -- 1 淡入 2 淡出
Max_fade_parameter = 1 -- 最大alphe 值
Min_fade_parameter = 0 -- 最小alphe 值
transtime = 0.5 -- 动画时间
}
]]
function animation.fadeInOut(_go,_tab)
local obj_rect = utils.getrect(_go)
local obj_group = utils.getcanvas(_go)
if type == 1 then
obj_group.alpha = 0
obj_group:DOFade(_tab.Max_fade_parameter, _tab.transtime):Play()
elseif type == 2 then
obj_group.alpha = 1
obj_group:DOFade(_tab.Max_fade_parameter, _tab.transtime):Play()
end
end
结语
一开始做这个动画工具库的时候，想法是尽量让代码复用，使代码变得更加简洁，更具有可读性，尽量让前端程序员的时间留出来在做功能上，让美术或者策划这类有直接需求的同事来进行配置，提高一部分的效率。这个库我会持续更新，也欢迎大家评论补充，或者根据需求自己封装。