2.5 PushButton(推動按鈕)
PushButton相對于其它內置組件來說其設置與功能相對比較簡單,但它卻與常規(guī)按鈕劃出了一道界線。在FlashMX中許多地方講求的都是事件機制,而PushButton就是將原來普通按鈕的對象觸發(fā)機制封裝成了事件觸發(fā)機制。
現(xiàn)在我們從Components面板中拖拽一個PushButton組件到場景中,然后打開它的參數設置面板,如圖23所示。
圖23 PushButton組件的參數面板
Labels(標簽):PushButton顯示的提示名稱。
ChangeHandler:執(zhí)行用戶自定義的函數。該參數選項的參數為用戶定義函數的函數名。
顯然PushButton的參數設置內容比較少,而下面我們將舉一實例來分析簡單區(qū)別一下
普通按鈕與PushButton的不同,在此例中我們將自定義一個函數RotateTriangle(),利用此函數我們將控制場景中的一個三角形實體物件Triangle,我們可控制該實體旋轉角度,當角度大于等于100度時則PushButton失效,但普通按鈕卻可繼續(xù)工作。
圖24 PushButton實體場景內容
如上圖所示,如果我們要控制Triangle的旋轉角度按通常的方法一般是:新建一個普通按鈕,然后可在按鈕的代碼操作區(qū)寫上如下代碼。
on(press){
Triangle._rotation = Triangle._rotation+10;
}
這樣我們就可以輕松的對Triangle對象進行角度旋轉控制。
然而,現(xiàn)在由于有了PushButton按鈕,我們就可以將控制的操作代碼移至到Frame上,
我們現(xiàn)在編寫一個簡單的自定義函數RotateTriangle(),其代碼如下:
function RotateTriangle() {
Triangle._rotation = Triangle._rotation+10;
if (Triangle._rotation>=100) {
pushTriangle.setEnabled(false);
}
}
我們在控制Triangle實體對象旋轉的同時作了一個簡單的條件判斷,當Triangle的旋
轉角度大于等于100的時候我們規(guī)定PushButton將不再可以控制,即:可用性為否。此時對于PushButton的操作只需將它的ChangeHandler參數設置為RotateTriangle即可而無需再編寫任何代碼,但倘若普通按鈕要調用此函數則需添加如下內容代碼:
on(press){
RotateTriangle()
}
在此實例中我們函數的代碼量十分的少,控制的內容也相當的少,因而似乎沒有感覺到
普通按鈕與PushButton的區(qū)別所在。但是我們絕不能光光看到上面對PushButton的可用性進行控制的內容區(qū)別,其實普通按鈕與PushButton的區(qū)別還在于代碼編寫機制的改變,由此我們完全可以將場景中的按鈕操作代碼放置在Frame中,而用PushButton的ChangeHandler來調用,可以擺脫以往那種單個按鈕中進行操作代碼分別編寫的時代,這樣做的好處不光光是提高代碼管理能力(在按鈕控制內容相當多,按鈕控制代碼相當多的情況十更顯有效)而且對于提高影片執(zhí)行效率也相當有益處。
2.6 ScrollBar(滾動條)
應該說ScrollBar組件是應用最為廣泛的組件,我們只需在場景中放置動態(tài)文本框,然
后將ScrollBar組件拖拽到場景中并將它粘縛在相應的動態(tài)文本框上,再利用LoadVariables或是其它的方法將文本內容導入到該文本框內就可以利用ScrollBar直接控制文本的滾動顯示了,相對于Flash4與Flash5的歷史,我們再也無需自己編寫那么多繁重的代碼內容,類似的操作已顯得這般的輕松與簡單。
現(xiàn)在我們從Components面板中拖拽一個ScrollBar組件到場景中,然后打開它的參數設置面板,如圖25所示。
圖25 ScrollBar組件的參數面板
Target TextField(文件對象):粘縛的文本對象在場景中的實體名稱。
Horizontal(水平):判斷滾動條的狀態(tài)是水平或是垂直狀態(tài)。False:滾動條為垂直狀態(tài);True:滾動條為水平狀態(tài)。
下面我們會將一段文本信息載入到場景中的動態(tài)文本內,然后直接利用ScrollBar控制
文本框內的文本進行上下滾動顯示。
首先放置一個動態(tài)文本框,將實體名稱命名為ScrollBarDemo,并將文本顯示設置為Multiline(多行顯示),如下圖26所示:
圖26 場景中的動態(tài)文本框及ScrollBar組件
然后從Components中拖拽ScrollBar組件到文本框上,此時我們需選中Snap to Ojbect 選項則ScrollBar會自動粘縛到文本上,ScrollBar的Paramters中的Target TextField會自動切變?yōu)槲谋究蛟趫鼍爸械膶嶓w名稱,此處為ScrollBarDemo。
然后我們在場景中新建一個ActionScript層,并在關鍵幀中輸入如下的代碼內容:
//-----------------------------------------------------------------------------
//函 數 名:loadTextMX();
//功 能:文本的導入
//所需技術:xml,load,onLoad,htmlText
//所需參數:url,textbox
//適用版本:FlashMX
System.useCodepage = true;
//自定義函數loadTextMX,loadTextMX將文本解析為XML格式并支持文本Html的顯示
movieclip.prototype.loadTextMX = function(url, textbox) {
loadVarsText = new XML();
loadVarsText.load(url);
loadVarsText.onLoad = function(success) {
if (success) {
textbox.html = true;
textbox.htmlText = this;
} else {
textbox.html = true;
textbox.htmlText = "< br>< font color=\"#ff0000\">提示:未找到相應文件!< /font >";
}
};
};
//利用自定義函數將ScrollBarDemo.txt文本內容載入到ScrollBarDemo文本框內
loadTextMx("ScrollBarDemo.txt", ScrollBarDemo);
本例的測試結果如圖27所示,我們可以看到ScrollBar已經綁定了文本框,我們可以拖動滾動條來對文本進行翻動控制,而文本框內的“PushButton”字樣則以Html標準紅色顯示。
圖27 ScrollBar實例成品樣式
2.7 ScrollPane(滾動面板)
FlashMX在諸多方面較之Flash5都有了重大的突破,而對于圖片的載入則是這些突破中非常顯著的一點,而在此我們還可以利用ScrollPane組件對動態(tài)載入的圖片進行顯示操作,我們不僅可以利用上下左右滾動對ScrollPane中圖片進行區(qū)域顯示,還可以用鼠標直接拖動ScrollPane中的圖片來進行局部內容顯示。
現(xiàn)在我們從Components面板中拖拽一個ScrollPane組件到場景中,然后打開它的參數設置面板,如圖28所示。
圖28 ScrollPane組件的參數面板
Scroll Content(滾動對象):鏈接一個Lirbary庫中的MC對象到ScrollPane中進行顯示,而此處的Scroll Content內容則是被綁定對象的Linkage的名稱。
Horizontal Scroll:水平滾動條。Auto:自動判斷是否需要水平滾動條;Ture:顯示水平滾動條;False:不顯示水平滾動條。
Vertical Scroll:垂直滾動條。Auto:自動判斷是否需要垂直滾動條;Ture:顯示垂直滾動條;False:不顯示垂直滾動條。
Drag Content:是否可以手動拖動ScrollPane中的內容。True:支持手動拖動;False:不允許手動拖動。
下面我們將介紹兩個實例來分析一下ScrollPane的實際應用,實例一將利用Scroll
Content來綁定一個MC并在ScrollPane中顯示,而實例二將利用簡單的Action代碼動態(tài)載入外部的Jpg圖形并在ScrollPane中顯示。
ScrollPane實例一:
首先我們按下Ctrl+R導入一個外部圖形到實例的Library中,并新建一個MovieClip將此圖形放置于內,如下圖29所示:
圖29 導入的外部圖形及新建的MovieClip
我們右鍵點擊exampleMC(MovieClip),然后選中Linkage,在彈出的對話框內將Identifiy的內容填寫為exampleMC。
然后我們再次返回ScrollPane的參數設置面板,將Scroll Content的內容設置為exampleMC,Horizontal Scroll 、Vertical Scroll設置為True,Drag Content設置為否,則該實例的成品樣式如下圖30所示,我們將鼠標移動至ScrollPane中則無法拖動查看ScrollPane中內容。
圖30 ScrollPane實例1成品樣式
ScrollPane實例二:
我們仍舊新建一個ScrollPane組件,將它拖放至主場景內,并灌以實體名為ScrollPaneDemo,然后我們需確認在該實例的相同目錄下有example.jpg此圖形,接下來我們再新建一個ActionScript層并在此關鍵幀中輸入如下代碼:
//用with來操作場景下名稱為ScrollPaneDemo的ScrollPane組件
//用loadScrollContent將example.jpg從外部載入到ScrollPane中
//設置水平、垂直滾動條為不可見,但支持鼠標拖放顯示ScrollPane中的內容
with (ScrollPaneDemo) {
loadScrollContent("example.jpg");
setDragContent(true);
setHScroll(false);
setVScroll(false);
}
簡單幾行代碼就完成了此實例的全部操作,具體成品如下圖31所示,鼠標在圖片顯示區(qū)域內顯示為手的形狀,我們可以用“手”來播放顯示example.jpg圖形。
圖31 ScrollPane實例2成品樣式