第5章Authorware7.0的動態(tài)效果

5.1Authorware7.0中的動畫

5.2運動動畫效果

5.3運動動畫的應(yīng)用實例

5.1Authorware7.0中的動畫5.1.1顯示圖標中的顯示特效下面就以漢字“小"的書寫動畫為例進行說明。

1．程序設(shè)計我們可以通過制作得到一個筆畫書寫動畫程序。在演示窗口中，按照筆畫順序依次呈現(xiàn)"小"的各個部分。

2．核心技術(shù)本例主要使用顯示圖標的顯示特效。

3．具體制作

(1)首先在Photoshop中將圖片素材準備好，將“小”摳成三個筆畫的GIF圖片文件。

(2)打開Authorware7.0，新建文件，命名為“書寫動畫”，設(shè)置窗口大小為“根據(jù)變量”。

(3)依次拖放三個顯示圖標到流程線上，并命名為“豎”、“左點”、“右點”，如圖5-1所示。

(4)雙擊“豎”顯示圖標打開演示窗口，調(diào)整窗口到合適大小，選擇菜單欄的【插入】/【圖像...】命令，導入“書寫筆劃1”圖片，設(shè)置顯示模式為“透明”。

圖5-1

(5)選擇菜單欄中的【窗口】/【面板】/【屬性】命令，展開屬性面板，單擊“特效”欄后的“...”按鈕，打開如圖5-2所示特效方式對話框，左側(cè)“分類”欄中列出了所有大的類型。從中選擇“[內(nèi)部]”，可以在右側(cè)特效欄中看到所有屬于“[內(nèi)部]”的特效，選擇“從上往下”特效。對話框的下方是“周期”文本框，用于設(shè)置特效持續(xù)時間?！捌交蔽谋究?，用于設(shè)置特效的流暢程度。“影響”選項決定特效作用范圍。按照圖5-2設(shè)置“周期”為

5秒，“平滑”為100，“影響”選“僅限區(qū)域”。設(shè)置完后可以單擊“應(yīng)用”按鈕預(yù)覽效果，不滿意可以重設(shè)，滿意后單擊“確定”按鈕，關(guān)閉特效方式對話框。

圖5-2

(6)按住Shift鍵(以便于保留上一顯示圖標中的內(nèi)容)，雙擊“左點”顯示圖標，打開演示窗口，選擇菜單欄的【插入】/【圖像...】命令，導入“書寫筆劃2”圖片，設(shè)置顯示模式為“透明”。使用選擇工具移動“書寫筆劃2”圖片到豎勾圖案左側(cè)適當?shù)奈恢谩?/p>

(7)設(shè)置“左點”顯示圖標的顯示特效為“[內(nèi)部]”/“從右往左”，“周期”為3秒，“平滑”為100，“影響”為“僅限區(qū)域”。

(8)按住Shift鍵，雙擊“右點”顯示圖標，打開演示窗口，選擇菜單欄的【插入】/【圖像...】命令，導入“書寫筆劃3”圖片，設(shè)置顯示模式為“透明”。使用選擇工具移動“書寫筆劃3”圖片到豎勾圖案右側(cè)適當?shù)奈恢谩?/p>

(9)設(shè)置“右點”顯示圖標的顯示特效為“[內(nèi)部]”/“從左往右”，“周期”為3秒，“平滑”為100，“影響”為“僅限區(qū)域”。

(10)運行調(diào)試程序，可以看到“小”一筆一畫的書寫過程。

5.1.2擦除圖標中的擦除特效

(1)打開“特效字”程序，在“陰影字”、“浮雕字”和“空心字”對應(yīng)的等待圖標下方均拖放一個擦除圖標。

(2)單擊“運行”按鈕，運行程序，程序?qū)Ｔ诘谝粋€擦除圖標處等待設(shè)置。等待圖標的屬性面板如圖5-3所示。單擊演示窗口的“陰影字”文本對象，在擦除圖標的屬性面板右側(cè)文本框中會顯示出“陰影字”顯示圖標，表示該圖標已被列為擦除對象。(注意，擦除都是針對圖標而不是內(nèi)容的。)如果不小心點錯了對象，則可以選中右側(cè)文本框中想撤消的圖標，并單擊旁邊的“刪除”按鈕將它刪除。

(3)單擊“特效”欄后的“...”按鈕，設(shè)置與顯示圖標特效相同，選擇“從上往下”特效，參數(shù)使用默認的。

圖5-3

(4)再次單擊“運行”按鈕運行程序，程序?qū)Ｔ诘诙€擦除圖標處等待設(shè)置。單擊演示窗口中的“浮雕字”文本對象，將“浮雕字”顯示圖標擦除，擦除特效使用“從上往下”。用同樣的方法設(shè)置“空心字”的擦除特效。

(5)運行程序，觀看各種特效字過渡效果，為了使程序更流暢美觀，可以將四個顯示圖標的顯示特效設(shè)置為“從上往下”，這樣可以看到各特效字交替出現(xiàn)的動畫過程。

5.1.3移動圖標和顯示圖標生成的運動動畫

Authorware7.0提供了一個專門用于制作動畫的圖標：移動圖標?？梢酝ㄟ^顯示圖標和移動圖標的配合來實現(xiàn)顯示對象的位移，在5.2和5.3節(jié)中將會進行詳細的介紹。

5.1.4使用電影圖標連續(xù)播放靜態(tài)圖片產(chǎn)生動畫效果

動畫播放其實就是連續(xù)靜態(tài)的圖片的展示，利用人的視覺暫留而形成了動畫。因此，也可以利用Authorware7.0中的電影圖標制作動畫。如制作持續(xù)運動的箭頭、不停游動的鴨子等等，我們只要根據(jù)它們運動的特點，制作出一個循環(huán)周期的幾幅位圖，然后將它們存為256色(由于這些圖形比較簡單)位圖，名稱要統(tǒng)一(文件名統(tǒng)一用8個字符，前4個字符要相同，后4個字符是連續(xù)的數(shù)值，可以用ACDSee的批量重命名功能來制作)。然后，在Authorware7.0中新建一個文件，放置一個電影圖標到流程線上，雙擊之，打開對話框，單擊“導入”，找到上面位圖所在的文件夾，雙擊第一幀動畫所對應(yīng)的位圖文件，Authorware7.0就自動地將同一文件夾下的連續(xù)的幾幅位圖文件調(diào)入到電影圖標中，形成一個內(nèi)部動畫文件。

5.1.5使用函數(shù)和變量實現(xiàn)動畫效果

1．程序設(shè)計

我們可以通過制作得到一個指針轉(zhuǎn)動的時鐘程序。其中表盤是圓形，三個指針是線段，時針最短最粗，秒針最長最細，分針介于兩者之間，指針所指示的時間與電腦系統(tǒng)時間一致。

2．核心技術(shù)

本例主要使用了系統(tǒng)函數(shù)Line、Circle以及自定義變量和決策圖標的配合。Line和Circle是兩個系統(tǒng)函數(shù)，分別用于繪制直線段和圓。指針的轉(zhuǎn)動實質(zhì)是決策圖標的循環(huán)顯示形成的。

3．具體制作

1)表盤的畫法

拖一個計算圖標到流程線上，命名為“表盤”，雙擊打開其輸入窗口，在其中輸入如下的內(nèi)容：

r:=130

--設(shè)置表盤的半徑

a:=150

--設(shè)置表盤的圓心所在x軸的坐標

b:=150

--設(shè)置表盤的圓心所在y軸的坐標

SetFrame(1,RGB(200,200,200))--設(shè)置表盤邊線的顏色

Circle(1,a-3,b-3,a+3,b+3) --以表盤的中心為圓心畫半徑為3粗細為1的圓

Circle(15,a-r,b-r,a+r,b+r) --以表盤的中心為圓心畫半徑為r,粗細為15的圓

angle:=0--設(shè)置自定義變量angle的初始值為0

repeatwhileangle<=12

--當自定義變量angle的值小于或等于12時重復執(zhí)行以下語句。以下語句用于在圓上畫12個點表示時鐘的12個刻度

x1:=(r-15)*COS(angle)+a

y1:=(r-15)*SIN(angle)+b

Circle(4,x1-4,y1-4,x1+4,y1+4)

angle:=angle+Pi/6

endrepeat

2)表針的畫法

下面拖一個決策圖標到流程線上，然后在其右側(cè)放一個計算圖標，命名為“畫表針”。雙擊打開其輸入窗口，輸入如下的內(nèi)容：

xsec:=(r-20)*COS(-0.5*Pi+Sec*Pi/30)+a

ysec:=(r-20)*SIN(-0.5*Pi+Sec*Pi/30)+b

Line(3,a,b,xsec,ysec) --以上三句表達式是使用畫線函數(shù)畫秒針

xmin:=(r-40)*COS(-0.5*Pi+Minute*Pi/30)+a

ymin:=(r-40)*SIN(-0.5*Pi+Minute*Pi/30)+b

Line(5,a,b,xmin,ymin) --以上三句表達式是使用畫線函數(shù)畫分針

xhour:=(r-70)*COS(-0.5*Pi+5*Hour*Pi/30+Minute/360*Pi)+a

yhour:=(r-70)*SIN(-0.5*Pi+5*Hour*Pi/30+Minute/360*Pi)+b

Line(7,a,b,xhour,yhour) --以上三句表達式是使用畫線函數(shù)畫時針

3)退出的設(shè)置

在流程線上放一個計算圖標，命名為“退出”，雙擊打開其輸入窗口，在其中輸入如下的內(nèi)容：

Quit()

完成后的程序流程線如圖5-4所示。

圖5-45.2運動動畫效果

5.2.1顯示圖標和移動圖標移動圖標本身并不包含移動對象，而是在給定的時間內(nèi)或以指定的速度，將顯示圖標或其他具有顯示圖標功能的圖標中的對象，從一個位置移到另一個位置，因此需要在移動圖標前面(不一定緊挨該圖標)設(shè)置顯示圖標或含有顯示內(nèi)容的其他圖標，作為移動對象。另外，一個移動圖標只能對一個設(shè)計圖標中的對象進行移動操作，如果要控制多個圖標中的對象的移動，就必須設(shè)置多個移動圖標。

如果一個設(shè)計圖標中有多個對象，而設(shè)計者將其中的一個對象設(shè)定為移動圖標的對象，那么移動圖標不僅移動該對象，而且將同一個顯示圖標中的其他對象同時移動。換句話說，移動圖標設(shè)定的移動對象不是設(shè)計圖標中的顯示內(nèi)容，而是設(shè)計圖標。因此，被移動的對象應(yīng)該單獨放置在一個設(shè)計圖標中。

與顯示圖標類似，用鼠標右鍵單擊移動圖標并在彈出式菜單中選擇“預(yù)覽”命令可以預(yù)覽移動對象，單擊其他地方可以關(guān)閉預(yù)覽區(qū)。也可以按住Ctrl鍵，用鼠標右鍵點擊需要預(yù)覽內(nèi)容的圖標，直接展開預(yù)覽區(qū)查看，如圖5-5所示。

圖5-55.2.2設(shè)置動畫類型

Authorware7.0的移動圖標提供了五種類型的運動方式。對于移動圖標的設(shè)置一般分為三步：選擇移動對象，設(shè)置運動類型，設(shè)置運動屬性。

第一種，指向固定點。

這種移動方式的特點是將對象從當前位置沿直線移動到指定位置。屬性面板如圖5-6所示，只有“目標”可以設(shè)置，基點和終點都以灰色顯示。

圖5-6

1．程序設(shè)計

我們可以通過制作得到一個飛機飛行的動畫程序。目標點可以通過移動圖標屬性面板修改。

2．核心技術(shù)

本例主要使用了移動圖標和顯示圖標的配合生成動畫效果。移動圖標的移動類型不同，動畫的效果也就不同。本例使用的是“指向固定點”運動類型。

3．具體制作

(1)新建文件，命名為“飛機飛行”。

(2)拖放顯示圖標到流程線上，命名為“飛機”。插入飛機圖片，放在演示窗口的左

上角。

(3)拖放運動圖標到流程線上，命名為“飛行”。

(4)單擊“運行”按鈕，程序停在運動圖標處等待設(shè)置。單擊演示窗口中的飛機對象，在移動圖標屬性面板左上角的預(yù)覽窗口中可以看到出現(xiàn)了飛機對象。

(5)在面板右側(cè)“類型”下拉列表中選擇“指向固定點”。

(6)拖動演示窗口中的飛機到窗口右側(cè)，在屬性面板中的“目標”欄會顯示相應(yīng)的坐

標值。

(7)單擊面板左下角的“預(yù)覽”按鈕，可以看到飛機從演示窗口的左側(cè)飛到了右側(cè)。

第二種，指向固定直線上的某點。

這種移動方式的特點是將對象從當前位置沿直線移動到指定直線上的某個位置。從最終的效果上看和上一種移動方式產(chǎn)生的效果幾乎一樣，都是直線運動。但是這種移動方式的目的地已經(jīng)由確定的某點變?yōu)橹本€上不確定的某點。下面舉例說明。

1．程序設(shè)計

我們可以通過制作得到一個紅旗順著旗桿上升的動畫程序。目標點在每次運行程序的時候都會不同。

2．核心技術(shù)

本例主要使用了移動圖標中“指向固定直線上的某點”運動類型。其中目標點的設(shè)置使用了系統(tǒng)函數(shù)Random(min，max，units)，該函數(shù)的功能是在給定的取值范圍中，按指定的取值單位隨機給出一個數(shù)值。

3．具體制作

(1)新建文件，命名為“升旗”。

(2)拖放顯示圖標到流程線上，命名為“旗桿”，雙擊顯示圖標打開演示窗口，使用“矩形”工具，繪制如圖5-7所示形狀的旗桿。

(3)再拖放一個顯示圖標到流程線上，命名為“紅旗”。按住Shift鍵，雙擊顯示圖標打開演示窗口，使用“矩形”工具，在旗桿旁邊繪制如圖5-7所示的紅旗。

圖5-7

(4)拖放一個移動圖標到流程線上，命名為“升旗”。選擇屬性面板“類型”下拉列表中的“指向固定直線上的某點”，屬性面板中的基點和終點由灰色變?yōu)楹谏螕簟凹t旗”，會在中間區(qū)域出現(xiàn)一個小黑點，表示起點。拖動紅旗到旗桿頂，確定直線的終點，在起點和終點之間有一根直線。在屬性面板上，基點為起點，值為0，終點為線的終點，值為100，目標為紅旗最終要停的位置，輸入半角的0到100之間的數(shù)值，在此輸入隨機函數(shù)Random(0，100，1)。

(5)可以通過預(yù)覽查看效果，也可以單擊“運行”按鈕查看效果，可以發(fā)現(xiàn)每次運行紅旗停的位置都不一樣。

第三種，指向固定區(qū)域內(nèi)的某點。

這種移動方式與上一種移動方式的不同之處在于目標點的選擇由直線展成了二維平面。下面以一個擲色子的程序為例介紹這種移動方式的特點。

1．程序設(shè)計

我們可以通過制作得到一個擲色子的動畫程序。在每次運行程序時中間的圓點會隨機移動到六個色子圖案中的某一個上面，從而確定色子的點數(shù)。

2．核心技術(shù)

本例主要使用了移動圖標中“指向固定區(qū)域內(nèi)的某點”運動類型。其中目標點的設(shè)置使用了系統(tǒng)函數(shù)Random(min，max，units)。與上例的不同之處在于，上例是一維方向取值，本例是二維方向取值。

3．具體制作

(1)新建文件，命名為“擲色子”。

(2)參照圖5-8，拖放圖標到流程線上，并且命名。

(3)運行程序，首先停在計算圖標的輸入窗口，自定義兩個變量，在計算圖標窗口中輸入以下內(nèi)容：

X:=Random(0,100,50)

Y:=Random(0,100,100)

關(guān)閉輸入窗口，接著會彈出提示框和定義新變量窗口，依次按“是”和“確定”按鈕。

圖5-8

(4)接著彈出顯示圖標“背景”的演示窗口，參照圖5-9，輸入標題并畫六個色子圖案。

圖5-9

(5)關(guān)閉演示窗口，重新運行程序，窗口停在“色子”圖標的演示窗口，在六個色子的中間畫一個紅色小圓。

(6)單擊流程線上的“移動”移動圖標，設(shè)置紅色小色子的運動軌跡。首先單擊演示窗口中的紅色小圓，選擇運動對象，然后選擇運動類型為“指向固定區(qū)域內(nèi)的某點”。移動小圓確定起點，再移動小圓拉出一個矩形區(qū)域。

(7)調(diào)整運動區(qū)域與背景一致，先選中移動圖標屬性面板中的基點，移動小圓到“一點圓角矩形”中間，再選中屬性面板中的終點，移動小圓到“六點圓角矩形”中間，如圖5-10所示。在屬性面板的“目標”欄后的文本框中分別輸入“x”和“y”，來表示小圓的目的地，坐標值如圖5-11所示。其他參數(shù)使用默認值。

圖5-10圖5-11

(8)每次運行程序，都可以看到小圓會移動到的目標點為六個圓角矩形中的某一個，從而確定色子的點數(shù)。

第四種，指向固定路徑的終點。

1．程序設(shè)計

我們可以通過制作得到一個小鳥飛行的動畫程序。小鳥的飛行路徑和飛行速度都可以通過移動圖標的屬性面板進行設(shè)置。

2．核心技術(shù)

本例主要使用了移動圖標中“指向固定路徑的終點”運動類型。小鳥的運動軌跡可以編輯為直線、折線和曲線等多種形式。

3．具體制作

(1)新建文件，命名為“小鳥飛行”。

(2)拖放顯示圖標到流程線上，命名為“小鳥”。雙擊顯示圖標，打開演示窗口，插入小鳥圖片。

(3)在不關(guān)閉演示窗口的前提下，拖放移動圖標到流程線上，命名為“飛行”。單擊演示窗口中的小鳥選擇移動對象，選擇屬性面板中的類型為“指向固定路徑的終點”。

3．具體制作

(1)新建文件，命名為“小鳥飛行”。

(2)拖放顯示圖標到流程線上，命名為“小鳥”。雙擊顯示圖標，打開演示窗口，插入小鳥圖片。

(3)在不關(guān)閉演示窗口的前提下，拖放移動圖標到流程線上，命名為“飛行”。單擊演示窗口中的小鳥選擇移動對象，選擇屬性面板中的類型為“指向固定路徑的終點”。

圖5-12

(6)編輯路徑。如果路徑的位置不合適，可以拖放句柄到其它位置，路徑會自動進行調(diào)整。如果路徑的形狀不合適，可以在路徑上添加控制句柄。要添加控制句柄，只需在路徑上單擊即可。提示：在曲線路徑上單擊添加的是圓形句柄，在直線路徑上單擊添加的是三角形句柄。句柄也可以刪除，首先用鼠標單擊要刪除的句柄，再單擊屬性對話框上的“刪除”按鈕。要撤銷上一步操作，可單擊“撤消”按鈕。注意：選中控制句柄后，按鍵盤上的Delete鍵并不能刪除句柄，必須單擊“刪除”按鈕才可刪除。

(7)創(chuàng)建完路徑后，可按“預(yù)覽”按鈕預(yù)覽效果。

第五種，指向固定路徑上的某點。

這種移動方式與上一種類似，只是還需要設(shè)置對象在路徑上的目標點，來確定對象的最終位置。該方式的特點是，對象的最終位置在路徑上的某一點。和“指向固定直線上的某點”不同之處僅在于一種是直線路徑，另一種是折線或曲線路徑。

5.2.3設(shè)置運動速度和其他屬性

移動圖標除了可以通過類型選擇移動的路徑，還可以設(shè)置運動的快慢。如圖5-13所示，“定時”下拉列表中有兩個選項?！皶r間”表示移動對象所需時間，單位為秒，適宜于對時間要求比較精確的場合；“速率”表示移動的對象以指定速度移動，適宜于要求勻速的場合。選擇好“定時”方式后，在其下的文本框中輸入數(shù)值即可。

圖5-13如果一個程序里有多個對象要同時移動，則可以使用“執(zhí)行方式”下拉列表。該列表如圖5-14所示，“等待直到完成”表示該移動圖標執(zhí)行完后再執(zhí)行其后的圖標；“同時”表示該移動圖標和其后的圖標同步執(zhí)行；“永久”表示當對象移動目標點采用變量或表達式來控制時，此選項會在程序執(zhí)行過程中一直監(jiān)視變量，一旦變量值發(fā)生改變，就會移動對象到新的目的地。“永久”選項只有在后四種移動方式中才會出現(xiàn)。

圖5-14

“遠端范圍”下拉列表用于設(shè)置對象移動到目的地超出路徑或區(qū)域范圍后怎么走的問題。該列表包括三個選項，如圖5-15所示?！把h(huán)”表示當給定的“目標”值大于終點數(shù)值時，以“目標”值除以終點數(shù)值，余數(shù)為對象移動的實際目的地；“在終點停止”表示當給定的“目標”值大于終點數(shù)值時，對象只移動到終點就停止，這是系統(tǒng)的默認設(shè)置；“到上一終點”表示當給定的“目標”值大于終點數(shù)值時，對象越過終點，一直移動到給定的目的地。

圖5-155.3運動動畫的應(yīng)用實例

1．程序設(shè)計我們可以通過制作得到一個運動類型動畫程序。首先是鼠標后面跟隨一串字符，字符隨著鼠標的移動而跟隨移動。單擊窗口中間的開始按鈕可以看到小鳥的飛行動畫，再單擊窗口中任意位置小鳥停在路徑的終點。

2．核心技術(shù)

本例主要使用了移動圖標中“指向固定區(qū)域內(nèi)的某點”和“指向固定路徑的終點”運動類型。鼠標跟隨使用了系統(tǒng)變量CursorX和CursorY。CursorX和CursorY分別存放了當前鼠標指針所在位置的X坐標和Y坐標，單位是像素。

3．具體制作

首先新建文件，設(shè)置文件屬性：窗口尺寸為640×480，背景色為白色，交互選項卡中等待按鈕的標簽由“繼續(xù)”改為“開始”。將文件保存，命名為“綜合實例”。

1)多對象移動的設(shè)置

(1)拖放四個顯示圖標到流程線上，再拖放四個移動圖標到流程線上，并按圖5-16所示命名。

圖5-16

(2)使用顯示圖標的文本工具，分別在四個顯示圖標中輸入“歡”“迎”“訪”“問”，設(shè)置字體為黑體，字號為10，斜體，顏色四字各不相同。

(3)設(shè)置移動圖標“歡移”，首先選擇移動對象，然后選擇移動類型為“指向固定區(qū)域內(nèi)的某點”。設(shè)置固定區(qū)域為全演示窗口。屬性參照圖5-17所示設(shè)置。

圖5-17

(4)后面三個移動圖標的屬性設(shè)置和圖5-17一樣