使用 App Inventor 的 ListView 新功能，做出購物商品清單。

一直以來都想要用 App Inventor，做出一個方便好用的購物 App，但是光在思考如何讓商品呈現，我就想了老半天，最後乾脆放棄…… 因為在 App Inventor 裡沒有動態新增物件的功能，然後商品又是不固定的數量，所幸前陣子 ListView 有新增功能，可以顯示圖片、標題和內容，而且在程式設計區還可以新增多比元素資料，今天就來簡單的測試看看！

---

1. 直接開啟 App Inventor，並新增一個專案「Cart」。

只需要清單顯示器和按鈕就好

滑鼠點擊清單顯示器元件，在屬性裡的 ListViewLayout 選擇「Image, MainText, DetailText(Vertical)」。

接著切換到程式設計

新增一個清單變數

新增當按鈕被點選的方塊

---

我在看官方的文件說明時，根本看不懂 CreateElement 方法要怎麼用，但看起來跟地圖的創建標記很像，沒想到一試真的可以這樣子用。

記得新增完後，要設定給清單顯示器的元素。

---

學會這個簡單的應用後，可以再搭配 Google 試算表，很輕易就能做出購物商品的清單。

那麼這次的教學就到這邊

---

App 專案程式檔下載

點我下載

---

App 範例執行畫面

---

如果覺得文章內容還不錯的話，麻煩請幫我點個讚！感謝

可以多點幾次喔~~

第一次點讚需使用 Google 或 Facebook 帳號註冊