標有‘ActionScript3’的文章

產生TextureAtlas素材的方式

方法一、使用TexturePacker 軟體官網:http://www.codeandweb.com/texturepacker 範例圖檔下載:woman 首先,要先把圖檔整理成多個png圖檔,若是連續的圖檔,則需要在後面加0001~~XXXX之類的數字,固定是四個數字。若是單一圖檔則可以不用加。到時在取圖檔時,例如本範例是woman0001~woman0028,則只需要用woman當前置詞就可以取出全部的動態圖檔了 var woman:MovieClip = new MovieClip(atlas.getTextures(“woman”),30); 而在操作TexturePacker時,最重要的是Data Format要選擇Sparrow/Starling。 索取TexturePacker免費序號 免費序號申請單:http://www.codeandweb.com/request-free-license 首先要說一下這套軟體的開發者真的很用心,當時看到有Blog說如果是有部落格的開發者,可以寫信去申請免費序號。我寫了申請表後,他回信了這封信給我: Hi Claire, Here& […]

繼續閱讀...

Starling的Display Objects介紹(五)

上一篇:Starling的Display Objects介紹(四) 下一篇:產生TextureAtlas素材的方式 這篇會介紹starling.display.MovieClip以及starling.animation.Juggler MovieClip物件介紹 官方手冊在此:http://doc.starling-framework.org/core/starling/display/MovieClip.html 在Starling裡面的MovieClip和原生的MovieClip差異蠻大的,列舉說明如下: 每一個MovieClip都可設定不同的fps(需在new MovieClip時指定):這是因為一般來說在Starling裡的frameRate都會設定的很高,但動畫可能不會有這麼多圖片可跑,因此每一個MovieClip 由一連串的連續圖檔組成:MovieClip是由一連串的動畫圖片(TextureAtlas)輪流播放。 MovieClip裡面無法有任何物件:在Starling裡的MovieClip並不是繼承DisplayObjectContainer,而是繼承於Image,因此 […]

繼續閱讀...

Starling的Display Objects介紹(四)

上一篇:Starling的Display Objects介紹(三) 下一篇:Starling的Display Objects介紹(五) 這篇會介紹下圖裡的starling.display.Quad以及starling.display.Image Quad物件介紹 官方手冊在此:http://doc.starling-framework.org/core/starling/display/Quad.html A Quad represents a rectangle with a uniform color or a color gradient. 每一個端點都可以設定一個顏色,會呈現線性漸層。要顯示一個線性的漸變色,需要把一個色值設置給頂點0和頂點1,然後另一個顏色給頂點2和頂點3。 頂點位置是這樣安排的:: 0 – 1 | / | 2 – 3 在這個物件裡面,可以看到一個叫做mVertexData的屬性。在Starling Framework簡介的地方曾經說過,Starling是基於Stage3D而建的,關於3D渲染基礎原理請見此:3D渲染基礎原理,VertexData官方介紹。所 […]

繼續閱讀...

Starling的Display Objects介紹(三)

上一篇:Starling的Display Objects介紹(二) 下一篇:Starling的Display Objects介紹(四) 這篇會介紹下圖裡的starling.display.Button以及starling.display.Sprite Button物件介紹 官方手冊在此:http://doc.starling-framework.org/core/starling/display/Button.html 和Flash的SimpleButton的不同點,是它只有兩個狀態的圖檔,也就是upState與downState,而沒有over的狀態。它的disabled樣式可以經由alphaWhenDisabled的屬性去設定Disabled時的圖檔透明度。 另外,按下Button會觸發的事件是Event.TRIGGERED,因此若我們要監聽一個Button按下的事件,可用下面的方式去監聽: menuContainer.addEventListener(Event.TRIGGERED, onTriggered); private function onTriggered(e:Ev […]

繼續閱讀...

Starling的Display Objects介紹(二)

上一篇:Starling的Display Objects介紹(一) 下一篇:Starling的Display Objects介紹(三) 這篇會介紹下圖裡的starling.text.TextField TextField物件介紹 官方手冊請見此:http://doc.starling-framework.org/core/starling/text/TextField.html 下面是一個最簡單的使用範例: package { import starling.display.Sprite; import starling.events.Event; import starling.text.TextField; public class Game extends Sprite { public function Game() { addEventListener(Event.ADDED_TO_STAGE, onAdded); } private function onAdded (e:Event):void { // create the TextField object var l […]

繼續閱讀...

Starling的Display Objects介紹(一)

上一篇:Starling Framework簡介 下一篇:Starling的Display Objects介紹(二) Starling framework啟動方式 所有使用Starling framework的應用程式的起始點,都是由一個Starling物件,來創建整個Starling世界(Starling物件說明可見此:Starling),下面是一個最簡單的範例: package{ import starling.core.Starling; import starling.display.Sprite; [SWF(width=”1280″, height=”752″, frameRate=”60″, backgroundColor=”#000000″)] public class Startup extends Sprite { private var mStarling:Starling; public function Startup() { // 建立Starling物件 mStarling = new Starling(Game, stage); // start i […]

繼續閱讀...

Starling Framework簡介

下一篇:Starling的Display Objects介紹(一) Starling的技術基礎 Starling是基於Stage3D來實作的,因此在學習Starling之前,我建議應該要對Stage3D的特性有基礎的了解。有關於Stage3D的介紹可以看這篇文章:Stage3D運作原理。在這篇文章裡,我們可以知道Stage3D比起OpenGL及DirectX等傳統3D的APIs的優勢與劣勢。 Stage3D會依發佈平台的不同而使用不一樣的GPU運算引擎,例如在mac電腦上所使用的是OpenGL,而在Windows則會視電腦所使用的硬體設備去選擇所使用的基礎技術。值得一提的是,即使遇到不支援的硬體,Stage3D仍然可以使用軟件模式去做3D運算,只是會變得十分的緩慢。這邊有一個簡單的性能比較:Stage3D vs WebGL 性能較量 下圖是Starling的技術基礎示意圖: Starling運作模式 過去我們很容易因為Stage3D這個名字而誤會這是專門為3D而做的引擎,而不能使用在2D的技術上。3D引擎的運算與2D運算最大的差異點,在於3D畫面是由一個個三角型為基礎,去建構整個畫面。 […]

繼續閱讀...

初探OSMF的plugs-in開發

這篇文章是我看完下面的網頁後,所寫的中文心得: http://osmf.org/dev/osmf/OtherPDFs/osmf_plugin_dev_guide.pdf 建立一個plug-in的方式 1. 建立一個PluginInfo物件,並且寫一個下面的函數讓OSMF去取得PluginInfo的物件 public function get pluginInfo():PluginInfo { return _pluginInfo; } 2. 建立一個物件繼承PluginInfo,然後建立一個Vector.執行super(items) public function HelloWorldPluginInfo() { var items:Vector. = new Vector.(); // Create the MediaFactoryItem and add to our list of items. var item:MediaFactoryItem = new MediaFactoryItem (“com.example.helloworld”, canHandleResource […]

繼續閱讀...

OSMF簡介

OSMF是一個開源且免費的Action Script框架,用以建置多媒體播放器。 現今的播放器很多時候不止是播放器,它們可能需要連接至CDN、呈現廣告、補捉使用者事件給伺服器分析、在使用者介面上提供社交功能等…。每個功能可能都會需要該方面的專業人士去專門開發,而OSMF就是為了解決這個狀況,降低開發成本而產生的,在OSMF裡,開發人員所開發的播放器,可以透過一套標準的API,與第三方所開發的plug-in功能整合。 簡單來說,可能今天我的播放器想要與聊天功能整合、或特定事件引發特定廣告,我們可以用OSMF所提供的標準API去開發相關功能,第三方程式不需要關心播放器相關議題,只需透過OSMF所提供的API來做,以提高程式的重用性。 OSMF的開發核心思想是『hooks』,每一個插件都是可被動態加載的功能,可被宣告為動態或靜態載入。靜態載入是指編譯時就被編譯進去、而動態載入則是在播放時再動態載入SWF插件。 Plug-ins分成可視與非可視的元件,可視元件可在載入swf時覆蓋原本的使用者介面(或一個暫停按鈕),非可視元件可將使用者操作紀錄和分析資料傳送給分析伺服器。 在OSMF […]

繼續閱讀...

Flex裡綁定(Bindable)相關函數及使用方式

在flex裡,最強大的標籤應該就是[Bindable]的綁定標籤了 因為某次的需求,我需要研究將Bindable綁定至函數 也順便研究了ChangeWatcher和BindingUtils的使用 【BindingUtils】 官方的說明在此: http://help.adobe.com/zh_TW/FlashPlatform/reference/actionscript/3/mx/binding/utils/BindingUtils.html 這是Flex內綁定的工具,裡面有兩個屬性,一個是綁定到函數(bindSetter),另一個則是綁定到某物件的某屬性(bindProperty) 使用範例如下 1. 綁定到函數(bindSetter) 2. 綁定到某物件的某屬性(bindProperty) 【ChangeWatcher】 官方的說明在此: http://help.adobe.com/en_US/FlashPlatform/reference/actionscript/3/mx/binding/utils/ChangeWatcher.html 因為此次我們要綁定的函數裡是有帶多個參數 […]

繼續閱讀...