層層遞進引導學生建構項目式程序設計
——以App Inventor設計電子相冊為例

張遹東

(杭州師范大學東城實驗學校，杭州 310019)

1 App Inventor應用現狀

自20世紀50年代匯編語言誕生以來，程序設計語言的發(fā)展就伴隨著計算機硬件的發(fā)展而不斷提升和變化，目前已經誕生了幾百種高級語言。雖然程序設計的核心思想沒有變化，但方式已經拓展成為了可視化、模塊化、圖形化的編寫。目前，移動終端市場的操作系統(tǒng)主要為IOS和Android，而安卓系統(tǒng)憑借其開放性的優(yōu)勢已經占據了越來越多的市場份額。其中的App Inventor以其可視化、模塊化和簡便化等特征讓缺少編程經驗的青少年可以輕松進入安卓的編程世界。App Inventor在實現功能較為復雜的作品時，對于學生編程思維和編程能力的要求較高。因此，需在實際教學中嘗試把大型作品進行分解，把具體的代碼模塊學習融入到每個分項目中去，在保持作品完整性的同時降低學習難度，增加程序編寫的操作性和理解性。

2 App Inventor項目式作品開發(fā)的基本思路

教師利用App Inventor程序設計的便捷性和開放性來讓學生通過模仿、調試、分享、改進、創(chuàng)新、完善等步驟逐步設計作品，培養(yǎng)了學生學習程序設計的興趣和能力。一般程序設計的步驟主要包括分析問題、設計算法、編寫程序、運行程序、分析結果。教師可在學生學習App Inventor程序設計的過程中重點強調需求分析、界面設計、模塊連接、調試運行等步驟，對于程序語言編輯和算法思路的設計可以先不做過高要求，同時還要注意將語句學習融入到作品不斷升級完善的過程中去。

3 層層遞進引導學生建構項目式程序設計在App Inventor設計電子相冊中的應用

層層遞進引導學生建構項目式程序設計需要在教學實踐過程中提前設計好教學方案和詳細操作步驟，要根據不同的學習主題和內容進行靈活變動，以達到教學目標。

3.1 搭建基本框架，完成電子相冊初級版本

電子相冊的初級版本是點擊按鈕顯示一張與其所對應的照片，如果能夠在顯示照片的同時出現歡迎語，則整個界面會更加友好。根據這一思路，完成電子相冊App 1.0版本需要按鈕組件、圖像組件和標簽組件，并調用“當按鈕被點擊”與“顯示圖片”的代碼。在開始程序設計前，需要完成需求分析，并通過教師與學生的討論來完成相冊流程圖。流程圖是實現程序設計的基本依據，流程圖的質量直接決定了程序的質量，需要學生認真完成。完成流程圖之后，可以開始程序界面的設計，這時，可以讓學生發(fā)揮創(chuàng)意，設計出不同的相冊界面。完成組件的布局后，要分別設置其特有的屬性，可通過組件屬性面板并按照App的實際需求來進行設置與修改，如圖1所示。

圖1 電子相冊1.0組件屬性Fig.1 Attribute of electronic photo album 1.0 module

設置好組件的屬性后，進入邏輯設計環(huán)節(jié)。在電子相冊1.0版本中，主要是實現點擊按鈕顯示圖片這一功能。可單擊邏輯設計按鈕切換到程序設計視圖進行代碼編寫，邏輯代碼如圖2所示。

圖2 電子相冊1.0版本邏輯設計Fig.2 Logic design of electronic photo album 1.0 version

完成美麗校園App 1.0版本的設計后，可以在模擬器中完成調試和修改，有了這個基礎版本的電子相冊，學生可以在此基礎上不斷升級，讓電子相冊功能更強大，或者是設置獨具特色的相冊。

3.2 加入翻頁按鈕，讓電子相冊活動起來

通過點擊單個按鈕來顯示相應圖片雖然比較直觀，但如果圖片數量較多，則需要布置同樣數量的按鈕，這既不利于布局，又不利于代碼的學習和提高。因此，可以參考將圖片瀏覽軟件中的翻頁功能加入進來，以完成電子相冊2.0版本的制作。在開始設計之前，同樣需要繪制流程圖。由于2.0版本加入了翻頁功能，相應的界面頁發(fā)生了變動，組件屬性可以參考圖3。

圖3 電子相冊2.0組件屬性Fig.3 Attribute of electronic photo album 2.0 module

翻頁功能是相冊2.0版本的關鍵，可以引導學生通過理解頁碼加減來理解翻頁。要實現加減就需要引入全局變量、取變量值和合并文本等控件，具體的邏輯設計可以參考圖4。

圖4 電子相冊2.0版本邏輯設計Fig.4 Logic design electronic photo album 2.0 module

實現翻頁的邏輯代碼不止一種，可以提示學生嘗試用不同的代碼來實現，比如文本、列表等，關鍵是引入可以表示頁碼的代碼，實現頁碼的變換。隨后，可以在模擬器上完成調試和修改，加上了翻頁功能的電子相冊會變得更加完善。

3.3 添加自動瀏覽，完善電子相冊整體功能

增加了翻頁功能后，用戶可以通過點擊上下頁按鈕來瀏覽圖片，如果此時想要點擊按鈕來實現自動瀏覽圖片的功能，就要引入新的控件，這對于程序設計又提出了新的挑戰(zhàn)。要想實現自動瀏覽功能，就需要在界面設計中添加非可視組件計時器，利用計時器組件的自動計時功能來實現順序播放。要想實現自動瀏覽需要解決兩個問題，一是怎樣讓變量按照順序依次變換，二是當圖片播放到最后一張時怎么重頭開始播放。要實現這兩個要點并不困難，前者可以利用相冊2.0版本中的語句，只是現在需要將此語句連接到計時器中去，而后者則可以增加如果控件，讓程序運行到最后一張時執(zhí)行回到第一張的語句。

至此，電子相冊已經完成了三個不同的版本，后續(xù)還可以在前面的基礎上增加不同的功能，比如直接跳轉至某一頁的照片、添加背景音樂、展示多個圖片，等等。同樣的主題會隨著功能的不斷變換和完善而制作出不同的電子相冊，而要想實現不同的功能自然會運用到不同的控件和語句。隨著學習的不斷深入，學生在制作出功能各異的電子相冊的同時也增強了邏輯思維和編程能力。

4 App Inventor項目式教學的研究成效

由于計算機程序設計需要較強的邏輯思維能力、語言表達能力和英語理解能力，大學生在學習過程中尚存在較大難度，對中小學生而言更是難上加難，而且傳統(tǒng)的先講解理論再實踐操作的教學方法也無法取得較好的教學效果。但幸運的是，現在的編程軟件在不斷更新變化，給程序設計教學帶來了新的教學思路，能夠與層層遞進項目式教學模式相結合，使學生在學習程序設計時更具有操作性和探究性，能夠聯(lián)系生活實際，進而培養(yǎng)學生解決實際問題的能力。

4.1 以項目為主體畫出思維導圖，培養(yǎng)任務分解能力

學生在解決綜合性問題時，往往會手足無措，因此，教師要幫助學生提高任務分解的能力，把一個大項目分解成若干個小項目。以電子相冊為例，可利用思維導圖的形式嘗試把項目的完成步驟分解為流程圖、界面設計、組件設置、邏輯設計等幾大塊，然后再把大塊內容細化，如圖5所示。

圖5 任務分解圖Fig.5 Task decomposition

完成任務分解圖后，嘗試按照詳圖一步步完成每個分項目，然后將分項目組合起來，完成整個項目的制作。按照“整體-局部-整體”的完成思路，不僅可以提高學生完成項目的能力，而且可以讓學生思考整體和局部之間的關系，提高學生從全局考慮問題的能力。

4.2 以控件設計為載體，培養(yǎng)學生的編程能力

程序設計是通過特定計算機語言解決具體問題的過程。在進行程序設計的過程中有一個重要的環(huán)節(jié)，就是將問題通過算法的形式表述出來。在沒有可視化的控件作為設計載體之前，算法的理解和表達給學生的學習帶來了很大困難，而現在借助App Inventor的直觀設計環(huán)境，學生可以從簡單的程序開始，先不斷添加新的控件和功能，然后再通過理解控件之間的邏輯關系來逐步提高程序設計能力。同樣是實現圖片展示功能，方法是多種多樣的，比如直接設定語句，或先設置列表再選擇，或用隨機數來實現。

4.3 不斷完善和創(chuàng)新項目，培養(yǎng)學生的創(chuàng)新能力

從相冊1.0版本更新到相冊3.0版本的過程中涉及了不同的設計思路，應用了不同的控件和語句，使學生思考如何在同一主題的情況下實現不同的功能。在教師和學生、學生和學生的交流過程中，學生的創(chuàng)新能力得到了鍛煉。按照這樣的教學任務設計思路，還可以做出同一主題、不同設計思路的特色作品，比如畫圖板App、計算器App、找不同游戲App，等等，每一個App都可以按照從基礎功能到綜合功能的思路來進行制作，讓學生在不斷豐富完善App功能的過程中提升程序設計能力。

5 反思

程序設計的過程是先將現實中的問題用算法描述出來，然后再將算法轉為相關的程序設計語言，最后再通過計算機執(zhí)行相關語句來實現。利用可視化的軟件來編輯程序會更接近學生在生活中的思維方式。為了進一步降低編程的難度，引導學生完成程序設計，在實際教學中設計了層層遞進的項目式教學方法，并將其運用到了App Inventor程序設計的過程中，讓學生在學習的過程中能夠體會到編程所帶來的樂趣。但在教學過程中也暴露出了不少問題，比如怎樣更好地提升學生團隊合作的能力，怎樣將模塊化編輯和代碼編輯緊密聯(lián)系起來，怎樣提升學生對于程序設計的理解，等等。在后續(xù)的教學中，將繼續(xù)以層層遞進的項目式教學法為主線不斷更新和完善教學過程，增強各個項目的延續(xù)性，培養(yǎng)學生的邏輯思考能力。