(天津中德職業(yè)技術(shù)學(xué)院，天津 300350)

在高職教學(xué)中，程序設(shè)計課程具有邏輯性強(qiáng)，抽象等特點，很難能引發(fā)學(xué)生的學(xué)習(xí)興趣。程序設(shè)計課程傳統(tǒng)的教學(xué)模式分章節(jié)教學(xué)，學(xué)生往往學(xué)習(xí)到課程結(jié)束，理論知識學(xué)習(xí)了不少，但遠(yuǎn)離應(yīng)用。學(xué)生對于開發(fā)實用的程序無從下手。為了使學(xué)生回歸課堂的主體，用最快的時間讓學(xué)生獲得成就感，激發(fā)學(xué)生的學(xué)習(xí)興趣和愿望，采取了復(fù)線型分組式任務(wù)教學(xué)法，即“三T”教學(xué)法。本文通過C語言“連連看”游戲設(shè)計的實際案例來加以說明。

一、“三T”教學(xué)法的理論基礎(chǔ)

任務(wù)教學(xué)法(Task-based Teaching, TBT)是建立在建構(gòu)主義教學(xué)理論基礎(chǔ)上的教學(xué)方法。建構(gòu)主義認(rèn)為，認(rèn)識是一種以主體已有的知識和經(jīng)驗為基礎(chǔ)的主動建構(gòu)，認(rèn)知過程包括注意、感知、記憶、思維和問題解決等方面。任務(wù)教學(xué)法是以學(xué)生為主體，關(guān)注學(xué)生心理認(rèn)知過程，并以主體已有的知識和經(jīng)驗為基礎(chǔ)，對新知識主動建構(gòu)的過程。任務(wù)教學(xué)法以明確的任務(wù)作為課堂主要教學(xué)目標(biāo)，在實踐任務(wù)過程中，培養(yǎng)學(xué)生自我分析、解決、總結(jié)問題的能力。

分組式教學(xué)法(Teaching in Groups, TIG)是指教師在授課時，按一定的規(guī)律，將全班分成若干個學(xué)習(xí)小組，以小組為單位進(jìn)行循環(huán)教學(xué)的教學(xué)方法。這種教學(xué)方法通過形式多樣的分享活動，充分調(diào)動學(xué)生的學(xué)習(xí)積極性，讓學(xué)生做學(xué)習(xí)的主人，使學(xué)生得到全面發(fā)展，有效解決現(xiàn)有教學(xué)資源不足的問題。

復(fù)線型教學(xué)法(Teaching in Multi-track, TMT)是采用以任務(wù)內(nèi)容為主線，以傳統(tǒng)教材按章節(jié)劃分的理論知識為輔線，齊頭并講的教學(xué)方法。

本文將TBT、TIG和TMT三種教學(xué)法結(jié)合在一起，形成全新的“三T”教學(xué)方法，“三T”教學(xué)方法的全稱叫做復(fù)線型分組式任務(wù)教學(xué)法。

二、“三T”教學(xué)法在“連連看”游戲設(shè)計中的應(yīng)用

1.課程總體設(shè)計

教學(xué)圍繞培養(yǎng)學(xué)生用程序設(shè)計語言解決實際問題的能力。通過“連連看”一個學(xué)生熟悉的案例引入，案例分析，讓學(xué)生逐個步驟了解連連看游戲的開發(fā)過程，再逐步分解任務(wù)。幫助學(xué)生形成應(yīng)用程序設(shè)計的思路和方法，幫助學(xué)生學(xué)會查看幫助手冊，使用相關(guān)資料。從而達(dá)到提高學(xué)生程序設(shè)計的綜合能力，增加信心和興趣。學(xué)生以小組為單位完成系統(tǒng)設(shè)計，通過小組內(nèi)討論，分工，培養(yǎng)每個學(xué)生的團(tuán)隊合作能力和團(tuán)隊榮譽(yù)感。

2.教學(xué)條件

硬件環(huán)境：臺式電腦，白板。

軟件環(huán)境：window xp操作系統(tǒng)

教師提供：VC6.0集成開發(fā)環(huán)境，開發(fā)幫助文檔，相關(guān)源代碼。

對軟硬件環(huán)境幾乎沒有要求，只要帶著U盤，有電腦的地方都可以進(jìn)行開發(fā)。

3.教學(xué)方式及考核方式

教學(xué)方式采用統(tǒng)一講解理論和分組實訓(xùn)相結(jié)合：統(tǒng)一講解理論知識。實訓(xùn)時四個人一組，其中一名項目組長，一名技術(shù)總監(jiān)。項目組長負(fù)責(zé)項目人員分工協(xié)調(diào)，技術(shù)總監(jiān)負(fù)責(zé)系統(tǒng)集成和攻克技術(shù)難關(guān)。每名組員由項目組長分配具體工作模塊。

考核方式為項目組長和技術(shù)總監(jiān)對每個成員進(jìn)行項目過程考核。成員對項目組長和技術(shù)總監(jiān)進(jìn)行過程考核。

4.教學(xué)內(nèi)容及步驟

(1)“連連看”項目導(dǎo)入

課程通過案例的方式導(dǎo)入：“在一次游戲設(shè)計實訓(xùn)課上，有個學(xué)生沒有做老師給她布置得任務(wù)，在玩一個叫“連連看”的游戲，老師看到后沒有立即制止，和她說我們學(xué)習(xí)的知識可以做這個游戲，要不要嘗試？后來她通過努力完成了這個游戲的設(shè)計，她很激動，開始主動嘗試新的挑戰(zhàn)?！?/p>

案例導(dǎo)入結(jié)束后，設(shè)計兩個問題讓學(xué)生展開思考，問題有針對性。問題一：這個游戲是如何操作的？問題二：游戲中你看到了什么？

通過兩個問題讓學(xué)生了解了游戲的操作流程，看到了直觀的圖片，表格，鼠標(biāo)點擊后等具體要解決的問題。

(2)“連連看”任務(wù)分解

教學(xué)任務(wù)過程設(shè)計七個子任務(wù)：

項目背景介紹，確定系統(tǒng)邊界；

復(fù)線型教學(xué)法講解任務(wù)所需理論知識，板書講解；

連連看游戲的系統(tǒng)分析，功能模塊的劃分；

整理收集開發(fā)素材(教師提供，小組收集)；

實現(xiàn)游戲布局；

實現(xiàn)鼠標(biāo)消息處理；

圖1 板書樣式

系統(tǒng)集成測試。

其中前四個子任務(wù)是教師帶領(lǐng)學(xué)生完成的，通過前四個子任務(wù)系統(tǒng)設(shè)計有思路了，開發(fā)所需的原材料，參考資料齊全了，后三個子任務(wù)由學(xué)生自主完成。

子任務(wù)單1、項目背景介紹，明確系統(tǒng)邊界

“連連看”游戲是一個非常流行的桌面小游戲，有多種版本的“連連看”。我們這次課程要開發(fā)的任務(wù)是一個最基礎(chǔ)的版本。

設(shè)計要求：給定一個10×10的圖片的矩陣，鼠標(biāo)連續(xù)兩次左鍵點擊后判斷，如果兩個圖片相同，且位置不同時，消除這兩個圖片。圖片全部消除后游戲結(jié)束。

子任務(wù)單2、復(fù)線型教學(xué)法講解任務(wù)所需理論知識

VC開發(fā)環(huán)境的搭建。

講解程序設(shè)計的整體框架，如圖1所示。

講解本次設(shè)計使用到的知識點。

子任務(wù)單3、連連看游戲的系統(tǒng)分析，功能模塊的劃分。

系統(tǒng)分析：

數(shù)據(jù)定義：定義10×10二維數(shù)組用于記錄每個位置圖片編號，規(guī)定1-20為圖片編號，0為已消除圖片編號。

布局設(shè)計：圖形相關(guān)函數(shù)的使用，圖片的收集。

游戲操作：鼠標(biāo)點擊消息處理，相同圖片判斷，記錄消除圖片數(shù)量。

游戲結(jié)束判斷：設(shè)置達(dá)到消除圖片數(shù)量值為50。

功能模塊劃分，接口函數(shù)如下：

init()初始化數(shù)據(jù)布局。

mouse_hit()游戲操作。

judge_user()用戶定義游戲結(jié)束條件。

ok()顯示成功。

子任務(wù)單4：整理收集開發(fā)素材。

布局所需素材，如表1所示：

表1 布局相關(guān)函數(shù)

鼠標(biāo)操作所需素材，如表2所示：

表2 鼠標(biāo)相關(guān)函數(shù)

參考鼠標(biāo)操作模板：

MOUSEMSG m;//定義鼠標(biāo)消息

while(true)

{

//獲取一條鼠標(biāo)消息

m=GetMouseMsg();

witch(m.uMsg)

{

case WM_LBUTTONDOWN://左鍵按下

break;

}

}

如何判斷圖片相同？

算法思想提示：

由鼠標(biāo)的當(dāng)前位置為(m.x,m.y)，每個圖片大小48×48，內(nèi)邊框?qū)?，圖片區(qū)域大小為50×50，所以通過image[m.x/50][m.y/50]讀取當(dāng)前圖片的編號。同理鼠標(biāo)第二次點擊后判斷，下標(biāo)與第一次點擊時不同，且圖片編號與第一次點擊時的相同時，執(zhí)行消圖操作。

子任務(wù)單5：實現(xiàn)游戲布局。

背景可設(shè)計成一個495*495的方形區(qū)域(48*10+9+3*2=495)

邊框與背景邊框距離1，邊框線寬2，內(nèi)部線寬1。圖片內(nèi)方框大小48*48，每個圖片占面積50*50。運行效果如圖2所示。

圖2 布局效果

繪制邊框的參考代碼：

initgraph(495, 495);

setbkcolor(RGB(255,220,255));//背景色

cleardevice(); //清屏幕

setlinestyle(PS_SOLID, NULL, 2);

setfillstyle(RGB(255,232,222));

//***************表格的繪制******************

line(2,2,493,2);//上邊界

line(2,2,2,493);//左邊界

line(2,493,493,493);//下邊界

line(493,2,493,493);//右邊界

圖片的加載參考代碼：

IMAGE img[50]; //定義圖片對象數(shù)組

getimage(&img[0], "D:\image\0.jpg"); //獲取D:image