App Inventor 傳送資料至網頁檔案後再回傳資料
App Inventor,  HTML

App Inventor 傳送資料至網頁檔案後再回傳資料

昨天有教在 App Inventor 先設定好網路瀏覽器字串後,再到網頁檔透過 JavaScript 抓資料,而今天要來教,要如何在網頁檔中設定網路瀏覽器字串,再讓 App Inventor 讀取,這次的教學會沿用昨天的範例,那麼以下開始來實作吧!!





1. 開啟昨天寫好的網頁檔案 index.html,並在 script 標籤裡新增以下程式碼:

// 重新設定網路瀏覽器字串,再讓 App Inventor 提取。
window.AppInventor.setWebViewString("已收到資料");

新增完後重新上傳到虛擬主機或 App Inventor



2. 開啟 App Inventor 範例檔案「WebViewString」,新增一個計時器元件。


看到計時器元件的屬性,將兩個功能都取消勾選,然後將計時間隔設為 500。(也就是 0.5 秒)


切換到程式設計

新增程式方塊如下圖:



在傳送按鈕方塊那裡,當我們設定好網路瀏覽器字串,並回首頁後,就將計時器啟動。

在網頁檔的部分,我們先 getWebViewString() 抓取設定好的網路瀏覽器字串,並顯示在網頁上,最後再用 setWebViewString() 重新設定網路瀏覽器字串,因為這個過程會耗費一小段時間,如果不用計時器等一下的話,程式執行的速度很快,在 WebViewString 重新被設定之前,App 就會將未更改的 WebViewString 用對話框顯示出來了!

所以我們用計時器讓它等一下,再將重新設定好的 WebViewString 給顯示出來。



App 到此製作完成!!





aia 專案程式檔下載

點我下載





App 範例執行畫面




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

可以多點幾次喔~~

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

發表迴響