App Inventor #3 “自己來寫APP 快篩何處買?” (How to process .csv files in App Inventor)

~~更新~~

有網友留言, 兩個Global變數 "search_city" & "search_area" 沒有在影片中定義~ 

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

加入的方法可以參考這裡的作法喔: https://youtu.be/cEN9jAxf2VU

~~~~




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 秘密挑戰~~ ;)

圖檔下載:



rapid-test-icon.png


rapid-test-big.png

AI2 程式碼 (Screen 1):

變數定義 (Define Global variables)

產生查詢結果到 list view (Generate display item list)

Screen1 Initialize & process after read .csv file

After picking of city & area / populate specific city & unique area


AI2 程式碼 (MapScreen):

顯示結果在 OpenStreetMap 上 (Show results on the map)



參考資料:

* 如何處理 .csv: https://www.youtube.com/watch?v=K2n98PYO90M 

* TextUtils extension: https://community.appinventor.mit.edu/t/all-rescued-extensions-from-appybuilder-community/27169/47?page=3 

 * 配合辦理發放公費COVID-19家用快篩試劑社區定點診所名稱、地址、座標

https://data.gov.tw/dataset/150692 

* Google Map 取得 Marker 要輸入信用卡資料了: 

https://developers.google.com/maps/documentation/maps-static/overview 

* APP 地圖使用: App Inventor 內建之 OpenStreet Map: https://www.openstreetmap.org/#map=8/23.611/120.768  

Comments

Post a Comment

Popular posts from this blog

Arduino - DFPlayer Mini MP3 Module

Image
Arduino - Test DFPlayer Mini MP3 Module I found DFPlayer mini MP3 module on China auction site Taobao when I was looking for a MP3 player module for an Arduino projects.  This module is quite small and it only require few pins connections to Arduino and a speaker to work.  Looks really nice for my little project. Actually, the module is quite capable and complicated, if you were interested, please visit this  page . This tutorial here is just to show you how to connect DFPlayer module with Arduino and speaker and the Arduino sketch provided here just to play few sample sounds I collected from Internet. First, I recycled a 2W, 4Omh small speaker from this little music box. Material Needed: DFPlayer Mini module  Speaker - DFPlayer module support to to 3W SD card - 2GB ~ 32GB formatted with FAT or FAT32 MP3 / WAV - audio files Arduino mini Pro Few jump wires As you can see the illustration below I made in Power Point, hardware connection is quite simple (
Read more

Android control color RGB LED using HC-05 Bluetooth with Arduino (Part I)

Image
Android control color RGB LED using HC-05 Bluetooth with Arduino (Part I) Part II of this tutorial is here! Updated Sketch for ESP32 boards   https://stonez56.blogspot.com/2021/07/android-control-color-rgb-led-with.html This time, I am going to show you how to use Android phone to connect to HC-05 Bluetooth module and Arduino. Hardware needed: Arduino mini pro * 1 HC-05 Bluetooth module * 1 RGB LED * 2 Jump wires * 10 HC-05 Bluetooth Module wiring as follow: TX connect to Arduino Pin 11(RX) RX connect to Arduino Pin 12(TX) Remember to connect TX on the HC-05 to RX on the Arduino and RX on the HC-05 to TX on the Arduino, so Arduino can receive data correctly. VCC connect to 5V power GND connect to Ground RGB LED wiring as follow: Warning: You must connect Arduino mini pro, so your PWM Pin can control LED’s color! For example, Arduino mini pro only has 6 PWM pins and they are 3, 5, 6, 9, 10, and 11, other pins do not have PWM. Refer to Wikipedia for PWM R co
Read more

Arduino #27 AsyncWifimanager ElegantOTA ESP32 (WiFi Password Mgnt. + WiFi Firmware Update)

Image
*** If you are using the ESP8266, Please see this:  ESP8266 It would be great if every IoT device deployed with OTA capability with Wifimanager.  Then the IoT device would be able to change SSID & password without connecting the device to the computer to update SSID and password as well as FOTA at any time when you wanted. In this tutorial, let’s combine ESPAsync_Wifimanager and AsyncElegantOTA into a code base to become a handy tool for future IoT projects!  I have made WiFiManager & AsyncElegantOTA tutorial videos. If you don't know what they are and how they work for IoT projects, I strongly recommend you to watch these videos first. This time, I used ESPAsync_WiFiManager library, it's because WiFiManager does not work with AsyncElegnatOTA together. We have to change to ESPAsync_WiFiManager.  The main reason for this is that AsnycWiFiManager is using Asynchronous technology. Which means it can accept connections from different sources at the same time. So, while WiFi
Read more