
用FLASH模拟钟摆运动,运用补间动画家逐帧动画修饰,是一个组合的运用。
方法/步骤
打开FLASH软件程序,并建立一个FLASH文档;
请点击输入图片描述
选择钢笔工具,将笔触关闭,填充选择绿色;
请点击输入图片描述
请点击输入图片描述
绘制一个钟摆的模型进行调整;
请点击输入图片描述
请点击输入图片描述
将其转换为元件,命名为钟摆;
请点击输入图片描述
请点击输入图片描述
将中心已至上面摆轴的位置;
请点击输入图片描述
分别在10、20、30、40、50、60、70、80、90、100帧设立关键帧;并且在相邻的帧间添加补间动画;
请点击输入图片描述
请点击输入图片描述
导出动画,格式GIF,动画绘制完毕。
请点击输入图片描述
请点击输入图片描述
请点击输入图片描述
注意事项
注意箭头
注意个关键帧的调整是否连续
Towify 中的动画可以为组件设置多种动画效果,快来1秒Get如何配置!
效果展示使用动画效果中的旋转动画,同时配置触发器行为:执行其它动画。实现点击播放动画的效果。
触发器配置注意:在检查器面板中的触发器设置面板创建触发器,可以对组件进行交互逻辑设置,或配合事件来进行动态数据 *** 作。
选中音频组件
点击检查面板中的触发器
创建一个触发行为:执行其它动画的触发器
注意:在……时是一种监听行为的触发时机,在当前案例中,使用了监听音频的状态。
选中音频组件
点击检查面板中的触发器
创建触发行为:在……时的触发器
注意:激活有两种状态,分别为激活和非激活,激活对应了样式中的Selected状态,而非激活对应了样式中的Default状态
选中音频组件
点击检查面板中的触发器
创建触发行为:激活的触发器
这样就可以配置旋转动画了。
小程序和html页面有点不同,主要是使用js来实现动画效果,因为小程序自身有提供一种方式:wx.createAnimation(OBJECT),它创建一个动画实例 animation ,通过调用实例的方法来描述动画。最后通过动画实例的export方法导出动画数据传递给组件的animation属性,step()来停止动画,step() 表示一组动画完成。
我们主要用wx:createAnimation({})来设置一些参数,例如持续时间、延时、加载方式等,用export()来开启动画,在页面上调用animation=”{{动画名称}}”。具体步骤:
1)创建动画对象并设置有效参数==>wx:createAnimation({参数:有效值})
2)创建一组动画,调用step()来表示一组动画的完成==>动画对象.动画效果.step()
3)在data中设置一个对象vip_animal(自己随意命名),用该对象开启动画==>this.setData({vip_animal: animation.export()})
4)在页面上调用动画对象==>animation="{{vip_animal}}"
例子:淡入淡出动画效果(当淡入动画生效后1.5s,淡出动画开始生效)
在wxml上调用animation="{{vip_animal}}"来显示
如果需要设置循环效果。我们可以设置:(setAnimation为)
另一种方式:
在wxml上调用style="{{style_img}}"来显示
欢迎分享,转载请注明来源:内存溢出
微信扫一扫
支付宝扫一扫
评论列表(0条)