Starling flash 简单应用

   转自： http://www.riadev.com/flex-thread-1929-1-1.html

   学习：http://www.adobe.com/cn/devnet/flashplayer/articles/introducing_Starling.html

flashplayer11给我们带来了巨大的性能提升，这一点不言而喻，大家都讲GPU加速主要用户3D画面中，不错。这是adobe的初衷。不过我们也可以使用GPU来加速我们的2D画面，这样的操作很多人认为是多次一举，因为flash本身就对2D画面支持的非常好了，为什么还要用GPU来进行图像渲染操作呢？其实也是一个性能上的提升，关于这点我们就不再多说了，慢慢的，我们就可以在很多的商业项目中看到，基于GPU加速的2D flash应用在性能上也会有很大的提高。那么怎么样使用GPU来对2D画面进行加速呢？

    可能很多人都还不明白，认为flashplayer11是adobe内置了一个3D的引擎，这个引擎用来调用GPU，其实不是的。adobe为我们提供的仅仅是一些非常底层的API，利用这些API我们可以实现对GPU的调用。但是请不要忘记，使用这些API我们无法生成任何图像，因为他们实在是太底层了。所以我们需要用到一些第三方的引擎。这里Starling就是一个基于GPU加速的2D引擎。
    可能很多人都还不明白，认为flashplayer11是adobe内置了一个3D的引擎，这个引擎用来调用GPU，其实不是的。adobe为我们提供的仅仅是一些非常底层的API，利用这些API我们可以实现对GPU的调用。但是请不要忘记，使用这些API我们无法生成任何图像，因为他们实在是太底层了。所以我们需要用到一些第三方的引擎。这里Starling就是一个基于GPU加速的2D引擎。
    在adobe MAX2011大会上，adobe为我们展示了一个使用starling引擎来制作的flash游戏，其名称是《愤怒的小鸟》。感兴趣的童鞋可以到我的博客中观看这段视频。在adobe 官方视频教程板块中。
   
    在flash中运行如此复杂或者说如此多运算的程序，对于以前的flash来说需要进行大量的优化工作以达到我们预期的效果，但是现在有了GPU，我们就可以大胆的放开手脚来进行制作了。那么starling到底有哪些方便之处，以至于adobe在这么重要的大会中抽出一部分时间来进行演示呢？
    答案我想只有举办者才知道。但是我所知道的是，它不仅仅是方便好用，而且更易于以前项目的移植工作。例如，在这个引擎中我们可以看到Sprige、MovieClip或者Button这样熟悉的名字。不错。为了方便开发者移植工程，所有的类名称和以前相同，我们只需要将import 语句进行修改，然后小范围修改代码即可。虽然如此，但是笔者目前还没有找到将美工制作动画进行GPU加速的办法。目前不知道能不能行得通。至于starling，是使用程序来制作动画，非常适合游戏。在此忽略美工部分，说说咱程序员之间的事情吧！
   
    首先，想让你的画面显示，就需要纹理渲染，换句话说就是贴图。和3D引擎的中的概念很相像。只不过这里的纹理是2D场景中的。在starling引擎中控制纹理的操作由Texture类来执行。Texture类的所有纹理数据基本上都是来自于位图，或者位图数据。这一点没有任何问题。因为我们不可能从flash中的矢量图形中进行数据获取。矢量图的渲染还需要CPU来进行操作。
   
    下面我们来看一个简单的demo，这个DEMO中我们使用loader对象来加载一张图片，然后使用starling引擎来对其进行GPU加速操作。
   
    stex1.as

1.     package
   
2. {
   
3.     import flash.display.Sprite;
   
4.     import flash.display.StageAlign;
   
5.     import flash.display.StageScaleMode;
   
6.     import flash.geom.Rectangle;
   
7.    
   
8.     import starling.core.Starling;
   
9.    
   
10.     [SWF(width="320", height="480", frameRate="60", backgroundColor="#000000")]
    
11.     public class stex1 extends Sprite
    
12.     {
    
13.         private var mStarling:Starling;
    
14.         
    
15.         public function stex1()
    
16.         {
    
17.             stage.scaleMode = StageScaleMode.NO_SCALE;
    
18.             stage.align = StageAlign.TOP_LEFT;
    
19.             
    
20.             //Starling.multitouchEnabled = true;
    
21.             
    
22.             mStarling = new Starling(mys, stage,new Rectangle(0,0,320,480));
    
23.             //mStarling.simulateMultitouch = true;
    
24.             //mStarling.enableErrorChecking = false;
    
25.             mStarling.antiAliasing= 1;
    
26.             mStarling.start();
    
27.             
    
28.         }
    
29.     }
    
30. }
    

普通浏览复制代码保存代码打印代码

1.     package
2. {
3.     import flash.display.Sprite;
4.     import flash.display.StageAlign;
5.     import flash.display.StageScaleMode;
6.     import flash.geom.Rectangle;
7.     
8.     import starling.core.Starling;
9.     
10.     [SWF(width="320", height="480", frameRate="60", backgroundColor="#000000")]
11.     public class stex1 extends Sprite
12.     {
13.         private var mStarling:Starling;
14.         
15.         public function stex1()
16.         {
17.             stage.scaleMode = StageScaleMode.NO_SCALE;
18.             stage.align = StageAlign.TOP_LEFT;
19.             
20.             //Starling.multitouchEnabled = true;
21.             
22.             mStarling = new Starling(mys, stage,new Rectangle(0,0,320,480));
23.             //mStarling.simulateMultitouch = true;
24.             //mStarling.enableErrorChecking = false;
25.             mStarling.antiAliasing= 1;
26.             mStarling.start();
27.             
28.         }
29.     }
30. }
31.  

    package<br />{<br />    import flash.display.Sprite;<br />    import flash.display.StageAlign;<br />    import flash.display.StageScaleMode;<br />    import flash.geom.Rectangle;<br />    <br />    import starling.core.Starling;<br />    <br />    [SWF(width="320", height="480", frameRate="60", backgroundColor="#000000")]<br />    public class stex1 extends Sprite<br />    {<br />        private var mStarling:Starling;<br />        <br />        public function stex1()<br />        {<br />            stage.scaleMode = StageScaleMode.NO_SCALE;<br />            stage.align = StageAlign.TOP_LEFT;<br />            <br />            //Starling.multitouchEnabled = true;<br />            <br />            mStarling = new Starling(mys, stage,new Rectangle(0,0,320,480));<br />            //mStarling.simulateMultitouch = true;<br />            //mStarling.enableErrorChecking = false;<br />            mStarling.antiAliasing= 1;<br />            mStarling.start();<br />            <br />        }<br />    }<br />}<br />

mys.as

1. package
   
2. {
   
3.     import flash.display.Bitmap;
   
4.     import flash.display.BitmapData;
   
5.     import flash.events.ProgressEvent;
   
6.    
   
7.     import starling.display.Button;
   
8.     import starling.display.Image;
   
9.     import starling.display.Sprite;
   
10.     import starling.events.Event;
    
11.     import starling.textures.Texture;
    
12.    
    
13.     public class mys extends Sprite
    
14.     {
    
15.         private var d:data = new data();
    
16.         public function mys()
    
17.         {
    
18.             
    
19.             d.addEventListener(ProgressEvent.PROGRESS,ok);
    
20.             
    
21.         }
    
22.         private function ok(evt:ProgressEvent):void
    
23.         {
    
24.             
    
25.             var bg:Image = new Image(Texture.fromBitmap(d.bit) );
    
26.             this.addChild(bg);
    
27.         }
    
28.         
    
29.     }
    
30. }
    

普通浏览复制代码保存代码打印代码

1. package
2. {
3.     import flash.display.Bitmap;
4.     import flash.display.BitmapData;
5.     import flash.events.ProgressEvent;
6.     
7.     import starling.display.Button;
8.     import starling.display.Image;
9.     import starling.display.Sprite;
10.     import starling.events.Event;
11.     import starling.textures.Texture;
12.     
13.     public class mys extends Sprite
14.     {
15.         private var d:data = new data();
16.         public function mys()
17.         {
18.             
19.             d.addEventListener(ProgressEvent.PROGRESS,ok);
20.             
21.         }
22.         private function ok(evt:ProgressEvent):void
23.         {
24.             
25.             var bg:Image = new Image(Texture.fromBitmap(d.bit) );
26.             this.addChild(bg);
27.         }
28.         
29.     }
30. }
31.  

package<br />{<br />    import flash.display.Bitmap;<br />    import flash.display.BitmapData;<br />    import flash.events.ProgressEvent;<br />    <br />    import starling.display.Button;<br />    import starling.display.Image;<br />    import starling.display.Sprite;<br />    import starling.events.Event;<br />    import starling.textures.Texture;<br />    <br />    public class mys extends Sprite<br />    {<br />        private var d:data = new data();<br />        public function mys()<br />        {<br />            <br />            d.addEventListener(ProgressEvent.PROGRESS,ok);<br />            <br />        }<br />        private function ok(evt:ProgressEvent):void<br />        {<br />            <br />            var bg:Image = new Image(Texture.fromBitmap(d.bit) );<br />            this.addChild(bg);<br />        }<br />        <br />    }<br />}<br />

data.as

1. package
   
2. {
   
3.     import flash.display.Bitmap;
   
4.     import flash.display.Loader;
   
5.     import flash.display.LoaderInfo;
   
6.     import flash.events.Event;
   
7.     import flash.events.EventDispatcher;
   
8.     import flash.net.URLRequest;
   
9.     import flash.events.ProgressEvent;
   
10.    
    
11.     public class data extends EventDispatcher
    
12.     {
    
13.         public var bit:Bitmap;
    
14.         
    
15.         private var a:Loader = new Loader();
    
16.         public function data()
    
17.         {
    
18.             a.load(new URLRequest("../media/textures/background.png") );
    
19.             a.contentLoaderInfo.addEventListener(Event.COMPLETE,ok);
    
20.         }
    
21.         private function ok(evt:Event):void
    
22.         {
    
23.             trace(a.content + "*********");
    
24.             this.bit = a.content as Bitmap;
    
25.             
    
26.             var shijian:Event = new ProgressEvent(ProgressEvent.PROGRESS);
    
27.             this.dispatchEvent(shijian);
    
28.         }
    
29.     }
    
30. }
    
31. 
    

普通浏览复制代码保存代码打印代码

1. package
2. {
3.     import flash.display.Bitmap;
4.     import flash.display.Loader;
5.     import flash.display.LoaderInfo;
6.     import flash.events.Event;
7.     import flash.events.EventDispatcher;
8.     import flash.net.URLRequest;
9.     import flash.events.ProgressEvent;
10.     
11.     public class data extends EventDispatcher
12.     {
13.         public var bit:Bitmap;
14.         
15.         private var a:Loader = new Loader();
16.         public function data()
17.         {
18.             a.load(new URLRequest("../media/textures/background.png") );
19.             a.contentLoaderInfo.addEventListener(Event.COMPLETE,ok);
20.         }
21.         private function ok(evt:Event):void
22.         {
23.             trace(a.content + "*********");
24.             this.bit = a.content as Bitmap;
25.             
26.             var shijian:Event = new ProgressEvent(ProgressEvent.PROGRESS);
27.             this.dispatchEvent(shijian);
28.         }
29.     }
30. }
31. 
32.  

package<br />{<br />    import flash.display.Bitmap;<br />    import flash.display.Loader;<br />    import flash.display.LoaderInfo;<br />    import flash.events.Event;<br />    import flash.events.EventDispatcher;<br />    import flash.net.URLRequest;<br />    import flash.events.ProgressEvent;<br />    <br />    public class data extends EventDispatcher<br />    {<br />        public var bit:Bitmap;<br />        <br />        private var a:Loader = new Loader();<br />        public function data()<br />        {<br />            a.load(new URLRequest("../media/textures/background.png") );<br />            a.contentLoaderInfo.addEventListener(Event.COMPLETE,ok);<br />        }<br />        private function ok(evt:Event):void<br />        {<br />            trace(a.content + "*********");<br />            this.bit = a.content as Bitmap;<br />            <br />            var shijian:Event = new ProgressEvent(ProgressEvent.PROGRESS);<br />            this.dispatchEvent(shijian);<br />        }<br />    }<br />}<br /><br />

  

2011-11-20 17:42:05 上传

下载附件(93.83 KB)