starling 筆記


starling 筆記 :

基於Stage3Dg開發出來的一個可以使用GPU加速2D應用程序的框架。是一個渲染框架!


特色:直觀,輕量,免費。


Starling與Sparrow框架很相近。

驅動關系:
GPU-->OpenGL/ES2-DirectX-->stage3D-->starling

傳統使用的Stage使用cup渲染,Starling使用GPU,減少CUP操作可以提升性能和體驗。

flash 顯示層次結構 :stage video-->stage3D-->Display List。(這里注意的是 原生flash顯示對象會覆蓋stage3D,因為dispalylist層次結構在前面)

 

var starling:Starling=new Starling(rootClass,stage);//創建starling以對象
starling.start();//啟動(這一步不能忘記了)


Starling的構造函數
public function Starling(rootClass:Class, stage:flash.display.Stage, viewPort:Rectangle=null, stage3D:Stage3D=null, renderMode:String="auto")

rootClass 參數期待被傳入一個繼承自starling.display.Sprite的類引用(不是對象),這個類引用將作為Starling的入口類,即Starling中的文檔類。
第二個參數,一看該參數的類型就知道一定得傳入原生Flash的舞台了,由Starling創建的Stage3D對象將位於此stage對象的下一層。

Starling 對象的API:


* enableErrorChecking : 允許你啟用或禁用錯誤檢測功能。
啟用此功能后Starling將會把渲染器在工作中遇到的錯誤報告給你的應用程序並輸出在控制台上。
當 enableErrorChecking 屬性為 true時,Starling 將在內部同步地調用clear()及drawTriangles()方法並可以拋出錯誤(如果遇到的話)。
若此屬性為false(默認值),clear()及drawTriangles()方法將會被異步地調用且在遇到錯誤時也不會報告。啟用錯誤檢測功能將會降低性能,所以你最好只在調試的時候啟用一下。

* isStarted :一個標記,用於指示start方法是否被調用過。

* juggler: juggler 是一個用於存儲一系列實現了IAnimatable 接口的對象的對象,你可以通過調用juggler對象的advanceTime方法來讓它調度其保存的那些實現IAnimatable 接口的對象每一幀的行為。
當一個動畫播放完畢后,juggler 會將其剔除。 【PS:你可以把juggler對象作為一個動畫管理器,其詳細功能稍后會介紹】

* start : 開始渲染並處理事件

* stop : 停止渲染和事件處理,你可以在游戲被置於后台(如將Flash最小化時)時使用此方法來停止渲染,這樣可以避免硬件開銷上的浪費。

* dispose : 當你想要銷毀Starling中全部的渲染內容並釋放其在GPU中所占用空間時你可以調用此方法。這個API將會在內部同時銷毀着色器程序及事件偵聽器(GPU用於繪圖的東東)。


Wmodel模式:使用GPU加速,需要設置一個參數,否則會報一個Context3D not availible或者wrong wmodel value;
params.wmode = "direct";

// 可以通過這個來判斷是否起用了硬件渲染 ,從而定制不同的渲染策略。
var isHW:Boolean = Starling.context.driverInfo.toLowerCase().indexOf("software") == -1;// software硬件渲染也就是CPU渲染模式。

Starling常用的事件:
* Event.ADDED : 當顯示對象被添加到一個容器中拋出
* Event.ADDED_TO_STAGE : 當顯示對象被添加到一個已存在於舞台上的容器中時,也就是其變得可見時拋出
* Event.REMOVED : 當顯示對象被從一個容器中移除時拋出
* Event.REMOVED_FROM_STAGE : 當顯示對象被從一個已存在於舞台上的容器中移除時,也就是其變得不可見時拋出

Starling中DisplayObject類提供的一系列共有方法:
* removeFromParent : 從父對象中移除,如果它有父對象的話
* getTransformationMatrixToSpace : 創建一個用於表現本地坐標系和另一個坐標系轉換關系的矩陣
* getBounds : 得到一個以某個坐標系為參考系的能包含該顯示對象的最小矩形。
* hitTestPoint : 返回當前坐標系中某個點位置下層次最高(擋在最前面)的顯示對象
* globalToLocal : 將一個點由舞台坐標轉換為當前坐標系坐標
* localToGlobal : 將一個點由當前坐標系坐標轉換為舞台坐標

Starling中DispObject中提供的屬性:
* transformationMatrix : 當前顯示對象位置相與其父容器的轉換矩陣
* bounds : 當前顯示對象在其父容器中的矩形(Rectangle)對象
* width、height、root、x、y、scaleX、scaleY、alpha、visible、parent、stage、root
* rotation:當前顯示對象繞其注冊點的旋轉弧度(非角度)
* pivotX、pivotY : 當前顯示對象的注冊點,默認為(0,0) 如縮放、旋轉時的需要
* touchable : 指定當前顯示對象是否能夠接受Touch事件(相當於原生DisplayObject的mouseEnable,因為在Starling中所有鼠標事件都被定義為Touch事件)

 

Sprite對象繼承自DisplayObjectContainer類,DisplayObjectContainer類中提供的API:
* addChild : 不解釋,和原生Flash中的一樣,下同
* addChildAt : 略
* dispose : 完全銷毀一個對象,釋放其在GPU中所占內存,移除其全部事件偵聽。
* removeFromParent : 略
* removeChild : 略
* removeChildAt : 略
* removeChildren : 移除一個容器中所有的子對象
* getChildAt : 略
* getChildByName : 根據名稱搜索一個子對象
* getChildIndex : 略
* setChildIndex : 略
* swapChildren : 略
* swapChildrenAt : 略
* contains : 略

Starling對象都繼承自EventDispatcher類:
addEventListener : 為指定事件添加事件偵聽器.
hasEventListener : 為指定事件監測是否具備事件偵聽器
removeEventListener : 移除某個事件偵聽器
removeEventListeners : 移除一個對象中對某一事件或全部事件添加的偵聽器。

 


Starling中的事件機制保留了事件冒泡階段,卻沒有事件捕捉階段。


Starling中用Touch實現(替代)mouseclick相關事件:


TouchPhase類中的常量(通過這個類型判別觸發的是什么類型的事件):
began : 鼠標/手指開始交互(類似於mouseDown)
ended : 鼠標/手指停止交互(類似於mouseClick)
hover : 鼠標/手指懸於物體上(類似於mouseOver)
moved : 鼠標/手指在物體上移動(類似於mouseDown + mouseMove)
stationary : 鼠標/手指停止與物體的交互但仍停留在其上

TouchEvent事件對象中的API:
ctrlKey : 觸發Touch事件是是否按住Ctrl鍵
getTouch: 得到此事件的Touch對象
getTouches : 得到一組Touch對象(用於多點交互)
shiftKey: 觸發Touch事件是是否按住Shift鍵
timestamp : 事件觸發時間
touches : 得到同一時間發生的全部Touch對象


Touch對象中的API:
clone : 復制一個副本
getLocation: 得到Touch事件觸發的對應於當前坐標系的位置
getPreviousLocation: 得到之前觸發的Touch事件對應於當前坐標系的位置
globalX、Y: 得到Touch事件觸發的舞台位置
id: 一個Touch對象所擁有的獨一無二的標示符
phase : 指示當前事件觸發的類型(階段)
previousGlobalX、Y : 得到之前觸發的Touch事件舞台位置
tapCount : 手指輕拍顯示對象的次數(用以識別手指雙拍)
target : 觸發Touch事件的對象
timestamp : 事件觸發時間(此時間是從應用程序啟動開始計時的)

設置屬性:simulateMultiTouch=true; //表示是否是多點觸控,按住ctrl模擬

 

Texture:紋理,用來填充顯示對象。
Texture 對象API:
base : 該Texture對象所基於的Stage3D texture對象
dispose : 銷毀該Texture對象的潛在紋理數據
empty : 靜態方法。創建一個指定大小和顏色的空Texture對象
frame : 一個Rectangle矩形對象,用於指示一個Texture對象的范圍
fromBitmap : 靜態方法。從一個Bitmap對象創建一個外觀與其一致的Texture紋理對象。
fromBitmapData : 靜態方法。從一個BitmapData對象創建一個外觀與其一致的Texture紋理對象。
fromAtfData : 靜態方法。允許運用ATF (Adobe Texture Format)格式創建一個壓縮過的材質。經過壓縮的材質能讓你節省大量空間,尤其是在像移動設備這樣對存儲空間異常苛刻的環境中尤為有用。
fromTexture : 靜態方法。從一個Texture對象創建一個外觀與其一致的Texture紋理對象。
height 、width: 我想這兩個屬性就不用多說了
mipmapping : 此屬性用以指示該材質是否包含了mip映射
premultipliedAlpha : 此屬性用以指示該texture對象的透明度是否被預乘到了RGB值中(premultiplied into the RGB values).
repeat : 用以指定當前材質是否啟用重復平鋪模式,就像鋪壁紙那樣。

 


Mip映射。
將一個紋理保存多個縮小版本的方式就叫做Mip映射。
注意紋理尺寸必須保證為2的倍數(1, 2, 4, 8, 16, 32, 64, 128, 256,512, 1024, 2048), 但形狀不一定必須是矩形。

SpriteSheet:紋理貼圖集=texture atlases

 

Image: 通過它來顯示Texture的內容。
例:
[Embed(source = "../media/textures/sausage.png")]
private static const Sausage:Class;


var sausageBitmap:Bitmap = new Sausage();
var texture:Texture = Texture.fromBitmap(sausageBitmap);
var image:Image = new Image(texture);
addChild(image);

smoothing來提供對圖像的平滑處理功能:
BILINEAR : 當紋理被縮放時對其應用雙線性濾鏡(默認值)
NONE : 當紋理被縮放時不使用任何濾鏡
TRILINEAR : 當紋理被縮放時對其應用三線性濾鏡

image.smoothing = TextureSmoothing.NONE;

 

像素極碰撞:
在Starling中,材質可由BitmapData來生成,因此我們可用BitmapData對象提供的hitTest這個API來做到像素級碰撞檢測
public function hitTest(
firstPoint:Point, //檢測源的左上角坐標及其允許的最小檢測透明度,255即完全不透明,表示只有完全不透明的像素會被檢測到碰撞.
firstAlphaThreshold:uint,
secondObject:Object, //分別表示檢測對象、檢測對象的左上角坐標及檢測對象允許的最小檢測透明度。
secondBitmapDataPoint:Point = null,
secondAlphaThreshold:uint = 1
):Boolean
例:在onFrame中進行檢查

private function onFrame(event:Event):void {

point1.x = sausageImage1.x;
point1.y = sausageImage1.y;
point2.x = sausageImage2.x;
point2.y = sausageImage2.y;

if ( sausageBitmapData1.hitTest(point2, 255, sausageBitmapData1, point1, 255)) {
trace("touched!");
}
}

 

繪圖:
Starling中你可以通過BitmapData的draw方法來把使用繪圖API繪制好的原生顯示對象畫到一個BitmapData對象中,之后用此對象作為Texture的數據源。

例:

var s:flash.display.Sprite = new flash.display.Sprite();
var color:uint = Math.random() * 0xFFFFFF;
s.graphics.beginFill(color,ballAlpha);
var radius:uint = 20;
s.graphics.drawCircle(radius,radius,radius);
s.graphics.endFill();
var bmd:BitmapData = new BitmapData(radius * 2, radius * 2, true, color);
var texture:Texture = Texture.fromBitmapData(buffer);
var image:Image = new Image(texture);
addChild(image);

有點投機的感覺!

 

Flat Sprites:

每個顯示對象都有專屬的頂點着色器及索引緩沖區(vertex and index buffer)來進行各自的渲染工作,這樣會消耗大量的運算量且在子對象繁多時會顯著地影響呈現性能。
然而Starling提供了一種優化方案,具體做法可以理解為將全部子對象的頂點着色器及索引緩沖區集成為一個大的並由它來接管全局的渲染工作
(包括容器及其子對象),且只需要調用一次繪制方法即可完成渲染的工作,就跟完成一個簡單的紋理的渲染一樣
(如果所有子對象都共享同一個紋理的話,那自然是這樣)。

flat sprites特性相關的API:
flatten: 如果你想盡可能地提高存在大量嵌套的Sprite對象的話,調用此方法可以讓你達到滿意效果。一旦調用了此方法,Starling將會把顯示樹
(即以一個Sprite對象為頂點,所有子對象為子節點)中的渲染工作全部統一管理,在一次繪制操作中完成全部渲染工作。
如果顯示樹中某個節點發生了外觀改變,那么你需要再次調用此方法才能看見改變。

unflatten: 禁用flat行為.
isFlatenned: 判斷是否使用了flat 。

注意:如果子對象所用紋理不一致,那么Starling會對不同的紋理進行獨立地繪制工作,這樣的話,flatten特性所能帶來的性能提升便也不那么明顯了


MovieClip:
使用BitmapData來重現了MovieClip的功能。
例:
private var mMovie:MovieClip;

//ML文件來描述spritesheet各幀信息<SubTexture name="running0010" x="0" y="852" width="304" height="284"/>
[Embed(source="../media/textures/running-sheet.xml", mimeType="application/octet-stream")]
public static const SpriteSheetXML:Class;

//spritesheet圖片
[Embed(source = "../media/textures/running-sheet.png")]
private static const SpriteSheet:Class;

var bitmap:Bitmap = new SpriteSheet();
var texture:Texture = Texture.fromBitmap(bitmap);

var xml:XML = XML(new spriteSheetXML());
var sTextureAtlas:TextureAtlas = new TextureAtlas(texture, xml);

var frames:Vector.<Texture> = sTextureAtlas.getTextures("running_");


mMovie = new MovieClip(frames, 40);
addChild ( mMovie );

 


Texture Atlas:
Starling.juggler.add ( mMovie );//加入到 juggler才能播放動畫


Starling中的MovieClip對象提供的全部可用API:
currentFrame : 指示當前幀序號
fps : 默認情況下的幀頻,即每秒播放的幀數
isPlaying : 判斷當前影片剪輯是否正在播放
loop : 判斷當前影片剪輯是否會循環播放
numFrames : 當前影片剪輯包含的總幀數
totalTime : 播完一次影片所需時間,單位為秒
addFrame : 為影片剪輯增加一幀至時間軸末尾處,你可以設置該幀的持續時間及播放到該幀時需要發出的聲音
addFrameAt : 添加一幀到指定位置
getFrameDuration : 獲取某一幀的持續時間(單位為秒)
getFrameSound : 獲取某一幀播放的聲音
getFrameTexture : 獲取某一幀所用紋理
pause : 暫停影片播放
play : 開始播放影片. 不過在此之前你需要確保影片對象被添加到了一個Juggler對象中
removeFrameAt : 移出指定位置處的幀
setFrameDuration : 設置某一幀的持續時間(單位為秒)
setFrameSound : 設置某一幀播放的聲音
setFrameTexture : 設置某一幀所用紋理


Juggler:
Juggler類允許我們控制所有實現了IAnimatable接口的對象的動畫播放。MovieClip類實現了該接口,你也可以自定義一個動畫類在Starling中播放,你所要做的,僅僅是讓你的自定義類實現IAnimatable接口,然后重載advanceTime方法即可
Juggler API:
add : 添加一個動畫對象到juggler
advanceTime : 如果你需要手動調控Juggler的主循環邏輯的話,調用之.
delayCall : 延遲調用某個對象的某個方法
elapsedTime : 指示一個juggler對象的完整生命周期時間
isComplete : 指示一個Juggler的狀態,默認情況下它總是返回flase.
purge : 一次性移除全部子對象
remove : 從juggler中移除一個對象
removeTweens : 移除全部類型為Tween的且存在指定目標的對象

Button:DisplayObjectContainer類的子類
構造函數:
public function Button(upState:Texture, text:String="", downState:Texture=null)
例:圖片按鈕

[Embed(source = "../media/textures/button_normal.png")]
private static const ButtonTexture:Class;


var buttonSkin:Bitmap = new ButtonTexture();
var texture:Texture = Texture.fromBitmap(buttonSkin);
var myButton:Button = new Button(texture, "Play");

var menuContainer:Sprite = new Sprite();
menuContainer.addChild(myButton);

addChild(menuContainer);


Button對象提供的全部API:

alphaWhenDisabled : 當按鈕處於不可用狀態時的透明度
downState : 當按鈕被按下時的皮膚紋理
enabled : 此屬性決定按鈕是否可用、可交互
fontBold : 按鈕文本是否為粗體
fontColor : 按鈕文本的顏色
fontName : 按鈕文本所用字體。可以是一個系統字體也可以是一個已經注冊了的位圖字體
fontSize : 按鈕文本大小
scaleWhenDown : 按鈕按下時將被縮放到的值。如果你設置了downState,那么按鈕在按下后將不會被縮放
text : 按鈕顯示的文本
textBounds : 按鈕文本所在區域
upState : 當按鈕未產生交互時的皮膚紋理


TextField:
Starling使用CPU創建了一個原生的Flash TextField對象,在為其設置完文字及格式后,為其拍了個快照或是截了個屏神馬的,之后將此圖像傳至GPU進行渲染.
不是真正的TextField,而是一個TextField的快照被繪制在一個Bitmap之后封裝在texture中上傳至GPU的產物。
例:
var legend:TextField = new TextField(300, 300, "Here is some text, using an embedded font!", "Verdana", 38, 0xFFFFFF);
addChild(legend);


TextField對象所提供的屬性:
alpha : 文本透明度
autoScale : 是否讓文本自動縮放以適應TextField的區域
bold : 指定文本是否以粗體顯示
border : 允許顯示textfield的邊框。在對textfield進行顯式調試時此屬性很有用
bounds : textfield所占區域
color : 文本顏色
fontName : 文本字體名
fontSize : 文本大小
hAlign : 文本水平排列方式
italic : 指定文本是否以斜體顯示
kerning : 當你在使用位圖字體時(前提是存在可用的位圖字體),允許你設置字符間距。此屬性默認值為YES.
text : 顯示的文本
textBounds : textfield中實際文本所占區域
underline : 指定文本是否顯示下划線
vAlign : 文本垂直排列方式


RenderTexture: 着色,繪圖。
starling.textures.RenderTexture API允許開發者在Starling中實現無損繪畫功能。類似Flash中的BitmapData對象。
每次繪畫時不會抹除上一次繪畫的結果


var mRenderTexture = new RenderTexture(stage.stageWidth, stage.stageHeight);
var canvas:Image = new Image(mRenderTexture);
addChild(canvas);


mRenderTexture.draw(*);


Tweens:補間

Tween對象中可用的API:
animate : 緩動一個對象的某個屬性至指定目標值. 你可以在一個Tween對象中多次調用此方法
currentTime : 補間動畫當前播放到的時間
delay : 補間動畫開始前需要等待的延遲時間
fadeTo : 緩動一個對象的透明度至指定目標值. 你可以在一個Tween對象中多次調用此方法
isComplete : 此標記用以判斷一個補間動畫是否播放完畢
moveTo : 同時緩動一個對象的x、y屬性至指定目標值
onComplete : 補間動畫播放完畢回調函數
onCompleteArgs : 補間動畫播放完畢回調函數參數
onStart : 補間動畫開始播放回調函數
onStartArgs : 補間動畫開始播放回調函數參數
onUpdate : 補間動畫每幀更新時都會調用此方法
onUpdateArgs : 需要傳入補間動畫每幀更新時都會調用的方法的參數
roundToInt :若該標記為true,則所有帶小數的屬性值都會去掉小數變為整數
scaleTo : 同時將scaleX及scaleY屬性值緩動至指定目標值.
target : 緩動目標對象
totalTime : 補間動畫所要消耗的總時間(單位為秒).
transition : 指定補間動畫所用緩動方程

例:
legend 為需要移動對象實例
var t:Tween = new Tween(legend, 4, Transitions.EASE_IN_OUT_BOUNCE);
t.moveTo(legend.x+300, legend.y);
Starling.juggler.add(t);
設置監聽事件
t.onStart = onStart;
t.onUpdate = onProgress;
t.onComplete = onComplete;

  

 


免責聲明!

本站轉載的文章為個人學習借鑒使用,本站對版權不負任何法律責任。如果侵犯了您的隱私權益,請聯系本站郵箱yoyou2525@163.com刪除。



 
粵ICP備18138465號   © 2018-2025 CODEPRJ.COM