馬曉萍

（喀什大學(xué) 計(jì)算機(jī)科學(xué)與技術(shù)學(xué)院，新疆喀什 844000）

0 引言

冒泡排序是一種典型的、穩(wěn)定排序算法[1]，對(duì)初次接觸程序語(yǔ)言的學(xué)習(xí)者來(lái)說(shuō)，排序算法比較抽象，對(duì)算法的理解存在較大的障礙。如何讓學(xué)生更好直觀的理解排序算法的原理并用程序語(yǔ)言實(shí)現(xiàn)，是一個(gè)值得研究的問(wèn)題。Unity3D 是一款實(shí)時(shí)3D 互動(dòng)內(nèi)容創(chuàng)作和運(yùn)營(yíng)平臺(tái)，所提供的可視化、實(shí)時(shí)三維動(dòng)畫(huà)等類型互動(dòng)內(nèi)容[2],具有強(qiáng)大的交互功能和豐富的三維表現(xiàn)。利用Unity3D 實(shí)現(xiàn)冒泡排序算法動(dòng)態(tài)可視化，是一種有效的算法可視化方式，可促進(jìn)學(xué)習(xí)者對(duì)冒泡排序算法的理解。

1 冒泡排序

1.1 冒泡排序原理

在程序設(shè)計(jì)語(yǔ)言的排序算法中，冒泡排序是一種平方級(jí)的原地排序算法[3]。冒泡排序算法的原理：在待排序的一組數(shù)中，將相鄰的兩個(gè)數(shù)值進(jìn)行比較，若前面的數(shù)值比后面的數(shù)值大就交換兩數(shù)，把小數(shù)值放在前面，否則不交換；直至最終完成從小到大的排序。[4]

1.2 C#語(yǔ)言實(shí)現(xiàn)

冒泡排序算法的程序描述（C#語(yǔ)言）如下：

上述代碼中，通過(guò)外層for循環(huán)，用數(shù)組的長(zhǎng)度控制整體程序的運(yùn)行次數(shù)，內(nèi)層for用于與前后兩位數(shù)比較大小，如果存在第一個(gè)數(shù)比第二個(gè)數(shù)大，則兩個(gè)數(shù)利用中間變量temp，實(shí)現(xiàn)交換的邏輯。

2 基于Unity3D 的冒泡排序算法可視化設(shè)計(jì)及實(shí)現(xiàn)

2.1 冒泡排序三維動(dòng)態(tài)可視化設(shè)計(jì)

在Unity 中設(shè)計(jì)由一個(gè)Panel 容器控件，一個(gè)Text 文本控件，兩個(gè)Button 按鈕控件組成的UI 界面。Text控件文本內(nèi)容為“冒泡排序法三維動(dòng)態(tài)可視化”，當(dāng)單擊“隨機(jī)生成數(shù)據(jù)”按鈕時(shí)，在Panel 容器控件上逐個(gè)動(dòng)態(tài)生成隨機(jī)數(shù)據(jù)柱狀圖效果，此案例中隨機(jī)生成9 個(gè)1～100 的整數(shù)，并產(chǎn)生以該整數(shù)作為動(dòng)態(tài)柱狀圖的高度。當(dāng)單擊“開(kāi)始冒泡排序”按鈕時(shí)，在Panel 容器控件上，開(kāi)始進(jìn)行柱狀圖動(dòng)態(tài)數(shù)據(jù)的交換，準(zhǔn)備比較的兩個(gè)柱狀圖變成綠色，等待排序比較，進(jìn)行完一輪比較后所產(chǎn)生的最大數(shù)柱狀圖變成紅色。

2.2 實(shí)現(xiàn)隨機(jī)生成數(shù)據(jù)及動(dòng)態(tài)生成效果

2.2.1 隨機(jī)排序數(shù)據(jù)類的設(shè)計(jì)

（1）設(shè)計(jì)一個(gè)RandomData 類用于生成隨機(jī)數(shù)。如圖1所示。

圖1 RandomData類圖

部分代碼如下：

（2）利用協(xié)程機(jī)制動(dòng)態(tài)生成柱狀圖的接口設(shè)計(jì).

該接口中，go.GetComponent＜Transform＞().position 語(yǔ)句表示動(dòng)態(tài)生成柱狀圖的位置，t.Get-Component＜Transform＞().position 語(yǔ)句表示隨機(jī)產(chǎn)生數(shù)據(jù)的文本顯示在當(dāng)前柱狀圖y 軸上方v.y+0.5位置。通過(guò)測(cè)試，Unity中無(wú)法直接調(diào)用接口，為了實(shí)現(xiàn)接口InitBarGraph()和接口Sort()的功能，本案例中編寫(xiě)了兩個(gè)方法，使用StartCall()方法分別調(diào)用接口。調(diào)用接口InitBarGraph()參考代碼如下：

動(dòng)態(tài)生成隨機(jī)柱狀圖效果圖如下圖2所示。

圖2 隨機(jī)柱狀圖

2.2.2 冒泡排序類的設(shè)計(jì)

（1）冒泡排序及柱狀圖顏色變化的接口設(shè)計(jì)。

該接口主要實(shí)現(xiàn)設(shè)置準(zhǔn)備比較的兩個(gè)柱狀圖顏色、待排數(shù)的柱狀圖顏色，最大數(shù)的柱狀圖顏色，以及進(jìn)行柱狀圖動(dòng)態(tài)數(shù)據(jù)的交換的冒泡排序功能，程序流程圖如圖3所示。

圖3 可視化冒泡排序流程圖

部分代碼如下：

（2）柱狀圖的位置和高度的方法。

該方法用以實(shí)現(xiàn)柱狀圖、柱狀圖上隨機(jī)數(shù)數(shù)字的位置和高度的設(shè)置，使得數(shù)據(jù)始終顯示在柱狀圖正上方的功能。

部分代碼如下：

（3）實(shí)現(xiàn)第一輪冒泡排序的效果圖如圖4 所示。

圖4 第一輪冒泡排序效果圖

3 結(jié)語(yǔ)

本文利用Unity3D 平臺(tái)，以“C#程序設(shè)計(jì)”課程中的冒泡排序?yàn)榘咐?，利用協(xié)程動(dòng)態(tài)生成隨機(jī)數(shù)據(jù)柱狀圖，并以三維動(dòng)態(tài)可視化實(shí)現(xiàn)C#腳本語(yǔ)言的冒泡排序算法，直觀動(dòng)態(tài)地展示了冒泡排序算法的基本思想和排序過(guò)程。實(shí)驗(yàn)證明，動(dòng)態(tài)可視化的課程設(shè)計(jì)，既通過(guò)Unity3D 創(chuàng)建三維動(dòng)態(tài)互動(dòng)內(nèi)容提高了學(xué)習(xí)者的學(xué)習(xí)興趣，又加深了學(xué)習(xí)者對(duì)冒泡排序算法原理的理解性，達(dá)到了良好的教學(xué)效果。