這篇來分享一下關於製作Flash的組件
在這兒我們練習製作一個定位用的組件
參數面版上有定位的基準點和偏移值。
組件本身也是一個 MovieClip 類別, 因為要對stage做偵聽
所以一開始要去偵聽addedToStage事件。
1.AlignComponent.as
2.先在畫面上繪製一個色塊(50x50),將其轉成MovieClip元件
同時在Class欄位填上類別路徑

3.在元件庫上選擇 Component Definition

此時會出現 Component Definition 面版

4.在 as 檔設定參數
這兒的參數之後是要對映到參數面版上的
使用的tag為[Inspectable( name = "變數名", type = "類型", defaultValue = "預設值" )]
變數名稱是對映到set的變數, 可以使用的類型有List,String,Number等。
Name:面版上的說明, 跟類別裡程式碼沒任何關系, 可以打上中文
Variable:對映類別裡的參數
Value:預設值
Type:類別
同時在Class欄位也打上寫好的類別檔路徑

開啟 Component Inspector面版, 點擊一下組件, 此時參數就出現了

SourceCodeDownload
當stage Resize時, 會發生事件, 此時就可以一起更新座標值
在這就奶老師就不寫if else判斷 align的值。
6.這時候就可以做一個元件來測試

7.更換livepreview元件
製作一個新的flash, 在裡面繪製圖型, 發怖成.swf檔
開啟 Component Definition面版
按下 中間的 Live preview , 右邊有個Set按扭。
第三個選項:Live Preview with .swf file embedded in .fla file
並將路徑填入

此時的組件就換上你的設計檔了。

8.更換元件庫裡的小Icon
大小:18x18, jpg或是png格式
開啟 Component Definition面版
在Description下方有個圖示按下他

選擇Custom, 找到你要放的小圖示

完成啦

9.匯出SWC
在元件庫上, 找到剛剛製作好的組件, 按下右鍵, 選擇 Export SWC File

10.包裝成mxp
到這兒我們的組件己經完成了, 接著要再包裝成mxp檔,好方便讓其他使用者安裝
包裝mxp使用的軟體是Adobe Extension Manager , 在這奶老師使用的版本為CS3
寫一份xml文件來定義mxp裡有什麼, 其副檔名為.mxi
最重要的是這段,
destination:安裝好的檔要放置到flash裡的那個資料夾下
因為是組件,所以要放到 $flash/Components下, 而tutorials資料夾名稱可以換上自己的
選擇包裝擴充功能, 將mxi包裝成mxp, 然後可以安裝mxp檔了

重新啟動Flash , 在Components面版就會出現 剛剛製作好的組件, 拉到場景上就可以使用

轉貼文章請注明出處:http://milkmidi.blogspot.com/2009/12/flash.html
Source Download
在這兒我們練習製作一個定位用的組件
參數面版上有定位的基準點和偏移值。
組件本身也是一個 MovieClip 類別, 因為要對stage做偵聽
所以一開始要去偵聽addedToStage事件。
1.AlignComponent.as
package milkmidi.tutorial {
import flash.display.MovieClip;
import flash.events.Event;
public class AlignComponent extends MovieClip{
public function AlignComponent() {
addEventListener(Event.ADDED_TO_STAGE , _addedToStageHandler);
addEventListener(Event.REMOVED_FROM_STAGE , _removedFromStageHandler);
}
private function _addedToStageHandler(e:Event):void {
removeEventListener(Event.ADDED_TO_STAGE, _addedToStageHandler);
stage.addEventListener(Event.RESIZE , _resizeHandler);
trace(this, "_addedToStageHandler");
_resizeHandler();
}
private function _resizeHandler(e:Event = null):void {
}
private function _removedFromStageHandler(e:Event):void {
removeEventListener(Event.REMOVED_FROM_STAGE, _removedFromStageHandler);
stage.removeEventListener(Event.RESIZE , _resizeHandler);
}
}
}
2.先在畫面上繪製一個色塊(50x50),將其轉成MovieClip元件
同時在Class欄位填上類別路徑

3.在元件庫上選擇 Component Definition

此時會出現 Component Definition 面版

4.在 as 檔設定參數
這兒的參數之後是要對映到參數面版上的
使用的tag為[Inspectable( name = "變數名", type = "類型", defaultValue = "預設值" )]
變數名稱是對映到set的變數, 可以使用的類型有List,String,Number等。
public function get align():int { return _align; }
[Inspectable( name = "align", type = "List", enumeration = "9,6", defaultValue = "9" )]
public function set align(value:int):void {
_align = value;
trace("align:" + _align);
_resizeHandler();
}
public function get offsetX():int { return _offsetX; }
[Inspectable( name = "offsetX", type = "Number", defaultValue = "0" )]
public function set offsetX(value:int):void {
_offsetX = value;
trace("offsetX:" + _offsetX);
_resizeHandler();
}
5.在面版上輸入對映的參數Name:面版上的說明, 跟類別裡程式碼沒任何關系, 可以打上中文
Variable:對映類別裡的參數
Value:預設值
Type:類別
同時在Class欄位也打上寫好的類別檔路徑

開啟 Component Inspector面版, 點擊一下組件, 此時參數就出現了

SourceCodeDownload
當stage Resize時, 會發生事件, 此時就可以一起更新座標值
在這就奶老師就不寫if else判斷 align的值。
private function _resizeHandler(e:Event = null):void {
parent.x = stage.stageWidth + _offsetX;
parent.y = 0;
}
6.這時候就可以做一個元件來測試

7.更換livepreview元件
製作一個新的flash, 在裡面繪製圖型, 發怖成.swf檔
開啟 Component Definition面版
按下 中間的 Live preview , 右邊有個Set按扭。
第三個選項:Live Preview with .swf file embedded in .fla file
並將路徑填入

此時的組件就換上你的設計檔了。

8.更換元件庫裡的小Icon
大小:18x18, jpg或是png格式
開啟 Component Definition面版
在Description下方有個圖示按下他

選擇Custom, 找到你要放的小圖示

完成啦

9.匯出SWC
在元件庫上, 找到剛剛製作好的組件, 按下右鍵, 選擇 Export SWC File

10.包裝成mxp
到這兒我們的組件己經完成了, 接著要再包裝成mxp檔,好方便讓其他使用者安裝
包裝mxp使用的軟體是Adobe Extension Manager , 在這奶老師使用的版本為CS3
寫一份xml文件來定義mxp裡有什麼, 其副檔名為.mxi
最重要的是這段,
略source:要包裝的檔案
destination:安裝好的檔要放置到flash裡的那個資料夾下
因為是組件,所以要放到 $flash/Components下, 而tutorials資料夾名稱可以換上自己的
選擇包裝擴充功能, 將mxi包裝成mxp, 然後可以安裝mxp檔了

重新啟動Flash , 在Components面版就會出現 剛剛製作好的組件, 拉到場景上就可以使用

轉貼文章請注明出處:http://milkmidi.blogspot.com/2009/12/flash.html
Source Download
留言
就很快有了教學~
現在我也可以自行制作組件了~~^_^
真的感謝奶老師~~
下一篇再來補充
請問有智商低於九十的解說嗎
關於組件好像都沒有比較完整的說明...
就連Adobe自己都講得不清不楚(U)
不然會有錯誤,找不到_align,_offsetX
private var _align;
private var _offsetX:Number;
對程式語言來說,要給別人使用的變數
就一定要是 public
對程式語言來說,要給別人使用的變數
就一定要是 public