基于可視化圖形編程的C語言引導(dǎo)性教學(xué)項(xiàng)目設(shè)計(jì)

摘要：針對(duì)大學(xué)生初學(xué)C語言課程容易出現(xiàn)的枯燥、缺乏興趣的問題，本文通過結(jié)合C語言語法和EasyX圖形庫函數(shù)，設(shè)計(jì)了兩個(gè)圖形可視化編程的引導(dǎo)性游戲項(xiàng)目。結(jié)合課程教學(xué)過程，將項(xiàng)目內(nèi)容分解為配合教學(xué)進(jìn)度的小題，逐步完成整個(gè)項(xiàng)目內(nèi)容。從而通過趣味項(xiàng)目引導(dǎo)學(xué)生自主學(xué)習(xí)和分析，提升學(xué)生的編程能力和解決問題的能力。

關(guān)鍵字：C語言；EasyX圖形庫；圖形化編程；引導(dǎo)性教學(xué)

一、引言

程序設(shè)計(jì)能力是應(yīng)用型本科電子類專業(yè)學(xué)生的一項(xiàng)重要能力，尤其在新一輪智能技術(shù)革命的影響下，程序設(shè)計(jì)能力的重要性顯得更加突出[1]。而C語言程序設(shè)計(jì)課程通常開設(shè)在電子類專業(yè)的大一學(xué)年，是大部分學(xué)生首次接觸到程序設(shè)計(jì)的課程。因此C語言作為程序設(shè)計(jì)能力的基礎(chǔ)，對(duì)學(xué)生后續(xù)掌握單片機(jī)、嵌入式、Java程序設(shè)計(jì)、Python等課程知識(shí)的影響十分重要。

然而不少學(xué)生在學(xué)習(xí)C語言的過程中，普遍反映對(duì)C語言不感興趣或感到枯燥。這也表明部分學(xué)生在C語言的學(xué)習(xí)上存在困難和缺乏興趣引導(dǎo)[2]。為了在新工科建設(shè)的理念下，培養(yǎng)具有創(chuàng)新思維、解決問題能力和自學(xué)能力的新一代電子信息類新工科人才，以問題為導(dǎo)向的教學(xué)方式逐漸受到重視[3]。本文將以C語言為基礎(chǔ)，結(jié)合EasyX圖形庫，設(shè)計(jì)兩個(gè)可視化編程的趣味游戲項(xiàng)目。并將項(xiàng)目設(shè)計(jì)內(nèi)容逐步分解為多個(gè)小題目，隨著課程教學(xué)內(nèi)容的進(jìn)行同步發(fā)布給學(xué)生。學(xué)生可以根據(jù)當(dāng)前所學(xué)內(nèi)容逐步完成游戲項(xiàng)目，直到課程結(jié)束時(shí)最終完成整個(gè)項(xiàng)目。讓項(xiàng)目貫穿在教學(xué)過程中，引導(dǎo)學(xué)生自主學(xué)習(xí)，自主分析，從而提升學(xué)生的編程能力和解決問題的能力[4]。

二、EasyX圖形庫

EasyX 圖形庫是一款免費(fèi)繪圖庫[5]，其設(shè)計(jì)目的雖然針對(duì)C++，但也可以應(yīng)用在C語言編程教學(xué)中[6]。只需要在C語言編譯環(huán)境中安裝easyX插件就可以簡單實(shí)現(xiàn)圖形的繪制及可視化。因此本文通過EasyX圖形庫實(shí)現(xiàn)C語言編程的可視化，可以加深學(xué)生對(duì)編程的直觀印象。然后通過EasyX圖形庫設(shè)計(jì)趣味游戲項(xiàng)目，學(xué)生完成項(xiàng)目后可以得到直接的反饋，形成較強(qiáng)的滿足感和成就感，可以進(jìn)一步提升學(xué)生的學(xué)習(xí)興趣。

本文設(shè)計(jì)的兩個(gè)趣味游戲項(xiàng)目需要用到的EasyX函數(shù)較為簡單，涉及的內(nèi)容主要有：窗口建立，直線、矩形和圓形的繪制，鼠標(biāo)鍵盤的輸入，屏幕內(nèi)容清空等功能。相關(guān)的函數(shù)及說明如表1所示。

三、案例1—圖形化五子棋游戲編程

本項(xiàng)目內(nèi)容是實(shí)現(xiàn)一個(gè)五子棋游戲界面，可以響應(yīng)鼠標(biāo)點(diǎn)擊事件，并在點(diǎn)擊位置為止放置黑白棋子。最后能根據(jù)五子棋的勝負(fù)規(guī)則，程序自動(dòng)判斷勝負(fù)并給出提示。游戲界面如圖1所示。該項(xiàng)目涉及的C語言知識(shí)包括了變量聲明、循環(huán)、函數(shù)設(shè)計(jì)、二維數(shù)組操作、文件操作等。學(xué)生根據(jù)設(shè)計(jì)功能要求逐步完成各項(xiàng)模塊代碼，最終完成五子棋游戲程序的設(shè)計(jì)。該項(xiàng)目根據(jù)教學(xué)進(jìn)度可分解為五個(gè)小題，分別為：

（一）五子棋游戲項(xiàng)目第一題—棋盤的顯示

該小題需要使用循環(huán)的語法，可在循環(huán)課程結(jié)束后進(jìn)行。要求生成600×600的窗口，使用矩形填充棋盤背景色為0x55AAAA。然后使用循環(huán)繪制15條間距為40，長度為14×40的橫線。同理使用循環(huán)繪制15條豎線。即可以顯示一個(gè)棋盤。該小題訓(xùn)練學(xué)生對(duì)循環(huán)的使用，并通過可視化的方式顯示出來。循環(huán)過程中的數(shù)值出現(xiàn)錯(cuò)誤很容易在圖形界面中體現(xiàn)出來，學(xué)生可以得到直觀的反饋并進(jìn)行改進(jìn)，從而提高學(xué)生對(duì)循環(huán)的掌握和使用能力。

（二）五子棋游戲項(xiàng)目第二題—棋子的顯示

該小題需要使用函數(shù)和數(shù)組語法，可在函數(shù)和數(shù)組結(jié)束后進(jìn)行。要求設(shè)置一個(gè)全局變量二維數(shù)組char CHESS[15][15]，用于保存棋盤上15×15個(gè)位置的棋子信息。使用嵌套循環(huán)遍歷二維數(shù)組的所有元素，根據(jù)數(shù)組元素值，在棋盤對(duì)應(yīng)的位置上繪制填充顏色為黑色或白色的圓形棋子，或不繪制棋子。最后編寫一個(gè)函數(shù)void reDraw（），將繪制棋盤和棋子的代碼打包到該函數(shù)中。該小題可訓(xùn)練學(xué)生對(duì)二維數(shù)組的操作，數(shù)組操作錯(cuò)誤則體現(xiàn)為棋子的顯示錯(cuò)誤，學(xué)生通過自行調(diào)試和糾錯(cuò)可以積累經(jīng)驗(yàn)，更深入理解數(shù)組的作用。

（三）五子棋游戲項(xiàng)目第三題—棋子的輸入

該小題需要使用函數(shù)和數(shù)組語法，可在函數(shù)和數(shù)組結(jié)束后進(jìn)行。要求在棋盤界面上用鼠標(biāo)左鍵點(diǎn)擊，可以在相應(yīng)的位置上放置棋子。使用while（1）循環(huán)獲取鼠標(biāo)點(diǎn)擊事件和坐標(biāo)，根據(jù)鼠標(biāo)點(diǎn)擊的坐標(biāo)，計(jì)算距離最近的棋盤交叉點(diǎn)的行列號(hào)，修改全局二維數(shù)組CHESS[15][15]對(duì)應(yīng)元素的值。然后調(diào)用reDraw（）重新繪制修改后的棋盤和棋子圖形，實(shí)現(xiàn)游戲動(dòng)態(tài)顯示。該題目主要訓(xùn)練學(xué)生對(duì)數(shù)組的操作和函數(shù)的調(diào)用，通過鼠標(biāo)坐標(biāo)計(jì)算二維數(shù)組的小標(biāo)，讓學(xué)生更深入理解二維數(shù)組的使用。該步驟通過調(diào)用reDraw（）函數(shù)繪圖，利用模塊化設(shè)計(jì)思路避免了程序代碼間的耦合，讓學(xué)生簡化程序設(shè)計(jì)思路，體現(xiàn)模塊化設(shè)計(jì)的優(yōu)勢(shì)。

（四）五子棋游戲項(xiàng)目第四題—?jiǎng)儇?fù)判斷

該小題需要使用函數(shù)和數(shù)組語法，可在函數(shù)和數(shù)組結(jié)束后進(jìn)行。要求每次落下棋子，都要進(jìn)行勝負(fù)判斷。以新下棋子的坐標(biāo)為中心，四個(gè)方向（橫向、豎向、斜下和斜上）上[-4，4]的范圍內(nèi)出現(xiàn)五個(gè)同色棋子連在一起，即該色棋子獲勝。判斷過程中要避免邊界問題，即二維數(shù)組的下標(biāo)越界問題。該小題的勝負(fù)判斷雖然依然只設(shè)計(jì)到二維數(shù)組操作，但作為本題目的主要步驟，是相對(duì)較難也較容易出錯(cuò)的一步，具有較高的挑戰(zhàn)性，卻更能激發(fā)學(xué)生的斗志和興趣。學(xué)生需要在二維數(shù)組中進(jìn)行四個(gè)方向上的元素?cái)?shù)值判斷，掌握二維數(shù)組和循環(huán)語法的靈活使用方法才能較好地完成該題。

（五）五子棋游戲項(xiàng)目第五題—游戲的保存

該小題需要使用文件操作語法，可在文件讀寫課程結(jié)束后進(jìn)行。要求將每次下棋的坐標(biāo)記錄下來，游戲結(jié)束后保存在txt文件里。并可讀取txt文件重現(xiàn)棋譜步驟。該小題利用C語言課程最后教授的文件操作，增加了五子棋游戲功能，可以激發(fā)學(xué)生的創(chuàng)新意識(shí)。學(xué)生可以自由發(fā)揮，對(duì)五子棋的各種功能進(jìn)行補(bǔ)充和改進(jìn)。

四、案例2—圖形化敲磚塊游戲編程

本項(xiàng)目是實(shí)現(xiàn)一個(gè)敲磚塊的游戲。游戲窗口上方顯示多排磚塊，有一個(gè)小球在窗口范圍內(nèi)反彈，小球敲到磚塊會(huì)讓磚塊消失。游戲窗口下方有個(gè)滑板，由兩個(gè)按鍵控制滑板的左右移動(dòng)，當(dāng)小球下落時(shí)，滑板要能及時(shí)接住小球，否則小球落入屏幕下方則游戲失敗。游戲界面如圖2所示。

該題目涉及的C語言知識(shí)同樣包括了變量聲明、循環(huán)、條件判斷、函數(shù)設(shè)計(jì)、二維數(shù)組、文件操作等。該項(xiàng)目根據(jù)教學(xué)進(jìn)度可分解為六個(gè)小題，分別為：

（一）敲磚塊游戲項(xiàng)目第一題—小球的移動(dòng)

該小題需要使用循環(huán)語法，可以在循環(huán)課程結(jié)束后進(jìn)行。要求利用循環(huán)和easyX圖形庫的編程知識(shí)，在界面中顯示一個(gè)移動(dòng)的小球。首先生成1000×600的窗口，使用矩形填充棋盤背景色為0x55AAAA。然后繪制一個(gè)半徑為20紅色小球，設(shè)置全局變量double ball_x， ball_y， ball_speed_x， ball_speed_y，分別表示小球的x，y坐標(biāo)和x，y軸上的速度。設(shè)置while（1）循環(huán)（使用Sleep（10）控制循環(huán)速度），每次循環(huán)令ball_x += ball_speed_x， ball_y + ball_speed_y，然后以新的坐標(biāo)重新繪制矩形底色和紅色小球。從而實(shí)現(xiàn)小球的動(dòng)態(tài)移動(dòng)顯示。該小題通過循環(huán)操作更新小球位置，最后動(dòng)態(tài)地顯示移動(dòng)的小球，通過可視化直觀地體現(xiàn)了循環(huán)操作的作用，讓學(xué)生有較強(qiáng)烈的印象，從而可以激發(fā)學(xué)生的學(xué)習(xí)興趣，為下一步的學(xué)習(xí)做好準(zhǔn)備。

（二）敲磚塊游戲項(xiàng)目第二題—滑板的移動(dòng)

該小題同樣只需要使用循環(huán)語法，可在循環(huán)課程結(jié)束后進(jìn)行。要求利用循環(huán)和easyX圖形庫的編程知識(shí)，在界面下方顯示一個(gè)可控制左右移動(dòng)的滑板。要求在游戲窗口的正下方繪制一個(gè)寬高為200×20的藍(lán)色矩形滑板。設(shè)置全局變量double board_x， board_y作為滑板左上角坐標(biāo)，在上一小題的while（1）循環(huán)中，每次循環(huán)內(nèi)都增加按鍵判斷，實(shí)現(xiàn)a和d按鍵減少或增加滑板的x坐標(biāo)。從而實(shí)現(xiàn)滑板的動(dòng)態(tài)移動(dòng)。該小題同樣利用循環(huán)來移動(dòng)游戲界面中的圖形，但可以通過按鍵交互來控制圖形的移動(dòng)方向和速度，進(jìn)一步提升了編程的趣味性。

（三）敲磚塊游戲項(xiàng)目第三題—小球的反彈

該小題需要使用函數(shù)語法，在函數(shù)課程結(jié)束后進(jìn)行。要求在界面中顯示一個(gè)能移動(dòng)和反彈的小球。在上述2個(gè)小題的基礎(chǔ)上，編寫update（）和reDraw（）函數(shù)，update（）用于計(jì)算小球和滑板的新坐標(biāo)，而reDraw（）則是清除原有繪制內(nèi)容，并按新坐標(biāo)繪制小球和滑板。在update（）函數(shù)中，每次計(jì)算小球的新坐標(biāo)后，都要判斷小球的坐標(biāo)ball_x， ball_y是否碰到邊界。然后修改速度ball_speed_x和ball_speed_y的方向。如果碰到滑板，則重新隨機(jī)生成往上方移動(dòng)的小球速度。該小題通過在循環(huán)中增加判斷語句，訓(xùn)練學(xué)生將循環(huán)和判斷語句聯(lián)合使用的能力，并通過可視化游戲界面體現(xiàn)出來。學(xué)生的判斷條件出錯(cuò)能在界面中體現(xiàn)出來，學(xué)生獲得直觀的反饋并加以糾正，可以加快學(xué)生的學(xué)習(xí)經(jīng)驗(yàn)積累。隨著代碼的增加，將位置更新和圖形繪制劃分為兩個(gè)模塊函數(shù)，可以訓(xùn)練學(xué)生梳理代碼和模塊劃分的能力。

（四）敲磚塊游戲項(xiàng)目第四題—多彩磚塊的顯示

該小題需要使用函數(shù)和數(shù)組語法，在函數(shù)課程和數(shù)組課程結(jié)束后進(jìn)行。要求在界面上方顯示5行20列的磚塊。設(shè)置類型為unsigned long的全局變量二維數(shù)組，用于保存5行20列的磚塊，每個(gè)元素用于保存對(duì)應(yīng)磚塊的顏色，如果該值為0，則表示沒有磚塊。并將二維數(shù)組里的值隨機(jī)設(shè)置為不同顏色。在reDraw（）函數(shù)里增加磚塊的顯示，每個(gè)磚塊的寬度應(yīng)為50，高度設(shè)置為30。該小題通過二維數(shù)組保存多彩磚塊的數(shù)據(jù)，要求學(xué)生學(xué)會(huì)二維數(shù)組的使用方法。其中磚塊的顯示涉及了循環(huán)遍歷二維數(shù)組，以及數(shù)值為0的空磚塊判斷，可以訓(xùn)練學(xué)生綜合運(yùn)用循環(huán)、條件判斷和數(shù)組操作。

（五）敲磚塊游戲項(xiàng)目第五題—磚塊的碰撞

該小題需要在函數(shù)課程和數(shù)組課程結(jié)束后進(jìn)行。要求實(shí)現(xiàn)小球和磚塊的碰撞計(jì)算，讓磚塊消失，并修改小球方向。設(shè)置一個(gè)函數(shù)int blockHited（double ball_x， double ball_y， double block_x， double block_y），用于檢測小球與一個(gè)磚塊是否發(fā)生碰撞，返回值為0表示沒有碰撞，非0值表示發(fā)生碰撞。碰撞的情況下要修改小球的速度方向。小球每移動(dòng)一次，就與所有的非0磚塊遍歷一遍。該小題雖然涉及的語法與前面小題一樣，但是相對(duì)有挑戰(zhàn)的內(nèi)容，小球需要與多個(gè)磚塊進(jìn)行碰撞檢測，需要涉及循環(huán)遍歷以及二維數(shù)組的更新（磚塊的消失）。小球與每個(gè)磚塊的碰撞及方向更新，則要考慮到碰撞的范圍，以及碰撞的位置是處于磚塊的上下左右方向，還是四個(gè)對(duì)角方向，并計(jì)算出合理的反彈方向。因此學(xué)生容易在該小題上出錯(cuò)，但通過界面直觀反饋錯(cuò)誤現(xiàn)象，可以吸引學(xué)生深入研究代碼的執(zhí)行過程，進(jìn)而強(qiáng)化學(xué)生的程序設(shè)計(jì)思維，提升編程能力。

（六）敲磚塊游戲項(xiàng)目第六題—游戲參數(shù)設(shè)置

需要使用到文件操作語法，可在文件讀寫課程結(jié)束后進(jìn)行。要求將一些重要參數(shù)保存到txt文件中，并在游戲開始時(shí)讀取txt文件中的參數(shù)，用于游戲的配置，例如游戲界面大小、磚塊數(shù)量、滑板尺寸、小球速度等。該小題利用文件操作功能擴(kuò)展敲磚塊游戲的配置功能，學(xué)生編譯出程序后，只需要簡單修改配置文件就能調(diào)整游戲的難度，可以讓學(xué)生體驗(yàn)軟件設(shè)計(jì)過程中參數(shù)配置過程。此外還可以增加開放性題目鼓勵(lì)學(xué)生開拓思維，發(fā)揮想象力，利用所學(xué)知識(shí)擴(kuò)展游戲的功能，激發(fā)學(xué)生的創(chuàng)新思維。

五、結(jié)束語

對(duì)于剛接觸程序設(shè)計(jì)的學(xué)生來說， C語言里的概念會(huì)有一定的抽象和難以理解，因此對(duì)C語言的學(xué)習(xí)提不起興趣。本文設(shè)計(jì)的可視化編程引導(dǎo)性游戲編程項(xiàng)目，可以通過游戲設(shè)計(jì)提高學(xué)生編程興趣。再以項(xiàng)目分解成小題的形式，一步一步引導(dǎo)學(xué)生完成整個(gè)項(xiàng)目，并貫穿整個(gè)C語言編程教學(xué)內(nèi)容。對(duì)提高學(xué)生的編程能力和解決問題的能力有較好的幫助作用。

作者單位：林偉銘 廈門理工學(xué)院 光電與通信工程學(xué)院

參? 考? 文? 獻(xiàn)

[1] 吳紫恒，王兵，李聰，等.人工智能背景下電子信息類新工科人才培養(yǎng)模式的研究[J].湖北工程學(xué)院學(xué)報(bào)，2021，41（03）：121-123.

[2] 柴西林，趙亞娟，趙艷，等. 應(yīng)用型本科電子信息類專業(yè)C語言教學(xué)現(xiàn)狀分析及對(duì)策研究[J]. 科技創(chuàng)新導(dǎo)報(bào)，2017（6）：193-194.

[3] 羅春婭，李丹，馬智超，等.以問題為導(dǎo)向的高效課堂的研究——以中美合作辦學(xué)的電子類專業(yè)基礎(chǔ)課為例[J].湖北第二師范學(xué)院學(xué)報(bào)，2020，37（02）：89-91.

[4] 丁鳳娟，洪騰蛟，陳豐，等.基于新工科與專業(yè)認(rèn)證背景下《C語言程序設(shè)計(jì)》教學(xué)改革與實(shí)踐[J].才智，2022（21）：84-87.

[5] 崔北元，李德川.基于EasyX的物體運(yùn)動(dòng)狀態(tài)模擬仿真系統(tǒng)分析拋體運(yùn)動(dòng)問題[J].教學(xué)考試，2021（49）：20-22.

[6] 尹蘭蘭，磨峰，熊水平.C語言課程中利用easyX進(jìn)行算法的可視化教學(xué)[J].軟件工程，2019，22（11）：51-55.

基金項(xiàng)目：2021年福建省本科高校教育教學(xué)改革研究項(xiàng)目“新工科背景下電子信息類人才軟件創(chuàng)新能力培養(yǎng)的探索與實(shí)踐”（項(xiàng)目編號(hào)：FBJG20210085）；2020年福建省本科高校教育教學(xué)改革研究項(xiàng)目“專創(chuàng)融合-虛實(shí)結(jié)合打造電子信息系統(tǒng)綜合設(shè)計(jì)課程群”（項(xiàng)目編號(hào)：FBJG20200119）。

林偉銘（1983-），男，漢族，福建漳州，博士，副教授，研究方向：模式識(shí)別與機(jī)器學(xué)習(xí)研究。