[Mugeda HTML5技术教程之8]添加行为
上一节我们已经在新建的作品中添加了元素和动画,如果我们想要作品能够和用户互动,就需要给元素添加动作行为。在舞台上选中一个要添加动作的元素,在属性栏的动作下拉列表中选择一个动作。可选类别有链接、表单、行为。链接可以导航到网页;表单可以被编辑并提交;行为是更高级的动作方式(包括播放控制、过渡、调用电话功能、回调函数等)。后面会有详细介绍。


链接是在广告动画中比较常用的方式。通过链接的方式,我们可以再作品中加入想要用户浏览的一些链接。在动作下拉列表中选择“链接”后在后面的输入框中输入网址。然后选择链接的打开方式,有外部打开、内部打开和扩展显示。

如果选择外部打开,该链接将在默认浏览器下一个新的窗口/标签中打开,通常是一个独立的浏览器(例如iPhone的Safari浏览器)。

如果选择内部打开,在支持MRAID(广告行业中的一种标准)的容器中,链接将以扩大的显示尺寸(例如,扩展至全屏幕视图)和作品在同一个网页窗口/标签中被打开。在一个不支持MRAID的容器中(例如,移动设备浏览器),它和外部打开方式相同。

如果选择扩展显示,在支持MRAID的容器中,链接将在内部Web View容器中打开,通常是由MRAID SDK或容器提供一个内置的Web View。在一个不支持MRAID的容器(例如,手机浏览器)中,该链接将和作品在同一网页窗口/标签被打开。

行为是更高级的动作形式,包括播放控制、过渡、调用电话功能、回调函数等。可以再一个动作中添加多个行为。选择动作下拉列表中的“行为”项后,点击编辑,弹出编辑行为对话框,
选择并编辑想要添加的行为。播放控制,可以通过舞台的帧控制舞台动画的播放,有跳转并播放、跳转并停止、暂停、播放、下一帧、上一帧。过渡,主要在支持MRAID标准的环境中使用,有展开和改变大小。电话功能,可以调用手机等移动设备的本地功能,有打电话、发短信、发邮件、保存图片、日历事件、地图、播放视频、播放声音。其他选项主要是回调函数,通过回调可以再脚本代码中加入想要的事件触发是完成的操作,关于脚本添加后面的章节会有专门介绍。


添加后的行为需要进一步进行编辑,选择事件触发方式,有点击和出现两种,点击就是通过鼠标或者手指点击触发,出现就是当动画播放到这一帧(添加行为的元素所在的那一帧)时就会自动触发。
对添加上的行为要可以进行组织操作,上移、下移和删除,来改变多个行为出现的顺序

事件类型
点击:对象被点击时触发行为
出现:对象出现在舞台上时会触发行为(即使它是无形的,透明度=0)。使用“出现”触发行为的一个很好的例子是在一定时间内通过给一个对象分配“暂停”行为来暂停动画播放。
注意:某些行为(如发出呼叫)只能通过点击触发。

行为参数
每种行为可能有一个或多个参数,这取决于行为的性质(例如,一个用于发出呼叫的电话号码)。
每一个行为有一个可选的参数,称为“事件名称”,它是用来定义一些语义的标识。事件名称显示在跟踪报告中,对于评估参与的活动是有帮助的。

行为类别有控制播放、过渡、电话功能、其他。

播放控制,可以通过舞台的帧控制舞台动画的播放,有跳转并播放、跳转并停止、暂停、播放、下一帧、上一帧。

过渡,主要在支持MRAID标准的环境中使用,有展开和改变大小。

电话功能,可以调用手机等移动设备的本地功能,有打电话、发短信、发邮件、保存图片、日历事件、地图、播放视频、播放声音。

其他选项主要是回调函数,通过回调可以再脚本代码中加入想要的事件触发是完成的操作,关于脚本添加后面的章节会有专门介绍。

播放视频:案例

播放视频:设置参数

播放视频

表单,可以通过表单让用户填写一些信息,提交到服务器,来收集一些想要得到的数据。
还可以通过表单触动回调函数,让用户填写的信息通过参数的形式传递到回调中,从而在动画中反映出来,比如可以通过这种方式做一个可定制的贺卡,能用表单改变祝福语和落款。

提交目标中可以选择后台提交和回调函数,如果选择后台提交,需要填入提交地址;如果选择回调函数,需要填入函数名字。可以点击添加表单项来添加表单的表单项

总结,通过添加动作,我们可以再作品中完成各种互动的功能,大大拓展了动画的表现形式。
下一节,我们将要讲到元件,元件是一个可以在舞台上实例化和再利用的预先生成的独立动画。一个元件有它自己的时间轴(层,单位等),可以独立的显示动画。元件可用于创建复杂的动画效果。元件提高的动画的可重用性和灵活性,是个强大的存在。
[Mugeda HTML5技术教程之8]添加行为的更多相关文章
- [Mugeda HTML5技术教程之7]添加动画
前一节我们讲述了怎么在新建的作品中添加元素,元素加好以后我们还想让他们动起来,来实现比较炫的效果.这节我们将要讲述怎么给元素添加动画.Mugeda动画是通过时间轴和帧来实现的.通过在时间轴上创建图层和 ...
- [Mugeda HTML5技术教程之16]案例分析:制作跨屏互动游戏
本节我们将要做一个跨屏互动应用的案例分析,该应用时给一家商场做活动使用的,是一个跨屏爱消除游戏.PC端页面显示在连接在PC的大屏幕上,参与活动的玩家可以用自己的手机扫描PC端页面上的二维码,连接成功后 ...
- [Mugeda HTML5技术教程之14]案例分析:制作网页游戏
本文档要分析的案例是一个爱消除的网页小游戏,从中可以体会一些Mugeda API的用法和使用Mugeda动画制作网页游戏的方法. (一)游戏规则: 1.开始游戏时,手机出现在最上面一行的任意一格: 2 ...
- [Mugeda HTML5技术教程之2] Mugeda HTML5富媒体平台简介
[Mugeda HTML5技术教程之2] Mugeda HTML5动画平台简介 摘要:Mugeda提供基于云的平台,供开发人员和设计人员快速的开发.发布和统计基于HTML5的,包含丰富动画和交互的移动 ...
- [Mugeda HTML5技术教程之1] HTML5: 生存还是毁灭
[Mugeda HTML5技术教程] 开篇: HTML5 - 生存,还是毁灭 摘要:HTML5并不试图解决所有问题.但是在很多适合的场合,HTML5是不二选择. To be, or not to be ...
- [Mugeda HTML5技术教程之13]链接的添加方式
在广告主的需求中,有很多情况下需要在动画中添加一些外部链接.这份文档就在Mugeda动画中添加外部链接的方式,做一下梳理. 1.通过点击触发的链接 就是要用户点击屏幕来触发链接的情况,这是推荐使用的方 ...
- [Mugeda HTML5技术教程之11]Mugeda API简介
一.API 概述 Mugeda API 提供了一个简单的,结构化的方法来实时动态管理Mugeda内容.它提供了一下方法: •访问Mugeda内容中的对象. •获取和设置对象属性,如位置.旋转.比例.不 ...
- [Mugeda HTML5技术教程之4] Studio 概述
Mugeda Studio 是基于云平台的制作HTML5动画的专业可视化集成开发环境,可以让你在不需要安装客户端程序的情况下,只通过浏览器就能轻松创作高质量的HTML5动画.HTML5动画相对于传统的 ...
- [Mugeda HTML5技术教程之18]如何在Android应用中使用Mugeda动画内容
1.简介 本文主要介绍如何在Android应用程序中使用Mugeda动画.Mgeda动画是标准HTML5格式的动画,在Android应用程序中可以使用WebView来加载Mugeda动画.动画内容本身 ...
随机推荐
- IE10的bug?disabled button如何触发事件
最近碰到一个问题,IE10下的,貌似是个bug,求助! 问题表现为:在内部有dom元素的情况下,disabled状态的button会因为子元素的mouseover产生事件冒泡而触发,也就是说,disa ...
- 文件夹Tab Ctrl
http://blog.163.com/gz_ricky/blog/static/1820491182011061180897/ 转载 Tab Ctrl Tab属性页控件可以在一个窗口中添加不同的页面 ...
- 关于Android WebView内容不同屏幕兼容处理
最近团队里项目开发APP时,其中有个界面要用到WebView来显示,而不用原生的控件. 开发这个界面的时候遇到一个问题,就是Android的碎片化导致有众多屏幕分辨率,不同分辨率的屏幕对这个界面Web ...
- PHP Java
http://my.oschina.net/lajp/blog/5121 http://blog.163.com/lijianwei_123/blog/static/18489289120115244 ...
- 调整altium designer15的十字光标大小
在左上角的DXP下preferences中调整.首先打开该窗口. 1.原理图:schematic-----graphical editing,此窗口中cursor栏有个cursor type,其下拉菜 ...
- 用vlc SDK创建一个播放视频文件和RTSP流视频的Demo
#include <stdio.h> #include <tchar.h> #include <time.h> #include <windows.h> ...
- ss命令,显示socket状态
ss命令用于显示socket状态. 他可以显示PACKET sockets, TCP sockets, UDP sockets, DCCP sockets, RAW sockets, Unix dom ...
- JAVA 面试整理,面试汇总
1.JAVA是通过重写和重载来实现多态性的. 重写:同样的方法签名,不同的方法实现 重载:同样的方法名,不同的参数类型或参数个数 2.JAVA中如果存在不再使用的对象,但是程序又持有该对象的引用,就会 ...
- 修改http中的refer(转)
Referrer的重要性 HTTP请求中有一个referer的报文头,用来指明当前流量的来源参考页.例如在www.sina.com.cn/sports/上点击一个链接到达cctv.com首页,那么就r ...
- JS浏览器对象-Screen对象
代码: <!DOCTYPE html> <html> <head> <meta charset="UTF-8"> <title ...