下面我們就來(lái)學(xué)習(xí)Flash MX 2004中激動(dòng)人心的新特性吧。在每個(gè)實(shí)例的講解都分為涉及特性、制作過(guò)程、實(shí)際用途三個(gè)部分。
實(shí)例一、Accessible Applications
一、涉及特性
這個(gè)實(shí)例主要涉及新增組件的應(yīng)用，以及對(duì)組件的編程。在2004中，組件分為Data、Media、UI三大類別。讓人驚喜的是在UI類別中差不多已經(jīng)包括了制作WEB應(yīng)用所需要的所有組件，以后用Flash制作網(wǎng)頁(yè)再也不麻煩了。而且通過(guò)編程可以對(duì)組件進(jìn)行靈活、全面的控制。
二、制作過(guò)程
1. 按“Ctrl + F8”新建一個(gè)Symbol，類型為“Movie Clip”，命名為“display”。將一個(gè)“Label”組件拖到此Symbol的場(chǎng)景中，命名為“l(fā)abel”。將此Symbol拖到場(chǎng)景中，命名為“display”。
2. 將一個(gè)“List”組件拖到場(chǎng)景中，命名為“colorList”，在“l(fā)abel”屬性中增加內(nèi)容“Green”、“Blue”、“Brown”、“Red”、“Orange”、“Purple”。
3. 將兩個(gè)“Text Input”組件拖到場(chǎng)景中，分別命名為“usernameInput” 和“passwordInput”，并設(shè)置第二個(gè)的屬性中的“password”為true。
4. 將一個(gè)“Button”組件拖到場(chǎng)景中，命名為“submitButton”，設(shè)置“Label”屬性為“Submit”。
5. 將兩個(gè)“Radio Button”組件拖到場(chǎng)景中，分別命名為“radio_single”和“radio_multiple”，設(shè)置“Label”屬性為“Single Selection”和“Multiple Selection”。
6. 將四個(gè)“Label”組件拖到場(chǎng)景中，分別命名為“caption”、“username_label”、“password_label”、“select_label”。分別設(shè)置“Text”屬性為“Please enter your name”、“First Name:”、“Last Name:”、“Please choose an item:”。
7. 按“Ctrl + F8”新建一個(gè)Symbol，類型為“Movie Clip”，命名為“arrow_mc”。在此Symbol的場(chǎng)景中繪制一個(gè)箭頭。將此Symbol拖到場(chǎng)景中，命名為“arrow_mc”。調(diào)整場(chǎng)景中的Symbol的布局如圖所示。
8. 在主場(chǎng)景的時(shí)間軸上增加一個(gè)層，命名為“Action”，在此層的Action面板上增加代碼如下：
//注釋1
/* Copyright 2003 Macromedia, Inc. All rights reserved.
The following is Sample Code and is subject to all restrictions
on such code as contained in the End User License Agreement
accompanying this product.
*/
//注釋2
display.onEnterFrame = function () {
if (Selection.getFocus() != null) {
var mcfocus:MovieClip;
var mcloc:Object = {x:0, y:0};
// Get the object that's in focus
mcfocus = eval(Selection.getFocus());
// Set the label
this.label.text = mcfocus;
// Get the location of the object in global coordinates
mcloc = {x:mcfocus._x, y:mcfocus._y};
mcfocus._parent.localToGlobal(mcloc);
//注釋3
// Move the arrow to point to it
this._parent.arrow_mc._x = mcloc.x;
this._parent.arrow_mc._y = mcloc.y;
} else {
//注釋4
label.text = "There is no object in focus.";
this._parent.arrow_mc._x = 0;
this._parent.arrow_mc._y = 0;
}
}
//注釋5
function onClick (evt) {
if (evt.target.selectedRadio == radio_single) {
colorList.multipleSelection = false;
} else {
colorList.multipleSelection = true;
}
}
//注釋6
radioGroup.addEventListener("click", onClick);
radio_single.selected = true;
2004中的Action跟MX的Action有很大的區(qū)別，所以盡量詳細(xì)的解釋。
注釋1：是版權(quán)信息，實(shí)例的來(lái)源是在Flash MX 2004的幫助文件中，所以保留這樣的版權(quán)信息。
注釋2：這個(gè)函數(shù)是根據(jù)鼠標(biāo)選定的組件來(lái)更改在Display中顯示的內(nèi)容。
注釋3：將箭頭移動(dòng)到鼠標(biāo)選定的組件附近。
注釋4：鼠標(biāo)沒(méi)有選定如何組件，將箭頭放在左上角。
注釋5：是Radio Button的偵聽(tīng)函數(shù)，根據(jù)選定的Radio Button設(shè)置List組件中的屬性。
注釋6：為兩個(gè)Radio Button組件增加“click”的事件偵聽(tīng)，偵聽(tīng)函數(shù)為“OnClick”，并設(shè)置默認(rèn)選擇的Radio Button為單選。
三、實(shí)際用途
這個(gè)實(shí)例主要涉及的是UI組件和對(duì)組件的編程。UI組件的用途主要是在WEB方面，比如在用Flash制作網(wǎng)頁(yè)中的表單時(shí)，豐富的組件和靈活的控制會(huì)讓工作變得非常輕松。而且也提供了一個(gè)組件應(yīng)用的思路：不單單可以將常用的東西封裝成組件，也可以通過(guò)編程更靈活地控制組件。
實(shí)例二、Behaviors Scrapbook
一、涉及特性
此實(shí)例涉及的特性主要有兩個(gè)：讀取圖片和設(shè)置Symbol的層次。不算是新增加的特性，但在性能方面的改進(jìn)還是比較大的。
二、制作過(guò)程
1. 按“Ctrl + F8”新建一個(gè)Symbol，類型為“Movie Clip”，命名為“photo”，在此Symbol中繪制一個(gè)黑色的長(zhǎng)方形。
2. 按“Ctrl + F8”新建一個(gè)Symbol，類型為“Movie Clip”，命名為“snapshot”，在此Symbol中繪制一個(gè)灰色的長(zhǎng)方形。將Symbol “photo”拖到此Symbol中，調(diào)整其位置，并命名為“photo”。
3. 將Symbol “snapshot”拖五次到場(chǎng)景中，命名為“snapshot1”、“snapshot2”、“snapshot3”、“snapshot4”、“snapshot5”。分別在每一個(gè)“snapshot”的Action面板上增加語(yǔ)句如下：
on (press) {
//注釋1
startDrag(this);
//注釋2
mx.behaviors.DepthControl.bringToFront(this);
}
on (release) {
//注釋3
stopDrag();
}
注釋1：當(dāng)鼠標(biāo)按下的時(shí)候，拖動(dòng)圖片。
注釋2：設(shè)置鼠標(biāo)所在的圖片為最前端。
注釋3：當(dāng)鼠標(biāo)松開(kāi)的時(shí)候，停止拖動(dòng)圖片。
4. 在主場(chǎng)景的時(shí)間軸上增加一個(gè)層，命名為“Action”，在此層的Action面板上增加代碼如下：
/* Copyright 2003 Macromedia, Inc. All rights reserved.
The following is Sample Coe and is subject to all restrictions
on such code as contained in the End User License Agreement
accompanying this product.
*/
//注釋1
this.snapshot1.photo.loadMovie("image1.jpg");
this.snapshot2.photo.loadMovie("image2.jpg");
this.snapshot3.photo.loadMovie("image3.jpg");
this.snapshot4.photo.loadMovie("image4.jpg");
this.snapshot5.photo.loadMovie("image5.jpg");
注釋1：分別從Flash所在的文件夾中讀取相應(yīng)的圖片出來(lái)。
5. 保存此Flash文檔，將5張圖片放在此Flash所在的文件夾中。注意圖片的命名要跟第4步中的圖片名一樣。
三、實(shí)際用途
讀取圖片的功能其實(shí)在Flash MX中已經(jīng)有了。不過(guò)從圖片的讀取速度跟顯示效果來(lái)看，改進(jìn)還是不小的。以后在用Flash制作圖片瀏覽器時(shí)，可以先讀取圖片的文件名，再動(dòng)態(tài)讀取所在文件夾中的圖片。
