基于RIA平臺的數(shù)據(jù)結(jié)構(gòu)多媒體課件的設計

謝運佳+趙劍冬

摘要：RIA兼有B/S結(jié)構(gòu)的靈活性和C/S結(jié)構(gòu)的強交互性，是未來多媒體課件設計的一個趨勢。本文結(jié)合“數(shù)據(jù)結(jié)構(gòu)二叉樹”一節(jié)的內(nèi)容，論述如何使用FLEX技術(shù)開發(fā)RIA平臺下的多媒體課件，并針對其中的技術(shù)難點提出相應的解決方案，希望能夠為廣大RIA多媒體課件制作者提供一個參考和借鑒的案例。

關鍵詞：富互聯(lián)網(wǎng)應用；多媒體課件；FLEX；二叉樹

中圖分類號：G434 文獻標識碼：A 論文編號：1674-2117（2017）12-0069-03

● 前言

RIA（Rich Internet Applications）是指富互聯(lián)網(wǎng)應用，它將桌面應用程序的強交互性與傳統(tǒng)Web應用的靈活性結(jié)合起來，為用戶帶來全新的體驗。目前，市場上RIA的技術(shù)平臺主要有Flex、XUL、Ajax等。其中，由于Flex有強大的Adobe公司支持，再加上Flash Player播放器的廣泛使用，因此它在RIA市場占據(jù)著主導地位。

數(shù)據(jù)結(jié)構(gòu)是計算機科學中一門重要的專業(yè)課，二叉樹又是其中極為重要的一個知識點。目前，許多數(shù)據(jù)結(jié)構(gòu)多媒體課件都是通過動畫的形式來展示二叉樹遍歷的過程。如圖1所示，這是典型的展示型多媒體課件，它利用Flash的幀動畫，動態(tài)地呈示二叉樹的遍歷過程。這與用文字描述的PPT相比，能夠更加容易地讓學生明白二叉樹的遍歷過程。但它的缺點是，動畫顯示的過程只是針對界面上事先設置好的那棵樹，如果學生想觀察其他的二叉樹的遍歷過程，顯然這個課件是無法滿足學生需求的。

為解決上述多媒體課件的缺點，下面，筆者以“數(shù)據(jù)結(jié)構(gòu)二叉樹”一節(jié)為例，采用Flex3.0技術(shù)，以Adobe Flex Builder 3為開發(fā)環(huán)境，論述基于RIA平臺的多媒體課件的設計與實現(xiàn)。

● 基于RIA平臺設計數(shù)據(jù)結(jié)構(gòu)二叉樹多媒體課件

1.課件設計總體目標

筆者以RIA為平臺，建構(gòu)的數(shù)據(jù)結(jié)構(gòu)二叉樹多媒體課件是根據(jù)教學大綱的要求并以清華大學出版社出版的《數(shù)據(jù)結(jié)構(gòu)與算法教程》（第二版）為藍本進行開發(fā)的，其主要目的在于加強課件與學習者之間的交互性，學習者可以根據(jù)自己的理解，動態(tài)地生成一棵二叉樹，并觀察它的遍歷情況。為了這個目的，該課件會創(chuàng)建一個實驗環(huán)節(jié)，在這個環(huán)節(jié)中學習者可以按照自己意愿，以括號輸入法的形式隨意輸入不同的二叉樹。同時，通過按鈕交互，實驗平臺將會根據(jù)學習者所輸入的內(nèi)容呈現(xiàn)不同的二叉樹，并按其意愿顯示出該二叉樹先序、中序、后序和層次四種遍歷的演示過程。另外，多媒體課件的建構(gòu)首先要分析數(shù)據(jù)結(jié)構(gòu)二叉樹遍歷的教學目標，具體內(nèi)容如下頁表所示。

2.課件總體框架設計

數(shù)據(jù)結(jié)構(gòu)二叉樹多媒體課件的制作目標是容納數(shù)據(jù)結(jié)構(gòu)二叉樹所有基礎教學內(nèi)容，利用實驗的方式向?qū)W習者展示二叉樹遍歷的原理、過程和結(jié)果，并為學習者提供掌握鞏固所學內(nèi)容的強化練習測試。因此，本課件的框架主要分為課件簡介、教學大綱、教學計劃、教學內(nèi)容、實驗大綱、源碼下載、練習測試和幫助文檔八個模塊。

①課件簡介模塊：用一個頁面對數(shù)據(jù)結(jié)構(gòu)二叉樹多媒體課件的制作原因和目的進行簡單的說明。

②教學大綱模塊：陳述數(shù)據(jù)結(jié)構(gòu)這門課程的各章節(jié)內(nèi)容的教學大綱要求。

③教學計劃模塊：對數(shù)據(jù)結(jié)構(gòu)這門課程的各章節(jié)知識點進行課時安排。

④教學內(nèi)容模塊：展示數(shù)據(jù)結(jié)構(gòu)這門課程各章節(jié)的教學內(nèi)容。

⑤實驗大綱模塊：列舉數(shù)據(jù)結(jié)構(gòu)這門課程各章節(jié)的實驗大綱要求，并對實驗大綱中所要求的實驗提供模擬實驗室的鏈接。

⑥源碼下載模塊：提供《數(shù)據(jù)結(jié)構(gòu)與算法教程》教材里重要的算法源碼的下載。

⑦練習測試模塊：為學習者提供類型豐富的習題，以鞏固其學習效果。

⑧幫助文檔模塊：為學習者提供課件的使用幫助文檔。

為了增強系統(tǒng)的可維護性和可擴充性，該課件的八個模塊在內(nèi)容上都是相互獨立的，學習者可以通過導航進入各個模塊內(nèi)部（如圖2）。

為了讓學習者能夠清楚直觀地了解二叉樹遍歷的原理、過程和結(jié)果，筆者在實驗大綱模塊中打造一個數(shù)據(jù)結(jié)構(gòu)二叉樹的實驗平臺。其設計思想是：實驗平臺由實驗目的、實驗步驟、實驗室和實驗使用幫助四個環(huán)節(jié)組成。學習者通過實驗大綱頁面上相應的平臺鏈接進入到數(shù)據(jù)結(jié)構(gòu)二叉樹的實驗平臺。在實驗平臺上，學習者可以了解到數(shù)據(jù)結(jié)構(gòu)二叉樹實驗的實驗目的、實驗步驟和實驗使用幫助，當了解了這一系列的內(nèi)容后，學習者就可以進入到實驗室。

實驗室主要由四個部分組成，一是給予學習者以括號表示法輸入二叉樹的TextInput輸入框，二是給予學習者選擇二叉樹遍歷方式的Button交互按鈕，三是文字展示二叉樹遍歷方法的隱性的Text文本框，四是動畫展示二叉樹生成與遍歷過程的Canvas容器。

在實驗室中，學習者可以根據(jù)自己的想法用括號表示法的形式在TextInput輸入框中輸入不同的二叉樹，然后點擊“OK”按鈕，實驗室的Canvas容器中就會自動生成該二叉樹的邏輯結(jié)構(gòu)圖。當二叉樹的邏輯結(jié)構(gòu)圖生成后，學習者就可以在該二叉樹的基礎上自主選擇先序、中序、后序還是層次遍歷，操作方法是單擊所選擇的遍歷所對應的“OK”按鈕即可。響應這個交互動作后，Text文本框?qū)⒂呻[性轉(zhuǎn)化為顯性，用文字形式展示出該遍歷的方法；而Canvas容器中則會通過動態(tài)畫圓的方法呈現(xiàn)出該二叉樹經(jīng)歷的這種遍歷過程，并且在Canvas容器的左上方輸出該二叉樹在經(jīng)過此種遍歷后所得到的遍歷序列。

3.技術(shù)難點與解決方案

實驗室的制作是數(shù)據(jù)結(jié)構(gòu)二叉樹多媒體課件的技術(shù)難點所在。本課件主要通過ActionScript3.0的算法設計來實現(xiàn)這個功能。

首先，設計“init函數(shù)”“PreOrderPosi函數(shù)”“getNodes函數(shù)”和“getHeight函數(shù)”等一系列函數(shù)，設計這些函數(shù)的目的都是分析學習者所輸入的內(nèi)容。

①init函數(shù)：判斷其輸入的內(nèi)容是否符合根結(jié)點不為空的要求，若滿足，則通過棧從這些輸入的內(nèi)容中分析出所有的二叉樹結(jié)點及其左右孩子結(jié)點，最后返回樹的根結(jié)點。

public static function init（input：String）：BTNode{

// 根據(jù)用戶輸入，動態(tài)地構(gòu)造一棵二叉樹

}

②PreOrderPosi函數(shù)：判斷根結(jié)點是否不為空，若滿足，則通過棧和函數(shù)的遞歸調(diào)用將其所有二叉樹結(jié)點按順序存儲的方式進行編號，并存儲在一個一維數(shù)組里返回。

public static function PreOrderPosi（root：BTNode）：void{

// 確定二叉樹先序遍歷的結(jié)點的序號

}

③getNodes函數(shù)和getHeight函數(shù)：若根結(jié)點不為空，則通過函數(shù)的遞歸調(diào)用返回二叉樹的結(jié)點總數(shù)和二叉樹的層數(shù)。

接著，設計“PreOrder函數(shù)”“InOrder函數(shù)”“PostOrder函數(shù)”和“LevelOrder函數(shù)”等一系列函數(shù)，設計這些函數(shù)的目的是指導計算機完成二叉樹的先序、中序、后序和層次遍歷，然后將各種遍歷的過程和結(jié)果呈現(xiàn)在課件界面上。圖3為數(shù)據(jù)結(jié)構(gòu)二叉樹多媒體課件的實驗室技術(shù)實現(xiàn)圖。

● 結(jié)語

目前，基于Flex技術(shù)的多媒體教學課件還比較少，但隨著RIA技術(shù)的日益完善，課件制作者水平的提高，RIA多媒體教學課件必定會迅猛發(fā)展。

參考文獻：

[1]熊冬春.高校網(wǎng)絡學習平臺建設的新視角[J].教育評論，2010（2）.

[2]王知方.RIA技術(shù)在WebGIS構(gòu)建中的應用[D].西安：長安大學，2010.

[3]廖思云.淺析豐富互聯(lián)網(wǎng)應用程序（RIA）的發(fā)展歷史與應用趨勢[J].信息與電腦：理論版，2010（4）.

[4]張曉蓉.基于RIA技術(shù)的石油企業(yè)信息化平臺的構(gòu)建[J].西安文理學院學報：自然科學版，2011（1）.

[5]趙志靖，周靜.基于Flash和數(shù)據(jù)庫技術(shù)構(gòu)建網(wǎng)絡課程的測驗模塊[J].中國教育信息化，2009（4）.

[6]宋朝暉.基于RIA技術(shù)的高校精品課程網(wǎng)站的研究與設計[D].青島：中國海洋大學，2010.

作者簡介：謝運佳，男，講師，碩士，中共黨員，湖南郴州人，主要研究方向為教育信息化、軟件系統(tǒng)架構(gòu)、推薦系統(tǒng)等；趙劍冬，男，副教授，博士，軟件工程師，中共黨員，廣東湛江人，主要研究方向為信息系統(tǒng)規(guī)劃設計、技術(shù)創(chuàng)新與管理、教育信息化。

基金項目：廣東省教育廳特色創(chuàng)新項目“智慧校園建設規(guī)劃與頂層設計”，項目編號2014WTSCX078；廣東省科技計劃項目“產(chǎn)學研協(xié)同建設面向區(qū)域產(chǎn)業(yè)的新型研發(fā)體系”，項目編號2015A080804018。