【App Inventor】教學第3集 “自己來寫APP 快篩何處買?” (How to process .csv files in App Inventor)

Описание: ~~更新~~
有網友留言, 兩個Global變數 "search_city" & "search_area" 沒有在影片中定義~

剛剛把影片調出來看, 這兩個Global變數 "search_city" & "search_area" 的確沒有在影片中出現! 這兩周剪接這影片時, 可能被我不小心剪掉了, 請各位朋友自行加入這兩個變數. 謝謝darbertchang 提醒~

可以參考這裡的作法喔:    • 自己來寫 APP, 快篩試劑何處買 (顯示何處 search_city & sear...  

App Inventor 程式碼貼在部落格上了~萬一編譯產生問題, 可以參考一下原始檔案:
https://stonez56.blogspot.com/2022/05...
~~~~

App Inventor #3
大家好, 歡迎收看本週的Weekend project with Stonez56.

本週我要進行教授的課程是 App Inventor 第3集。 “App Inventor #3 “自己來寫APP 快篩何處買?” (How to process .csv files in App Inventor 2)”. 這個影片適合初學者來觀看學習, 想拿來這個單元來學習 App Inventor 2 也是很 Ok 的!

這幾天最熱門的話題就是快篩試劑何處買了! 到處都大排長龍, 有找了許多點也找不到~ 本集的 App Inventor #3 我們一起來做一隻 App 以縣市, 鄉鎮區來查詢什麼地方才能買到.

這支App 主要是處理 .CSV 檔案來呈現 App 的資訊. 而這個資料是由政府資料開放平臺的- 配合辦理發放公費COVID-19家用快篩試劑社區定點診所名單 頁面下載的資料而來, 資料更新時間為 2022-04-26 20:16 算是很即時的資料~~ 不準不能怪我 Stonez56~~ (2022-5-6 17:09 又釋出新版資料, 格式不變, 一樣能用, 同學們記得下載新版來用)

我採用下載 .CSV 檔案後, 上傳到 App 裡, 再處理 .CSV. 我們也可以直接即時下載 .CSV 來得最新即時的資料, 但是我觀察了幾天, 資料變化不快, 不需要每執行一次, 就去下載一次 .CSV 快浪費時間, 也浪費頻寬~

一起動手來寫 APP 吧~

如果時間不夠的朋友, 也可以從以下的時間軸挑選想看的部份即可!

影片時間軸：
00:00:00 開始
00:00:28 了解這次開發程式的功能
00:01:38 從政府開放資料平台獲取資料（.CSV）
00:02:18 使用 OpenStreetMap, 拾棄 Google Map
00:02:51 了解 .CSV 文件格式
00:04:25 設計 App 使用者界面
00:16:59 準備開始來寫 APP
00:36:34 介紹AI2 Companion App
00:40:39 如何建立並使用副程式(Procedure)
00:56:42 使用 ListUtils 擴展刪除重複項
01:09:29 如何分割/結合字串
01:25:40 使用副程式(Procedure)的好處
01:27:11 加入 OpenStreetMap 地圖畫面
01:28:09 設計 MapScreen 使用者介面
01:33:59 開始設計 MapScreen 程式
01:47:06 秘密挑戰~~ ;)

參考資料:
如何處理 .cvs:    • Видео  
TextUtils extension: https://community.appinventor.mit.edu...
配合辦理發放公費COVID-19家用快篩試劑社區定點診所名稱、地址、座標
https://data.gov.tw/dataset/150692
Google Map 取得 Marker 要輸入信用卡資料了:
https://developers.google.com/maps/do...
APP 地圖使用: App Inventor 內建之 OpenStreet Map: https://www.openstreetmap.org/#map=8/...

App Inventor 相關教學影片:

【App Inventor】教學第16集：使用 ImageBot 元件製做 AI 繪圖 APP (Create your own text to image App)    • 【App Inventor】教學第16集：使用 ImageBot 元件製做 AI 繪...  

【App Inventor】教學第15集：輕鬆打造自己的 ChatGPT APP！
   • 【App Inventor】教學第15集：輕鬆打造自己的 ChatGPT APP！(...  

【App Inventor】教學第14集： Scan barcodes and save it to Google Sheet (English only)
   • 【App Inventor】教學第13集 掃瞄條碼直送 Google Sheets ...  

【App Inventor 】教學第13集： 掃瞄條碼直送 Google Sheets
   • 【App Inventor】教學第13集 掃瞄條碼直送 Google Sheets ...  

【App Inventor】教學第12集： 自己來寫 APP - 用骰子遊戲學IoT
   • 【App Inventor】教學第12集 自己來寫 APP - 用骰子遊戲學IoT ...  

【App Inventor】教學第11集：自己來寫 App - 骰子遊戲 (Dice Game)
   • App Inventor #11 Write your own App (Dice ...  

【App Inventor】教學第10集： 自己來寫 APP YouBike 2.0 (下).
   • 【App Inventor】教學第10集 自己來寫 APP YouBike 2.0 (下)  

【App Inventor】教學第9 集： 自己來寫 APP YouBike 2.0 (上)
   • 【App Inventor】教學第9集 自己來寫APP  YouBike 2.0 (上)  

【App Inventor】教學第8集： AI2 Companion 一直斷線怎麼辦? AI2 小技巧 (How to keep AI2 always connected for Android)    • 【App Inventor】教學第8集 AI2 Companion 一直斷線怎麼辦?...  

【App Inventor】教學第7集： ESP32 語音辨識控制 IOT 專案, 使用 IoT Essential Library Example (CC available)    • 【App Inventor】教學第7集  ESP32 Voice Control I...  

【App Inventor】教學第6集： 使用’ 繪圖動畫' 製作使用者介面 (App Inventor 2 UI design with Draw and Animation)    • 【App Inventor】教學第6集  使用’ 繪圖動畫' 製作使用者介面 (Ap...  

【App Inventor】教學第5集： - “無線搖控 ESP32-CAM APP 下集 (Write ESP32-CAM remote APP 2/2)    • 【App Inventor】教學第5集 - “無線搖控 ESP32-CAM APP ...  

【App Inventor】教學第4集： 無線搖控 ESP32-CAM APP 上集 (Write ESP32-CAM remote APP 1/2)
   • 【App Inventor】教學第4集 無線搖控 ESP32-CAM APP 上集 ...  

【App Inventor】教學第3集： “自己來寫APP 快篩何處買?” (How to process .csv files in App Inventor)
   • 【App Inventor】教學第3集  “自己來寫APP 快篩何處買?” (How...  

【App Inventor】教學第2集： “自己來寫mqtt APP Android & iOS都能用” (Create MQTT Apps with App Inventor 2)
   • 【App Inventor】教學第2集  “自己來寫mqtt APP Android...  

【MIT App Inventor】教學第1集： - 語音辨識 (Voice Recognition)
   • 【App Inventor】教學第1集 - 語音辨識  



有興趣也可以到我的部落格逛逛:
Please visit my blog for more Arduino Tutorials
https://stonez56.blogspot.com