行動商務與多媒體應用學系 詹啟祥 辦公室：HB35室 分機：20035 E-mail: CSChan@asia.edu.tw App Inventor 2 上課大綱 行動商務與多媒體應用學系 詹啟祥 辦公室：HB35室 分機：20035 E-mail: CSChan@asia.edu.tw
課程概要 第一章、瞭解AI2環境 - 介面設計與程式拼塊 第七章、清單 - Label元件以及Button 元件 - 介紹清單管理 第二章、介面配置元件 - 介紹介面配置元件 - TextBox元件 第三章、常數與變數 - 介紹常數與變數(數值、字串與變數) - Image 元件 第四章、算術與字串運算 - 介紹算術與字串運算 - Slider元件 第五章、比較運算與邏輯運算 - 介紹比較運算與邏輯運算 - CheckBox元件 第六章、條件判斷式 - 介紹條件判斷式if then else - Notifier元件與多Screen切換 第七章、清單 - 介紹清單管理 - Spinner元件 第八章、迴圈 - for and while迴圈 - ListPicker元件 2
第七章、清單 清單管理 - 介紹Spinner元件
1.清單 -範例說明 1.原始畫面， 2-1.點Spinner 顯示結果。 依序填入100、70 、50並按下新增按鈕。 2-1.點Spinner 顯示結果。 2-2.選取第二個元素。 3-1顯示“選取的元素為:70” 3-2輸入移除的元素位置，並下移除按鈕 5.填入50並按下「搜尋」按鈕，根據狀況顯示“該元素在清單的第2個位置” 4.點選Spinner 顯示結果。
1.清單 - 範例:介面設計(1/2) 1.拖曳Spinner設計頁面。
1.清單 - 範例:介面設計(2/2) 2.拖曳標籤以及按鈕至設計頁面，並更改其顯示文字。
1.清單 - 範例:程式拼塊(1/5) 1.產生變數，並將變數number ，並設定成空的清單。
1.清單 - 範例:程式拼塊(2/5) 2. 當「新增」按鈕被按時，將文字輸入元件內的值，加到number此清單中。
1.清單 - 範例:程式拼塊(3/5) 3. number清單內的值設定給Spinner，讓number清單內的元素變成Spinner元件的項目。
1.清單 - 範例:程式拼塊(4/5) 4.當按下「移除」時，利用“remove list item”將清單中指定位置(index)的元素刪除。 5.當按下「搜尋」時，利用“is in list?”搜尋輸入的文字在清單中的項目編號(第幾個)。
1.清單 - 範例:程式拼塊(5/5) 6.當選取spinner項目後，會觸發「Spinner1.AfterSelecting」事件，選取的項目值(就是項目的文字)會存在“selection”變數中。
<<建立清單>> <<新增清單元素>> <<移除清單元素>> 2.清單 - 說明 <<建立清單>> 清單的第一個元素的index值為1。 <<新增清單元素>> 新增到固定位置: 新增到最後: <<移除清單元素>>
2.清單 - 說明 <<取得清單元素值>>: <<修改清單元素值>>: 2.清單 - 說明 <<取得清單元素值>>: <<修改清單元素值>>: <<取得元素個數:>> <<搜尋清單元素>> 傳回元素的位置。不存在傳回 0 。
2.清單 - 說明 Spinner 元件介紹: 為下拉式選單，選單內顯示清單的元素值，根據使用者點選的項目，進行相對應的動作。 2.清單 - 說明 Spinner 元件介紹: 為下拉式選單，選單內顯示清單的元素值，根據使用者點選的項目，進行相對應的動作。 <<以字串做為Spinner 元件的資料來源>> (兩種設定方法-元素間以逗號分開。) <<以清單做為Spinner 元件的資料來源>> 14
2.清單 - 說明 Spinner 的事件或方法: AfterSelecting 事件：點選 Spinner元件的項目後會觸發本事件，使用者點選的項目之項目值，儲存於 selection 屬性中。 使用者點選的項目值儲存於 Spinner.Selection 屬性中，而使用者點選的項目編號儲存於Spinner.SelectionIndex 屬性中。
3.清單 -進階練習範例 3.點取Spinner元件，選取要登入的帳號。 4.輸入密碼後送出，於標籤中顯示密碼正確與否。 1.原始畫面 3.清單 -進階練習範例 3.點取Spinner元件，選取要登入的帳號。 4.輸入密碼後送出，於標籤中顯示密碼正確與否。 1.原始畫面 2.輸入帳號/密碼並按下新增按鈕