【转载】GTween:轻便的Action Script 3.0缓动类库

4 篇文章 0 订阅

GTween概述

  GTween——提供给as3开发者的缓动类库(Programmatic Tweening for AS3 Developers)

  有许多非常好得缓动引擎,我是一个jack的TweenLite类库狂热爱好者(在将来他还将增加一些不可思议的新特征)。然而,这些类库不是一个十分符合我们和团队的需要,我需要一个具备体积小,快速,灵活,基于as3的类库,结果我选择了GTween。GTween是一个小的(4.5kb),快速的(1500 instances, 0.5s duration, ~25fps),实例基于缓动类,有许多选择和性能。从下面你可以学习GTween的许多重要特征。
  这当然不是试图取代任何现有的的缓动引擎。相反,它只是为了试图授予开发团队管理缓动程序的权利。目前,我已将它作为测试版发布。它已经进过了一些初略的测试,但是,作为一个性能如此强大的类库,我敢保证,它仍然有许多我们没有发现的bugs和优点。同样,我征求补充和修改,请将修改和补充输入到API中(包括特定属性或方法的名称),因此API有可能在以后有所改变。

基于开发者(Developer Oriented)

  GTween是完全针对as3开发者建立的类库,它使用基于实例的开发模型,而不是基于静态接口。同样,它基于事件模型而不是使用回调函数。这些为使用缓动的as3开发者提供了一个友好,一贯开发界面。
  这是一个建立缓动效果的简单例子,它侦听完成事件。

var myTween:GTween = new GTween(mySprite, 2, {x:200});

myTween.addEventListener(Event.COMPLETE, handleTweenComplete);

  实例既可以是引用的又可以是短暂的,前者允许在运行中改变值和行为(参考Sequencing),后者与智能资源管理逻辑共同起作用以确保缓动不被收集直到运行结束(参考Resource Management)。

  引用实例和短暂实例对比例子。

//创建一个名为myTween 的引用,以便在后面能够修改

var myTween:GTween = new GTween(mySprite, 2, {x:200});

//运行一次,然后被垃圾收集器收集n

new GTween(mySprite1, 2, {x:400});

  GTween能够运用到任何一个对象的任何数字属性,你可以将它运用到声音上来产生缓动效果,也可以用来改变AIR窗口的大小,或是自定义对象类型的”foo”值,就像使用它来使Sprite产生x属性的缓动一样简单。 

缓动代理(Proxy Tweening)

  GTween提供一个唯一的代理属性,它使你运用缓动在目的值产生的效果和作用在目标对象上的效果一样,代理对象有效地代表目标对象。
  下面例子展示了如何使用代理使目标对象向右移动100px:

myTween.proxy.x += 100;

  在上面的例子中,代理将重新从目标对象得到x值(如果它在缓动中没有作为一个目的值存在),加上100,然后将作为一个目的值重新设置回。
  这是一个非常强大的特征,花少量时间就能够学会使用。可以在API文档找到代理清单更多的信息和例子。

中断缓动(Interrupting Tweens)

  使用GTween,你能够在缓动动画播放的时候修改它,它将试图适应这些更改。在滑入动画执行完成之前用户关闭一个面板?使用reverse(),它将滑回接近它当前的位置。如果需要移动一个Sprite到不同的位置,或者在缓动动画运行的时候加入一个淡出的效果?仅需要在运行时调整它的值就可以了。
  这个简单的例子向你展示如何使sprite影片移动到用户在舞台上单击的位置。你一定注意到,用户可以在任何时候单击鼠标,而缓动动画将平稳地自我调节以最终到达目的地。

var myTween:GTween = new GTween(mySprite,1);

stage.addEventListener(MouseEvent.CLICK,handleClick);

function handleClick(evt:MouseEvent):void {

   myTween.proxy.x = mouseX;

   myTween.proxy.y = mouseY;

}

  你也可以适用end()或beginning()使缓动动画立即跳到动画的结尾或开始。调用end(true)将递归结束所有序列动画。

序列动画(Sequencing Tweens)

  GTween提供了三个特征,允许使多个动画进行先后排序:child tweens, delay, and nextTween.
使用addChild,你可以联合多个动画以作为原动画的子动画。当子动画运行时,它们将和父(原)动画保持同步。你甚至可以选择同步延误,开始,结束或持续时间。
  你也可以使用nextTween指定当一个动画结束时另一个要播放的动画,和指定另一个动画在播放之前需要等待的时间。 
  下面的例子演示了同步播放两个动画,在等待两秒后随即播放第三个动画。

var myTween1:GTween = new GTween(target1,3,{x:20});

var myTween2:GTween = new GTween(target2,0,{x:200});

myTween1.addChild(myTween2,GTween.DURATION);

var myTween3:GTween = new GTween(target3,3,{y:50});

myTween3.delay = 2;

myTween1.nextTween = myTween3;

计时模式(Timing Modes)

  GTween另一个特色是支持多种计时模式。你可以使用通用的时间计时模式,帧频计时模式,和混合计时模式。

  • 在”time“计时模式,所有的持续时间和位置使用秒指定,和使用一个可以配置的频率(例如.每50毫秒)更新和运行.这提供一个更加严格的控制,但是会占用更多的CPU,使CUP状况出现更大的起伏。
  • 在”frame”计时模式下,所有的持续时间和位置使用帧频指定,在每一帧更新和运行,这种模式占用的CUP较少,还允许你的动画与时间轴动画同步,但是在高CUP占有时,全面的持续时间将难以预料。
  • 在”hybrid”计时模式下,在每一帧进行更新,但是允许你使用秒指定持续时间。在每一帧,动画将根据上一次更新过去的时间调整它的位置。
GTween.timingMode = GTween.TIME;

  因为开发者在项目中不太可能改变,它被指定为一个类级别的属性。无论如何,GTween将继续使用旧的设置和旧的缓动动画,它允许你在任何时候更改计时模式。

暂停所有(Pause All)

  能够轻易地使所有的缓动动画暂停。当用户要暂停的时候,暂停你项目中所有的Sprites,或者在你打开一个对话框的时候暂停所有的转换效果。
  GTween提供一个类级别的pauseAll属性,它将停止所有的缓动动画而不会影响每一个影片暂停前的特征!

myTween.paused = false;

GTween.pauseAll = true; // pause ALL tweens.

trace(myTween.paused); // false

强大的事件(Robust Events)

  GTween提供三种内建的事件。激活(activate)事件让你知道什么时候缓动动画将开始运行,初始化(Init)事件当迟滞完成并动画开始时触发,改变(change)事件在缓动动画更新时触发,完成(Complete)事件在影片结束时触发。
  还不够?GTween允许你在缓动动画中动态添加定制点并在缓动动画到达定制点后出发事件。下面的例子展示一个持续事件为3秒的缓动动画在经过中点(1.5秒时),找到"halfway" 字符(版本Beta 4)。

var myTween:GTween = new GTween(target1, 3, {alpha:1});

myTween.addProgressPoint(1.5,"halfway");

myTween.addEventListener(GTween.PROGRESS,onProgress);

function onProgress(evt:Event):void {

   trace(String(myTween.lastProgressPoint));

}

  注意:你可以在到达定制点时使用任何调用一种数据类型,字符标签,一个到达定制点时调用的函数,运行另一个缓动动画,任何你想要的。

import com.gskinner.motion.*;          //使用类前需要导入用到的类,*通配符代表导入包内所有的内

var myTween:GTween = new GTween(mySprite1, 6, {x:400});   //创建一个名为myTween 的引用,以便在后面能够修改

myTween.addProgressPoint(2,"point1");                         //在2秒的时候设置一个定制点

myTween.addProgressPoint(4," point2");                       //在4秒时设置另一个定制点

myTween.addEventListener(GTween.PROGRESS,onProgress);                 //注册侦听器

function onProgress(evt:Event):void {

         if (String(myTween.lastProgressPoint)==" point1") {

                   trace(String(myTween.lastProgressPoint));//输出字符

                   new GTween(mySprite2,3,{x:400});//调用一个

         } else {

                   trace(String(myTween.lastProgressPoint));

                   new GTween(mySprite3,2,{alpha:0});

         }

}

 

-------------------- FairyGUI Copyright © 2014-2020 FairyGUI.com Version 3.4.0 support@fairygui.com -------------------- FairyGUI is a flexible UI framework for Unity, working with the professional FREE Game UI Editor: FairyGUI Editor. Download the editor from here: http://en.fairygui.com/ -------------------- Get Started -------------------- Run demos in Assets/FairyGUI/Examples/Scenes. The UI project is in Examples-UIProject.zip, unzip it anywhere. Use FairyGUI Editor to open it. Using FairyGUI in Unity: * Place a UIPanel in scene by using editor menu GameObject/FairyGUI/UIPanel. * Or using UIPackage.CreateObject to create UI component dynamically, and then use GRoot.inst.AddChild to show it on screen. ----------------- Version History ----------------- 3.4.0 - NEW: Add multi-display support. - NEW: Add API DynamicFont(name, font). - IMPROVED: Compatibility with 2018.3. - FIXED: Incorrect letter spacing on mobile platform. - FIXED: Same transition hook may be called twice. - FIXED: Exception raised when texture was disposed before object was disposed. 3.3.0 - NEW: Add textfield maxwidth feature. - NEW: Add API to query package dependencies. - IMPROVED: Graphics module refactor. Now it is more convenient to create various shapes(pie, lines, polygon etc) and do mesh deform. Memory usage on building mesh is also dropped. Also supports automatically setup uv for arbitrary quad to avoid seam between 2 triangles. All shaders are updated, don't forget to replace shaders in your project. - IMPROVED: Text-Brighter mechanism is removed, so FairyGUI-Text-Brighter.shader is removed. - IMPROVED: Add support for shrinking multi-line text. - IMPROVED: Improve Lua support. 3.2.0 - NEW: Add DisplayObjectInfo component. Define script symbol FAIRYGUI_TEST to enable it. - FIXED: A virtual list scrolling bug. - FIXED: A BlendMode bug. 3.1.0 - NEW: Draw extra 8 directions instead of 4 directions to archive text outline effect. Toggle option is UIConfig.enhancedTextOutlineEffect. - IMPROVED: Eexecution efficiency optimizations. - IMPROVED: GoWrapper now supports multiple materials. - FIXED: Correct cleanup action for RemovePackage. 3.0.0 From this version, we change package data format to binary. Editor version 3.9.0 with 'binary format' option checked in publish dialog is required to generating this kind of format. Old XML format is not supported anymore. - NEW: Add UIPackage.UnloadAssets and UIPackage.ReloadAssets to allow unload package resources without removing the package. - NEW: Add TransitionActionType.Text and TransitionActionType.Icon. 2.4.0 - NEW: GTween is introduced, DOTween is no longer used inside FairyGUI. - NEW: Transitions now support playing partially and pausing. - IMPROVED: Change the way of registering bitmap font. - FIXED: A GButton pivot issue. - FIXED: Correct text align behavior. 2.3.0 - NEW: Allow loader to load component. - NEW: Add text template feature. - FIXED: Exclude invisible object in FairyBatching. 2.2.0 - NEW: Modify shaders to fit linear color space. - IMPROVED: Improve relation system to handle conditions that anchor is set. - IMPROVED: Eliminate GC in transition. - FIXED: Fixed a bug of unloading bundle in UIPackage. - FIXED: Fixed issue that some blend mode(multiply, screen) works improperly. 2.1.0 - NEW: Add GGraph.DrawRoundRect. - NEW: Add FillType.ScaleNoBorder. - FIXED: Repair potential problems of virtual list. - FIXED: Fixed a bug in handling shared materials. 2.0.0 - NEW: RTL Text rendering support. Define scripting symbols RTL_TEXT_SUPPORT to enabled it. - NEW: Support for setting GObject.data in editor. - NEW: Support for setting selectedIcon of list item in editor. - IMPROVED: Add UIConfig.depthSupportForPaitingMode. - IMPROVED: Set sorting order of popup automatically. - FIXED: Fixed a text layout bug when line spacing is negative. - FIXED: Reset ScrollPane.draggingPane when an active scrollPane is being disposed. - FIXED: Fixed a bug of skew rendering.
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值