Bolt 动画
引擎内置的 种动画
--PosChangeAnimation 平移
local ani = XLGetObject("Xunlei.UIEngine.AnimationFactory"):CreateAnimation("PosChangeAnimation")
ani:BindObj(imageObj)
ani:SetTotalTime()
ani:SetLoop(true)
ani:SetKeyFramePos(,,,)
imageObj:GetOwner():AddAnimation(ani)
ani:Resume() --AngleChangeAnimation 旋转
local ani = XLGetObject("Xunlei.UIEngine.AnimationFactory"):CreateAnimation("AngleChangeAnimation")
ani:BindObj(imageObj)
ani:SetKeyFrameAngle(,,,,,)
ani:SetTotalTime()
ani:SetLoop(true)
ani:SetBlendMode("AntiAlias")
imageObj:GetOwner():AddAnimation(ani)
ani:Resume() --AlphaChangeAnimation 透明度
local ani = XLGetObject("Xunlei.UIEngine.AnimationFactory"):CreateAnimation("AlphaChangeAnimation")
ani:BindRenderObj(imageObj)
ani:SetTotalTime()
ani:SetKeyFrameAlpha(,)
imageObj:GetOwner():AddAnimation(ani)
ani:Resume() --SeqFrameAnimation 序列帧
local ani = XLGetObject("Xunlei.UIEngine.AnimationFactory"):CreateAnimation("SeqFrameAnimation")
ani:BindImageObj(imageObj)
ani:SetTotalTime()
ani:SetLoop(true)
ani:SetResID("ImageSeq.BoltTest.SeqAni")
imageObj:GetOwner():AddAnimation(ani)
ani:Resume() --TurnObjectAnimation 对象1旋转到对象2
local imageObj2 = ctrlObj:GetControlObject("TestAni2.Texture")
local ani = XLGetObject("Xunlei.UIEngine.AnimationFactory"):CreateAnimation("TurnObjectAnimation")
ani:BindRenderObj(imageObj1,imageObj2)
ani:SetFlag("RoundY")
ani:SetTotalTime("")
imageObj1:GetOwner():AddAnimation(ani)
ani:Resume() --MaskChangeAnimation MaskObject 位置改变
local maskObj = ctrlObj:GetControlObject("MaskAni.Mask")
local uiObject = ctrlObj:GetControlObject("MaskAniBkg.Texture")
local ani = XLGetObject("Xunlei.UIEngine.AnimationFactory"):CreateAnimation("MaskChangeAnimation")
ani:BindMaskObj(maskObj)
ani:SetMaskKeyFrame(,,,,,-,,)
ani:SetLoop(true)
ani:SetTotalTime()
maskObj:GetOwner():AddAnimation(ani)
ani:Resume() MaskObject 的使用方法参考相关文档;
注意这里只调用了 BindMaskObj 而没有调用 BindTargetObj ,不知道为啥调用了 BindTargetObj 之后动画并不会被执行
注意:不知道为啥旋转动画不能在OnInitControl里面直接使用,需要用AsynCall调用才行:
function OnInitControl(ctrlObj)
local imageObj = ctrlObj:GetControlObject("TestAni.Image") AsynCall(function() -- 异步调用
-- AngleChangeAnimation 旋转
local rotateAni = XLGetObject("Xunlei.UIEngine.AnimationFactory"):CreateAnimation("AngleChangeAnimation")
rotateAni:BindObj(imageObj)
rotateAni:SetKeyFrameAngle(,,,,,)
rotateAni:SetTotalTime()
rotateAni:SetLoop(false)
rotateAni:SetBlendMode("AntiAlias")
imageObj:GetOwner():AddAnimation(rotateAni)
rotateAni:Resume()
end)
end 自定义动画:
在 xml 文件里定义动画模版:
<animation_def class="BoltTest.ani">
<method_def>
<Action file="MainWnd.xml.lua" func="BoltTestAni_Action"/>
<BindObj file="MainWnd.xml.lua" func="BoltTestAni_BindObj"/>
<GetBindObj file="MainWnd.xml.lua" func="BoltTestAni_GetBindObj" />
</method_def>
</animation_def> 在 lua 文件里使用动画:
function BoltTestAni_Action(aniSelf)
local attr = aniSelf:GetAttribute()
local bindObj = attr.BindObj
if bindObj == nil then
return
end local totalTime = aniSelf:GetTotalTime()
local runningTime = aniSelf:GetRuningTime() --[[ 按时间缩小
local progress = (totalTime - runningTime) / totalTime
if progress < 0 then
progress = 0
end
local l,t,r,b = bindObj:GetObjPos()
bindObj:SetObjPos(l,t,r,t+(b-t)*progress)
--]] -- 按指定间隔切换图片
local frameTime =
local progress = runningTime / frameTime +
if progress > then
progress =
elseif progress < then
progress =
end
progress = math.floor(progress)
bindObj:SetResID("Bitmap.BoltTest.SeqAni"..progress)
end
function BoltTestAni_BindObj(aniSelf, obj)
local attr = aniSelf:GetAttribute()
attr.BindObj = obj
end
function BoltTestAni_GetBindObj(aniSelf)
local attr = aniSelf:GetAttribute()
return attr.BindObj
end 注意:XLUE 每隔 / 秒刷新一次界面,每次刷新时改变对象的状态,这是自定义动画的基本原理;
Action 方法每隔 / 秒调用一次;
BindObj 方法里通过 attr 表来保存要渲染的对象;
GetRuningTime 方法获取动画的运行时间,因为是每隔 / 秒调用一次 Action 方法,所以 GetRuningTime 也是每隔 / 递增 动画的状态改变事件:
-- state: 0 动画未绑定对象;1 动画准备就绪;2 动画正在执行;3 动画暂停; 4 动画结束
ani:AttachListener(true, function(aniSelf, oldState, newState)
-- TODO
end)
注意这里,如果设定动画 SetLoop(true) state 将在 和 之间转换;
对一个动画进行 Stop,state 变为 而不是 ;也就是动画结束而不是动画暂停;
对一个动画进行 Stop,再调用 resume 并不能够使暂停的动画重新开始;
对一个动画进行 Stop,该动画实例即失效,需要重新创建该动画才能使动画重新运行 同时执行多个动画:
将多个动画对象绑定到同一个 UIObject 上即可:
-- PosChangeAnimation 平移
local ani = XLGetObject("Xunlei.UIEngine.AnimationFactory"):CreateAnimation("PosChangeAnimation")
ani:BindObj(imageObj)
ani:SetTotalTime()
ani:SetLoop(false)
ani:SetKeyFramePos(,,,)
imageObj:GetOwner():AddAnimation(ani)
ani:Resume() --SeqFrameAnimation 序列帧
local ani = XLGetObject("Xunlei.UIEngine.AnimationFactory"):CreateAnimation("SeqFrameAnimation")
ani:BindImageObj(imageObj)
ani:SetTotalTime()
ani:SetLoop(true)
ani:SetResID("ImageSeq.BoltTest.SeqAni")
imageObj:GetOwner():AddAnimation(ani)
ani:Resume()
注意这里,不知道为啥 AngleChangeAnimation 旋转动画跟 SeqFrameAnimation 序列帧动画不能一起用; 执行动画序列:
local function StartAnimSequence(onFinish, ...)
local function StartAnim(aniIndex)
if arg[aniIndex] == nil then
onFinish()
return
end
arg[aniIndex]:AttachListener(true, function(aniSelf, oldState, newState)
if newState == then
StartAnim(aniIndex + )
end
end)
arg[aniIndex]:Resume()
end
StartAnim()
end
StartAnimSequence(function() return end, posAni, rotateAni)
尝试用这种方法封装一个执行动画序列的方法;发现不行,不知道为啥; 动画曲线:
在资源 xml 里定义 curve 资源,可使用 CurveTool 工具来定义:
<curve id="Curve.BoltTest.MyAni" type="bspline">
<controlpoint tp="0.000000" sp="0.000000"/>
<controlpoint tp="0.854396" sp="0.025281"/>
<controlpoint tp="0.859890" sp="0.977528"/>
<controlpoint tp="0.997253" sp="1.000000"/>
</curve>
在自定义动画里通过 Curve:GetProgress(tp) 传入一个时间,获取对应的进度:
local curve = aniSelf:GetCurve()
local tp = runningTime / totalTime
local progress = curve:GetProgress(tp)
利用这个 progress 来设定进度即可
Bolt 动画的更多相关文章
- 动画requestAnimationFrame
前言 在研究canvas的2D pixi.js库的时候,其动画的刷新都用requestAnimationFrame替代了setTimeout 或 setInterval 但是jQuery中还是采用了s ...
- 梅须逊雪三分白,雪却输梅一段香——CSS动画与JavaScript动画
CSS动画并不是绝对比JavaScript动画性能更优越,开源动画库Velocity.js等就展现了强劲的性能. 一.两者的主要区别 先开门见山的说说两者之间的区别. 1)CSS动画: 基于CSS的动 ...
- CSS 3学习——animation动画
以下内容根据官方文档翻译以及自己的理解整理. 1. 介绍 本方案介绍动画(animations).通过动画,开发者可以将CSS属性值的变化指定为一个随时间变化的关键帧(keyframes)的集合.在 ...
- javascript动画系列第三篇——碰撞检测
前面的话 前面分别介绍了拖拽模拟和磁性吸附,当可视区域内存在多个可拖拽元素,就出现碰撞检测的问题,这也是javascript动画的一个经典问题.本篇将详细介绍碰撞检测 原理介绍 碰撞检测的方法有很多, ...
- 虾扯蛋:Android View动画 Animation不完全解析
本文结合一些周知的概念和源码片段,对View动画的工作原理进行挖掘和分析.以下不是对源码一丝不苟的分析过程,只是以搞清楚Animation的执行过程.如何被周期性调用为目标粗略分析下相关方法的执行细节 ...
- Visaul Studio 常用快捷键的动画演示
从本篇文章开始,我将会陆续介绍提高 VS 开发效率的文章,欢迎大家补充~ 在进行代码开发的时候,我们往往会频繁的使用键盘.鼠标进行协作,但是切换使用两种工具会影响到我们的开发速度,如果所有的操作都可以 ...
- transtion:过渡动画
p.p1 { margin: 0.0px 0.0px 0.0px 0.0px; font: 17.0px Monaco; color: #4f5d66 } p.p2 { margin: 0.0px 0 ...
- 再谈CAAnimation动画
CAAnimaton动画分为CABasicAnimation & CAKeyframeAnimation CABasicAnimation动画, 顾名思义就是最基本的动画, 老规矩先上代码: ...
- jQuery动画-圣诞节礼物
▓▓▓▓▓▓ 大致介绍 下午看到了一个送圣诞礼物的小动画,正好要快到圣诞节了,就动手模仿并改进了一些小问题 原地址:花式轮播----圣诞礼物传送 思路:动画中一共有五个礼物,他们平均分布在屏幕中,设置 ...
随机推荐
- jquery实现ajax,返回json数据
jquery实现ajax可以调用几种方法 我经常用的是$get(url,data,callback,type)方法 其中url是异步请求的页面(可以是.ashx文件),data是参数,callback ...
- windows7 64bit下安装Oracle 11g R2
Win7 bit64,安装的是64位的客户端. 1.PLSql连接数据库 (1)下载 instantclient-basic-win32-11.2.0.1.0.zip解压到Oracle要目当下 ...
- java之javadoc命令
[javadoc命令的用法] 1.java源文件里,注释以/**开始 并以*/结束,里面可以包含普通文件,HTML标记和javaDoc标记.这些将构成javaDoc文档. 2.javadoc命令只能处 ...
- [转] c和python利用setsockopt获得端口重用
假如端口被socket使用过,并且利用socket.close()来关闭连接,但此时端口还没有释放,要经过一个TIME_WAIT的过程之后才能使用.为了实现端口的马上复用,可以选择setsockopt ...
- Daject初探 - 一个开源关系型数据库对象关系映射(ORM)模型
Daject简介 Daject是用php写的一个关系型数据库抽象模型,通过该模型,可以在不写任何SQL或写很少的SQL就能执行大多数数据库查询操作.Daject具有面向对象,跨数据库的优点,通过数据库 ...
- VBS基础篇 - 运算符
VBScript 有一套完整的运算符,包括算术运算符.比较运算符.连接运算符和逻辑运算符. 运算符优先级: 首先计算算术运算符,然后计算比较运算符,最后计算逻辑运算符. 所有比较运算符的优先级相同,即 ...
- C# 生成二维码并且在中间加Logo
今天做项目的时候有个在生成二维码并且在中间加入Logo的需求,动手试了几把,总感觉效果没有之前写的好,就翻出旧代码,果然还是熟悉的味道,生成一张效果图如下 左边是微信里面的,右边是我自己生成的 原理比 ...
- ffmpeg 打开视频流太慢(上)
新版ffmpeg打开网络视频流需要调用avformat_find_stream_info方法,很多朋友会发现调用改方法耗费很多时间造成打开视频流太慢.有两个参数可以减少avformat_find_st ...
- P1676陶陶吃苹果 - vijos
描述 curimit知道陶陶很喜欢吃苹果.于是curimit准备在陶陶生日的时候送给他一棵苹果树. curimit准备了一棵这样的苹果树作为生日礼物:这棵苹果树有n个节点,每个节点上有c[i]个苹果, ...
- ./configure --prefix=
一直用这个选项prefix=,但不知道,啥意思. 转载自:----------------------------------------------------------------------- ...