從頭開始學App Inventor（六）

我們這款背單詞App的特點是使用個性化的單詞本，會用到文件管理器組件調用外部文件及二維列表的知識，借此掌握CSV文件和列表之間的轉換技巧。

一、功能及界面設計

App名稱“背單詞”，背景圖用張黑板圖片，從上到下的按鍵有單詞、釋義、發音、下一個。

點擊“單詞”切換單詞的顯示與隱藏。點擊“釋義”切換釋義的顯示與隱藏。點擊“發音”可以再念讀一遍，也可以勾選“讀釋義”的復選框，讀中文解釋（需手機語音庫支持）。

初始狀態下單詞和釋義都隱藏，可以直接用聽寫的方式來背單詞，再通過點擊顯示需要的內容。點擊“下一個”隨機切換單詞庫中的任意單詞。

二、組件設計

準備一張豎屏的黑板圖片作為背景，一個正方形的圖標。按后文的方法準備一份英語單詞文本english.csv。

新建項目取名“english”，將2個圖片和english.csv上傳進素材。并根據圖1設計組件。

1.組件Screen，命名Screen1，背景圖片為background.png，圖標icon.png，屏幕方向鎖定豎屏，標題“背單詞”。

2.使用5個水平布局依次垂直排列，高和寬充滿，背景顏色透明，通過水平居中，設置垂直居下或者居上，讓各個按鈕和標簽處于合適的位置。

3.需要4個按鈕，均為圓角按鈕，根據重要程度設定不同的字體顏色、粗細和大小，由于需要用于觸發相應事件，勾選“顯示交互效果”。

按鈕“單詞”，點擊切換單詞的顯示與隱藏，文本“單詞：”。

按鈕“釋義”，點擊切換釋義的顯示與隱藏，文本“釋義：”。

按鈕“發音”，點擊后會再次讀出單詞或釋義（由復選框控制），文本“發音”。

按鈕“下一個”，用于切換到詞庫的下一個單詞，文本“下一個”。……