starling 中 的特效】的更多相关文章

一. 最好用同一张图片进行缩放变形等处理后组合,这样可以每帧一draw…
starling 比较早之前就有开始解了,但只到最近参与一个用starling 做为框架的手游项目才真正做为一程来使用它. 项目也是刚开始搭建,在这做些笔记. 在写一个管理类时, 遇到 starling.events.EventDispatcher 和 flash.events.EventDispatcher, 这两者有什么区别呢,查了下手册 Package starling.events Class public class EventDispatcher Inheritance EventD…
一.(页面在向下滚动的时候,有些元素会产生细小的动画效果.虽然动画比较小,但却能吸引你的注意.) 刚知道wow.js这个插件,之前访问别的网站下拉滚动条会出现各种效果感觉特别神奇,现在自己依葫芦画瓢也能弄出来这种效果了. 虽然效果出来了,但是网上并没有整理好的各种特效对应的类名,所以写一篇通俗易懂(最起码自己能看懂)的文章供大家参考学习.(^_^) 二.首先说明一下怎么使用这个插件: 1.wow.js依赖于animate.css,首先在头部引用animate.css或者animate.min.c…
问题背景: 在做主线任务时发现完成任务后的特效显示穿透上面的UI层,不美观,策划不乐意了,抓紧解决下 解决思路: 首先讲下影响渲染顺序的因素: 能够影响渲染顺序的因素有:1.Camera Depth     相机组件上设置的相机深度,深度越大越靠后渲染. 2.Sorting Layer      在Tags & Layers设置中可见 3.Order In Layer 相对于Sorting Layer的子排序,用这个值做比较时只有都在同一层时才有效.4.RenderQueue     Shade…
基本特效 方法:                  说明 .show()              显示选中的元素 .hide()                隐藏选中的元素 .toggle()            在选中的元素上切换显示和隐藏的状态 淡入淡出效果 方法:                  说明 .fadeIn()           淡入选中元素使其变得不透明 .fadeOut()        淡出选中元素使其变得透明 .dadeTo()         修改选中元素的透…
API文档参考:http://doc.starling-framework.org/core/starling/utils/AssetManager.html 项目想以不改动starling的情况下对某些功能扩展,为的是方便starling升级后可直接替换, 之前写了个GAssetsMgr 接管了 纹理加载,方便文件缓存.还有一个问题是这个管理类是单一队列,并且只给外部传一个进度信息 loadQueue(onProgress), 当不断地往队列里加任务时,纹理回调会被明显推迟.于是想在尽量少改动…
1.wow.js依赖于animate.css,首先在头部引用animate.css或者animate.min.css. <link rel="stylesheet" type="text/css" href="css/animate.min.css"> 2.在最底部引用wow.js或者wow.min.js,然后再下面再写一行javascript代码.(无需引用jQuery) <script type="text/jav…
一个显示对象的默认原点在左上角.addChild 是将它的左上角放在了父容器的(0, 0)位置. 如果将该显示对象的PivotX 和 PivotY 修改为其宽高的一半,那么它的原点就变到了该对象的中心点.此时addChild 是将其中心点放在了父容器的(0, 0)位置. 参考:http://www.starlinglib.com/wiki/StarlingManual:%E9%80%8F%E8%A7%86%E5%9D%90%E6%A0%87…
<!DOCTYPE html> <html> <head lang="en"> <meta charset="UTF-8"> <title></title> <style> ul { list-style: none } * { margin: 0; padding: 0; } div { width: 1150px; height: 400px; margin: 50px auto…
关于这个问题,制作数据地图的方法已不新奇,总体来说有这么几类方案: 一类方案:直接在excel里制作 优势:个人小数据量应用较为方便简单 缺点:需要熟悉VBA,且更强大的功能对VBA水平要求较高 1.绘制地图图形 + VBA宏语言 思路:用插入图形"任意多边形"绘制地图:每一个"任意多边形"赋予正确名称:对"任意多边形"赋值:利用VBA对"任意多边形"的值进行操作, 例如上色. 先准备一张所需要的地图图片,网上都有,可以下载…
嗯,最近再考虑,CityHunter中,玩家攻略藏宝图时,为了增加可玩性,应该增强在AR部分的游戏性.最近特别火的游戏<Pokemon Go>在打开摄像头以后,可以看到小精灵,实际上,如果这款游戏没有这个功能,那整个游戏还真没有什么游戏的感觉(就是动画.图像之类的元素特别少).本人比较懒,没有去弄这款游戏,于是跟远在澳大利亚的高中老兄弟咨询了一下这款游戏的情况. 事实上,<Pokemon Go>的AR元素,实现还是比较简单的.可以理解为,只不过是单纯的打开了摄像头,把背景替换了一下…
Swf一键导出到Starling中的工具,在Starling使用原生的MovieClip 来自:http://zmliu.github.io/2013/11/09/StarlingSwfTool/ 如果你喜欢这个工具,请点击进入以上地址支持作者原创. 有些同学使用过程用遇到了问题.我开了一个QQ群.有问题的同学可以进来问一下群号是168436154 目录 1. StarlingSwf是什么 2. 功能与特色 3. 下载与安装 4. 教程一:资源命名规则 5. 教程二:针对设计师 6. 教程三:针…
以下是我自己用原生JS写的各种菜单特效,虽然网上一搜一大堆,但我还是喜欢自己来写一写! 这是上一篇:JavaScript实战(带收放动画效果的导航菜单) 下面是经过优化后的完整代码,优化了CSS样式.简化事件函数.减少HTML层级,删了至少20行以上的冗余代码 如果各位前辈有好的建议,记得一定留下你的宝贵意见! window.onload = function() { //========伸缩动画菜单 var ul = document.getElementById('ul'); if(ul.a…
HTML5现在本领太大了,PC端已经无法满足它的胃口了,它将强势攻入移动端,所以移动端中各种特效也得基于HTML5实现,看看我们将要介绍的slideout.js,能帮我们实现怎么样的侧边栏滑动特效呢~~ 先看下运行效果: 一.准备资料 只需要准备slideout.js库即可: https://github.com/Mango/slideout/blob/master/dist/slideout.js 小图标: 1)menu.png 2)happy.png 二.实现代码 HTML代码: <!doc…
* SVG * 基本内容 * SVG并不属于HTML5专有内容 * HTML5提供有关SVG原生的内容 * 在HTML5出现之前,就有SVG内容 * SVG,简单来说就是矢量图 * SVG文件的扩展名为".svg" * SVG使用的是XML语法 * 概念 * SVG是一种使用XML技术描述二维图形的语言 * SVG的特点 * SVG绘制图形可以被搜索引擎抓取 * SVG在图片质量不下降的情况下,被放大 * SVG与Canvas的区别 * SVG * 不依赖分辨率 * 支持事件绑定 *…
      通常的日本动画的摄影中,是以追加Cell(celluloid 赛璐珞)与背景的合成滤镜处理为主,而在[Fate/kaleid liner 魔法少女☆伊莉雅]系列的,加入了自己使用3DCG软件来制作特效素材的新的摄影风格.   作为最后工程的摄影,也可以受益于3DCG软件 已经放映结束的本人气系列的第3季,[魔法少女☆伊莉雅 2wei Herz! ]中, Asahi Production 的中西康祐摄影导演带领的小组,在[Cell与CG的崭新融合]的概念下,实践了最新摄影工作流.  …
------------------------------------------------------------------ 这里的舞台是flash原生舞台,不是starling舞台 // register other event handlersstage.addEventListener(Event.ENTER_FRAME, onEnterFrame, false, 0, true);stage.addEventListener(KeyboardEvent.KEY_DOWN, onK…
我们的山寨Starling版本将会在这里停止更新了,主要还是由于时间比较有限,而且我们的山寨版本也很好的完成了他的任务“了解Starling的核心渲染”,接下来的Starling解析我们将会直接阅读Starling的源码来了解其它的内部运行方式. Touch事件体系无疑是除了核心渲染外最重要的东西了,我们笔记中的Touch事件体系是基于Starling v1.1来解读的. Touch事件体系简介: 在Starling的承继关系里是没有InteractiveObject类,因此所有的显示对象都默认…
Stage3D在运行中是存在随时会丢失上下文的尴尬情况. 渲染内容丢失的问题本身就说明是因为丢失了Context3D对象.出现此问题的原因很多,通常还不是因为Stage3D应用.比如在win7系统中,当按下Ctrl+Alt+Delete键时会出现类似“锁定计算机”和“启动任务管理器”的菜单选项,这就会引起渲染内容丢失.但这不是唯一的可能,还有些情况,在某些屏保程序激活时又或笔记本盖子合上时也会引起渲染内容丢失.甚至可以通过调用Context3D.dispose()方法来模拟渲染内容丢失事件.所以…
批处理是使GPU进行高效绘制的一种技术手段,也是整个渲染流程中最核心的技术,到目前为止我们并没有使用到这种技术手段,下面我们看看我们现在的渲染机制. 先想一想我们最开始是怎么向GPU绘制一幅图像的,可以回头查看Stage3D学习笔记(五):通过矩阵操作纹理这篇文章: 绘制流程: 我们创建了两个矩阵,一个正交矩阵一个模型矩阵: 清除3D图像: 我们创建了顶点缓冲对象和索引缓冲对象比上传数据到GPU,我们编写了四个顶点数据表示图像的四个顶点,以及使用索引数据指示了这四个顶点数据要绘制的两个三角形(S…
我发布了一个版本v0.2,该版本是未优化版本,且没有添加Touch事件体系,但是由于是最基础且未优化的,所以可以通过参考代码快速的了解实现原理. 接下来的一段笔记开始进行渲染优化,我会把所有的目光都集中到渲染的优化之上. 点击下载:https://codeload.github.com/hammerc/hammerc-study-Stage3D/zip/v0.2 先看看Demo(特别说明:我使用了Whack的素材,Whack游戏开源地址:https://github.com/byxb/whack…
尺寸计算: Starling中的尺寸是以像素为单位的,这一切都得力于我们使用的正交矩阵,还记得我们顶点数据中的位置数据么,如果我们提交的矩形的四个顶点为(0, 0)(0, 100)(100, 0)(100, 100),那么最终通过正交矩阵的转换后绘制到舞台时将会是长宽都为100个像素的矩形. 那么Starling中的尺寸获取其实就是基于顶点数据来进行获取,详细代码可以参考DisplayObject中的getBounds方法,主要看继承类DisplayObjectContainer和Quad的具体…
本章会实现最核心的代码,所以涉及点会比较多,这里会发布一个版本,方便日后的回退查看. 点击下载:https://codeload.github.com/hammerc/hammerc-study-Stage3D/zip/v0.1 先看看Demo: 代码 代码 下面说一下一些比较关键的点: 事件播放处理: DisplayObject2D类添加了一个内部方法dispatchEventOnChildren,核心实现在DisplayObjectContainer2D类中,该方法主要作用是使当前容器及递归…
这篇文章我们剔除Starling的Touch事件体系和动画体系,专门来看看Starling中的渲染流程实现,以及其搭建的显示列表结构. 由于Starling是模仿Flash的原生显示列表,所以我们可以参照原有的知识体系来阅读Straling的代码. Starling类: Straling类是整个Starling框架的核心,该类会管理Straling的显示列表.Touch事件.动画处理等等多个模块的功能: 同时Starling类会实现框架内部的帧循环: 实例化Starling类后会Starling…
还记得之前的学习笔记中我们的顶点缓冲数组中的顶点数据么,我们使用一个一维数组来记录所有的顶点数据,这是由于顶点缓冲上传数据时是使用的一维数组. 如果对顶点数据进行一层代码的封装,就能更加的方便我们来操作顶点数据了. 所以引入了VertexData(顶点数据)这个类来进行封装. 在Starling中一个顶点需要记录9个数据,分别如下: 坐标数据 x 和 y(2D游戏就不需要z轴了,但是Starling中留下了 z 轴的位置的),开始索引为 0: 颜色数据 r.g.b.a(顶点颜色),开始索引为 3…
我在GitHub上新开了一个项目:https://github.com/hammerc/hammerc-study-Stage3D 山寨的Starling版本我取名叫做Scorpio2D,以后的笔记中只会贴出核心的代码,完整的代码和示例大家可以去GitHub中查看. 同时为了避免Starling中和原生API重名的问题,所有可能导致重名的类名我都会在后面加上2D,比如Starling中的EventDispatcher被我山寨过来后就重命名为EventDispatcher2D. 另外由于高版本的S…
Starling的性能优化要点 一.尽可能减少状态变更 如您所知,Starling使用Stage3D来渲染所有的可见对象.这就意味着所有的绘制都是GPU完成的. 现在,Starling可以一个接一个的发送四边形到GPU,然后一个接一个的绘制.实际上,这也是最初版本的Starling的工作方式.然而,为了更好的执行效率,GPU希望能得到大量的数据,然后在一次调用中绘制所有的对象. 这也是为什么Starling的最新版本要在发送数据到GPU之前要包含尽可能多的四边形.然而它只能批量处理那些拥有相似属…
上一篇中,已经把starling开发环境搭建好,那么现在开始写代码. 这一篇来完成打灰机的欢迎界面. 游戏素材下载 首先创建Asset.as来加载图片,声音和字体等资源,其中只有两张背景图是单独的图片,其他图片都已经被我用TexturePacker发布成序列了,所以只需要嵌入进去就好. Assets.as public class Assets { [Embed(source="../assets/bg_01.jpg")] private static const Bg01:Class…