基于as3.0的計(jì)算機(jī)硬件安裝交互課件開(kāi)發(fā)

董會(huì)權(quán)

摘要：該文提出了在計(jì)算機(jī)基礎(chǔ)課程教學(xué)中，計(jì)算機(jī)硬件方面的教學(xué)內(nèi)容的一些不足，提出了教學(xué)上利用交互式課件的模式，并重點(diǎn)介紹了如何開(kāi)發(fā)一款計(jì)算機(jī)硬件安裝的課件。

關(guān)鍵詞：AS3.0；交互；事件監(jiān)聽(tīng)；MouseEvent

中圖分類號(hào)：TP311 文獻(xiàn)標(biāo)識(shí)碼：A 文章編號(hào)：1009-3044（2015）09-0126-03

Abstract： This paper is presented in the teaching of computer basic courses， some shortcomings of the teaching content of computer hardware， puts on the teaching mode of interactive courseware， and focuses on how to develop a computer hardware installation of the courseware.

Key words： AS3.0； Interactive； Event listener； MouseEvent

1 開(kāi)發(fā)背景

在計(jì)算機(jī)公共課教學(xué)中，計(jì)算機(jī)硬件的教學(xué)內(nèi)容是該課程的一個(gè)重要組成。但在教學(xué)中一般的過(guò)程是介紹硬件系統(tǒng)的組成、工作原理、各個(gè)硬件參數(shù)等。學(xué)生幾乎沒(méi)有對(duì)實(shí)際硬件接觸乃至組裝的機(jī)會(huì)。如果沒(méi)有實(shí)際的接觸和組裝，這部分的教學(xué)效果會(huì)大打折扣，筆者根據(jù)自己的教學(xué)實(shí)際需求，利用FLASH CS5.5 AS3.0及Photoshop設(shè)計(jì)和開(kāi)發(fā)了一款適合計(jì)算機(jī)硬件教學(xué)的交互式課件。

2 課件基本模塊設(shè)計(jì)

本課件根據(jù)教學(xué)實(shí)際需求包含硬件系統(tǒng)工作原理、具體硬件介紹、安裝演示、仿真安裝練習(xí)和測(cè)試習(xí)題五個(gè)部分

工作原理介紹功能：利用動(dòng)畫演示計(jì)算機(jī)對(duì)數(shù)據(jù)加工處理的基本過(guò)程。分為輸入、存儲(chǔ)、運(yùn)算和輸出4個(gè)環(huán)節(jié)。

主要硬件介紹功能：利用動(dòng)畫演示每個(gè)硬件在計(jì)算機(jī)中的位置，物理外形、主要參數(shù)等

安裝演示功能：利用教學(xué)錄像演示計(jì)算機(jī)硬件的整個(gè)安裝流程，先介紹硬件實(shí)物然后進(jìn)入具體安裝，整個(gè)過(guò)程有配音和字幕。

模擬仿真安裝：利用交互式動(dòng)畫建立一個(gè)模擬仿真的安裝環(huán)境，使用者通過(guò)拖放式的游戲進(jìn)行硬件的模擬安裝。

習(xí)題練習(xí)功能：利用交互功能創(chuàng)建單項(xiàng)選擇練習(xí)題環(huán)境，使用者可以通過(guò)練習(xí)檢驗(yàn)自己所學(xué)知識(shí)的掌握情況。

3 主界面搭建

主界面是一個(gè)導(dǎo)航界面，通過(guò)主界面可以跳轉(zhuǎn)到前面所述的各個(gè)功能模塊。主界面建立在技術(shù)上主要是利用圖形繪制界面，添加相應(yīng)按鈕來(lái)進(jìn)行跳轉(zhuǎn)控制。跳轉(zhuǎn)控制主要通過(guò)編寫按鈕的CLICK事件監(jiān)聽(tīng)程序來(lái)實(shí)現(xiàn)。界面的基本外觀如圖1所示。

4 各個(gè)功能實(shí)現(xiàn)

1）工作原理介紹功能實(shí)現(xiàn)

首先建立獨(dú)立場(chǎng)景，在本場(chǎng)景下導(dǎo)入相關(guān)基本素材。整個(gè)工作原理介紹為一個(gè)完整的動(dòng)畫自動(dòng)演示過(guò)程，以一個(gè)顯示二進(jìn)制數(shù)的元件模擬一個(gè)被加工處理的數(shù)據(jù)，利用帶有箭頭的線段作為控制線、數(shù)據(jù)線和地址線的信號(hào)變化和方向變化。在控制線動(dòng)畫的作用下產(chǎn)生輸入動(dòng)作，數(shù)據(jù)元件從輸入設(shè)備端進(jìn)入通過(guò)數(shù)據(jù)線進(jìn)入內(nèi)存，內(nèi)存中一個(gè)帶有地址編號(hào)的單元出現(xiàn)該數(shù)據(jù)表示一個(gè)存儲(chǔ)動(dòng)作。在通過(guò)控制線動(dòng)畫模擬發(fā)出運(yùn)算指令向內(nèi)存取數(shù)據(jù)，內(nèi)存中數(shù)據(jù)元件進(jìn)入CPU，隨后進(jìn)行運(yùn)算操作。控制線再發(fā)出存放數(shù)據(jù)指令將運(yùn)算后的數(shù)據(jù)存入內(nèi)存中?？刂凭€發(fā)出輸出指令，數(shù)據(jù)通過(guò)數(shù)據(jù)線傳遞至輸出設(shè)備，整個(gè)動(dòng)畫演示結(jié)束。本部分的功能實(shí)現(xiàn)首先要清楚了解計(jì)算機(jī)的基本工作原理，然后在技術(shù)實(shí)現(xiàn)上能夠更形象描述出每個(gè)動(dòng)作變化。對(duì)每個(gè)環(huán)節(jié)上動(dòng)畫之間順序進(jìn)行正確編排，本部分基本不需要代碼編寫即可完成。

2）硬件演示實(shí)現(xiàn)

硬件演示的目標(biāo)是告訴學(xué)習(xí)者每個(gè)硬件在計(jì)算機(jī)中所處位置，物理外觀如何以及主要參數(shù)意義。因此本模塊采用了二級(jí)導(dǎo)航，用戶選擇不同硬件按鈕后播放不同的動(dòng)畫內(nèi)容，如單擊“CPU”按鈕時(shí)，首先顯示CPU在計(jì)算機(jī)中的位置；然后彈出物理外觀圖；同時(shí)介紹物理外觀下的各個(gè)部分；最后放大CPU背面顯示主要參數(shù)。其他硬件部分以此類推。

3）硬件系統(tǒng)安裝演示實(shí)現(xiàn)

在這部分功能中主要是一個(gè)教學(xué)錄像片。教學(xué)錄像錄制時(shí)，先介紹每個(gè)主要獨(dú)立硬件，安裝工具，最后是安裝過(guò)程。在安裝過(guò)程錄制時(shí)有每一步驟的配音，安裝步驟科學(xué)安排。首先是在主板上安裝CPU、風(fēng)扇、內(nèi)存和顯示卡；然后將主板固定于機(jī)箱，將機(jī)箱相關(guān)連線與主板連接；安裝硬盤及光驅(qū)；封箱后連接鍵盤鼠標(biāo)顯示器等外圍設(shè)備。

教學(xué)錄像中的一些重要環(huán)節(jié)應(yīng)該加入提示標(biāo)記等符號(hào)，因此錄制完成后再利用會(huì)聲會(huì)影加以編輯。在相應(yīng)的時(shí)段加入提示符號(hào)，提示字幕來(lái)為學(xué)習(xí)者更加詳細(xì)的解釋安裝過(guò)程。

4）硬件安裝仿真實(shí)現(xiàn)

該功能可以解決實(shí)際安裝需要拆解機(jī)器，造成器件消耗的成本問(wèn)題。安裝仿真采用交互游戲的模式，學(xué)習(xí)者可以通過(guò)在模擬環(huán)境下的操作來(lái)進(jìn)行安裝的練習(xí)。

以主板硬件安裝為例，首先需要完成素材準(zhǔn)備。為了模擬該環(huán)境，將一個(gè)主板和主板上所有插接的原件拍攝成圖片；利用Photoshop對(duì)圖片中主板上的原件進(jìn)行截取，保存為獨(dú)立圖片。該工作結(jié)束后，將得到主板及所插接硬件的整體圖片，主板上插接的各個(gè)部件（如顯卡、內(nèi)存、CPU等）圖片。第二部將上述圖片導(dǎo)入Flash庫(kù)中，在新建場(chǎng)景中，利用導(dǎo)入的圖片創(chuàng)建主板元件及主板上插接部件相關(guān)的元件，將這些元件一一放入場(chǎng)景中，布局位置大概位置如圖2所示，同時(shí)為各個(gè)元件實(shí)例進(jìn)行命名。命名是為了在后續(xù)的程序代碼中對(duì)這些元件進(jìn)行引用。

在基本場(chǎng)景及元件建立完成后，核心工作是對(duì)指定的元件進(jìn)行編碼來(lái)完成模擬安裝交互操作。以內(nèi)存安裝為例。首先場(chǎng)景右側(cè)放置了內(nèi)存的元件，實(shí)例名稱為nc；在主板上內(nèi)存位置放置了一個(gè)內(nèi)存元件，實(shí)例名稱為ncs；在主板內(nèi)存相應(yīng)位置制作一個(gè)與此位置圖形一致的圖形元件，實(shí)例名為nccz；在動(dòng)作代碼中將ncs設(shè)置為不可見(jiàn)，this.ncs.alpha=0。然后編寫nc和nccz的監(jiān)聽(tīng)代碼。

Nc元件的代碼主要是響應(yīng)鼠標(biāo)拖動(dòng)，拖動(dòng)中釋放鼠標(biāo)時(shí)檢測(cè)其是否與nccz元件發(fā)生了hitTestObject事件；如果發(fā)生則令ncs可見(jiàn)，拖放結(jié)束，nc不可見(jiàn)；否則nc回到原來(lái)位置。具體代碼如下：

function release_xk（event：MouseEvent）

{if （tnc.hitTestObject（nccz））

{this. nc.alpha = 0；

this.tnc.stopDrag（）；

this.ncs.alpha = 100；}

else

{tnc.y = 235.85；

tnc.x = 80.15；

nc.stopDrag（）；}}

function move_nc（event：MouseEvent）

{this.nc.startDrag（）；}

nc.addEventListener（MouseEvent.MOUSE_DOWN，move_nc）；

tnc.addEventListener（MouseEvent.MOUSE_UP，release_xk）；

測(cè)試時(shí)，拖動(dòng)nc元件，如果nc元件正好被拖動(dòng)至nccz上釋放鼠標(biāo)，則ncs控件會(huì)顯示在內(nèi)存應(yīng)該所在位置；如果沒(méi)有在nccz上釋放鼠標(biāo)，那么hitTestObject事件不會(huì)發(fā)生，則nc將回到原來(lái)位置顯示，可以繼續(xù)進(jìn)行拖動(dòng)操作。

5）單選練習(xí)功能實(shí)現(xiàn)

創(chuàng)建場(chǎng)景如圖3所示，主要包含了4個(gè)復(fù)選按鈕控件ca、cb、cc、cd，作為4個(gè)選項(xiàng)按鈕，添加了3個(gè)按鈕st、xt、pd，st切換到上一題；xt切換到下一題；pd判斷答題結(jié)果。該功能的主要控制邏輯是當(dāng)操作者做出選擇并單擊判斷按鈕后，根據(jù)選擇的選項(xiàng)是否正確給出提示，提示方式是播放一個(gè)正確zq或錯(cuò)誤cw的影片剪輯。

主要代碼如下：

判斷作答是否正確代碼

Function pd1（pd：MouseEvent）

{if（ca.selected==0 &&cb.selected==1 &&cc.selected==0 &&cd.selected==0）

{right_mc.play（）；}

else{

false_mc.play（）；}}

pd.addEventListener（MouseEvent.CLICK，pd1）；

試題之間切換代碼

function xyt（e：MouseEvent）

{this.nextFrame（）；}

xt.addEventListener（MouseEvent.CLICK，xyt）；

//跳轉(zhuǎn)上一題；

function xyt（e：MouseEvent）

{this.prevFrame（）；}

xt.addEventListener（MouseEvent.CLICK，xyt）；

5 測(cè)試應(yīng)用

經(jīng)過(guò)調(diào)試后，最后發(fā)布生成swf文件，在本學(xué)期的課堂教學(xué)中投入實(shí)際應(yīng)用。在硬件教學(xué)中主要以該課件進(jìn)行，學(xué)生對(duì)這種形式非常歡迎，課堂教學(xué)效果有了進(jìn)一步改善。尤其是模擬安裝練習(xí)和習(xí)題測(cè)試，由于是具有交互性的環(huán)境學(xué)生樂(lè)于反復(fù)嘗試，這要最直接的結(jié)果就是對(duì)計(jì)算機(jī)硬件課程內(nèi)容的良好掌握。

參考文獻(xiàn)：

[1] 劉紹英， 劉成鎖. 網(wǎng)絡(luò)課件設(shè)計(jì)[J]. 中國(guó)電化教育， 2002（7）.

[2] 朱凌云， 羅廷錦， 余勝泉. 網(wǎng)絡(luò)課程評(píng)價(jià)[J]. 開(kāi)放教育研究， 2002（1）.