《App-Inventor移動終端應(yīng)用開發(fā)》教學(xué)課件10計步器

模塊10計步器10.1項目描述10.2項目組件設(shè)計10.3項目邏輯設(shè)計10.4項目測試10.1項目描述計步器可以實現(xiàn)計步功能，同時根據(jù)運(yùn)動距離計算熱量的消耗，其運(yùn)行效果如圖10-1所示。圖10-1計步器的運(yùn)行效果10.2項目組件設(shè)計10.2.1準(zhǔn)備素材本項目用到的2個圖片素材如圖10-2所示，其中，icon.png用作應(yīng)用圖標(biāo)，finished.png用作運(yùn)動達(dá)標(biāo)時的顯示圖片。icon.pngfinished.png圖10-2計步器所需的圖片素材10.2項目組件設(shè)計10.2.2設(shè)計界面登錄開發(fā)平臺，新建一個項目，項目名稱為Pedometer。在設(shè)計視窗中，將項目素材上傳到開發(fā)平臺。本項目用到的組件包括用戶界面組件中的標(biāo)簽、圖像和滑動條，界面布局中的水平布局、表格布局和垂直布局，傳感器中的計步傳感器，以及數(shù)據(jù)存儲中的微數(shù)據(jù)庫。計步器的組件列表如圖10-3所示。說明：將這些組件從組件面板添加到工作面板中，并按照教材中計步器組件屬性進(jìn)行設(shè)置，對于教材中沒有說明的組件屬性均采用默認(rèn)屬性值。計步器工作面板的設(shè)計效果如圖10-4所示。10.2項目組件設(shè)計10.2.2設(shè)計界面圖10-3計步器的組件列表圖10-4計步器工作面板的設(shè)計效果10.3項目邏輯設(shè)計圖10-5計步器的項目設(shè)計流程計步器的項目設(shè)計流程如圖10-5所示。10.3項目邏輯設(shè)計10.3.1編程模塊在項目設(shè)計界面中單擊“邏輯設(shè)計”按鈕，切換到編程視窗。本項目用到的編程模塊有內(nèi)置塊中的數(shù)學(xué)、變量、控制、邏輯、文本和各組件的事件處理模塊、調(diào)用過程模塊、屬性設(shè)置及取值模塊，部分編程模塊見教材。10.3項目邏輯設(shè)計10.3.2功能實現(xiàn)1.初始化變量本項目定義了5個全局變量，如圖10-6所示。其中，“體重”用來記錄用戶設(shè)定的體重值，“目標(biāo)步數(shù)”用來記錄用戶設(shè)定的行走目標(biāo)，“今日步數(shù)”用來記錄用戶當(dāng)前行走的步數(shù)，“歷史記錄”用來顯示用戶行走步數(shù)的最高記錄，“運(yùn)動時長”用來記錄用戶當(dāng)前行走的分鐘數(shù)。圖10-6計步器定義的全局變量10.3項目邏輯設(shè)計10.3.2功能實現(xiàn)2.更新運(yùn)動數(shù)據(jù)在計步傳感器Pedometer組件的屬性模塊中有“連續(xù)行走”“距離”和“耗時”三個屬性模塊，這三個屬性分別對應(yīng)計步傳感器記錄的行走步數(shù)、行走距離和行走耗時，根據(jù)這些屬性和用戶設(shè)定的參數(shù)值，可以設(shè)置界面中的當(dāng)前行走步數(shù)、當(dāng)前行走所消耗的熱量、行走距離和運(yùn)動時長。定義“更新運(yùn)動數(shù)據(jù)”過程的代碼模塊如圖10-7所示。提示：利用Pedometer組件屬性設(shè)置并顯示運(yùn)動數(shù)據(jù)，在各組件的事件處理中，當(dāng)需要更新運(yùn)動數(shù)據(jù)時，都可以調(diào)用該過程。10.3項目邏輯設(shè)計10.3.2功能實現(xiàn)圖10-7定義“更新運(yùn)動數(shù)據(jù)”過程的代碼模塊10.3項目邏輯設(shè)計10.3.2功能實現(xiàn)3.更新歷史記錄當(dāng)計步傳感器的行走步數(shù)大于最高記錄時，調(diào)用圖10-8所示的“更新歷史記錄”過程，就可以完成歷史記錄值的更新。圖10-8定義“更新歷史記錄”過程的代碼模塊10.3項目邏輯設(shè)計10.3.2功能實現(xiàn)4.更新完成度為了能夠更直觀地顯示出當(dāng)前行走步數(shù)距離設(shè)定目標(biāo)值的完成進(jìn)度，定義“更新完成度”過程（見圖10-9），通過標(biāo)簽的寬度百分比來顯示當(dāng)前完成進(jìn)度。圖10-9定義“更新完成度”過程的代碼模塊10.3項目邏輯設(shè)計10.3.2功能實現(xiàn)5.設(shè)定體重和目標(biāo)步數(shù)拖動滑動條滑塊就可以完成體重和目標(biāo)步數(shù)的設(shè)定，這時會觸發(fā)滑動條的位置被改變事件。設(shè)定體重的代碼模塊如圖10-10所示，由于體重與運(yùn)動消耗熱量有關(guān)，因此在完成體重設(shè)置后，還需調(diào)用“更新運(yùn)動數(shù)據(jù)”過程，實現(xiàn)熱量值的更新。設(shè)定目標(biāo)步數(shù)的代碼模塊如圖10-11所示，當(dāng)目標(biāo)步數(shù)改變時，當(dāng)前行走的完成進(jìn)度也會隨之改變，這時調(diào)用“更新完成度”過程，就可以實現(xiàn)完成進(jìn)度的更新。10.3項目邏輯設(shè)計10.3.2功能實現(xiàn)圖10-10設(shè)定體重的代碼模塊圖10-11設(shè)定目標(biāo)步數(shù)的代碼模塊10.3項目邏輯設(shè)計10.3.2功能實現(xiàn)6.初始化屏幕每次打開應(yīng)用都會觸發(fā)屏幕初始化事件，通過微數(shù)據(jù)庫的不同標(biāo)簽可以獲取相應(yīng)的體重、目標(biāo)步數(shù)和歷史記錄值；通過調(diào)用“更新運(yùn)動數(shù)據(jù)”和“更新完成度”過程，可以將上一次退出應(yīng)用前的相關(guān)數(shù)據(jù)顯示在界面中。初始化屏幕的代碼模塊如圖10-12所示。圖10-12初始化屏幕的代碼模塊10.3項目邏輯設(shè)計10.3.2功能實現(xiàn)7.計步傳感器事件處理當(dāng)用戶拿著手機(jī)行走時，計步傳感器會檢測到行走事件，其“連續(xù)行走”“距離”和“耗時”的屬性值都會隨著行走而改變，在計步傳感器相應(yīng)的事件處理模塊中調(diào)用“更新運(yùn)動數(shù)據(jù)”“更新完成度”和“更新歷史記錄”過程，可以將用戶當(dāng)前的運(yùn)動狀態(tài)實時顯示在手機(jī)屏幕上。計步傳感器事件處理的代碼模塊如圖10-13所示。圖10-13計步傳感器事件處理的代碼模塊10.3項目邏輯設(shè)計10.3.2功能實現(xiàn)8.保存數(shù)據(jù)保存計步器數(shù)據(jù)的代碼模塊如圖10-14所示。在退出應(yīng)用前，調(diào)用計步傳感器的保存過程，可以將計步傳感器的當(dāng)前狀態(tài)保存在手機(jī)中，用戶當(dāng)前的行走步數(shù)、行走距離等運(yùn)動數(shù)據(jù)也可以被保存下來。提示：再次打開應(yīng)用時，就能夠基于之前的行走記錄繼續(xù)計步了。圖10-14保存計步器數(shù)據(jù)的代碼模塊10.3項目邏輯設(shè)計10.3.2功能實現(xiàn)9.重新計步在計步傳感器運(yùn)行過程中，當(dāng)完成目標(biāo)步數(shù)時會顯示“重新計步”按鈕，單擊該按鈕可以重新開始計步。計步傳感器的復(fù)位過程可以將計步傳感器的狀態(tài)清零，調(diào)用該過程就能夠重新開始計步，具體代碼模塊如圖1