App Inventor學習記錄123-FireBaseDb+Clock,設定按鈕按下後,隔多久再能再次被按下

由於 app是一定會被關閉的,所以就不能直接把資料存在 tinydb裡,而是要存在 firebase裡,程式一執行的時候,就去抓值然後做判斷。

記錄一下:
App Inventor學習記錄123-FireBaseDb+Clock,設定按鈕按下後,隔多久再能再次被按下


這次的範例演示如下。

按下按鈕後,會將按鈕設定成為不可按,同時會把目前的系統時間記錄下來並傳值到 firease。
然後,refresh重新整理一下頁面,模擬程式被關閉後重新打開的情形。
程式一被打開,就會去 firebase上抓資料。

在設定的時間內,這裡設定為 15秒,這個按鈕都是處於不可按的情形。
等到時間一過,重新整理一下頁面,就會發現這個按鈕是可以被按下的了。


畫面編排的部份如下。

主要的元件就是 clock時鐘跟 firebasedb這兩個元件。
其它就是用來顯示訊息的標籤元件。


全部的程式碼如下。


第 1部份的程式碼說明。

建立三個變數如上,初始值都設定為 0。


第 2部份的程式碼說明 :

when screen1 initialize當程式初始化的時候。
set clock1.timerenable to true,把計時器 1,設定為啟動。

把變數_當下時間的值,設定成 call clock1.getmillis把時間轉為秒數
而instant這裡要放我們指定的時間,這裡就用 call clock 1.now取得當下時間

call firebasedb1 getvalue,呼叫 firebase元件去取 savetime這個標籤下的值。
valueiftagnotthere如果沒有取到 savetime標籤下的值的話,就返回一個空白的值。


第 3部份的程式碼說明。

when clock1.timer當計時器 1開始計時的時候。
把 label 1.text把標籤 1的文字,設定成最新的時間值。


第 4部份的程式碼說明。

when button 1.click當按鈕 1被按下的時候。
把變數_當下時間,設定成當下的時間值。
set button 1.enabled to false,把按鈕 1設定為不能啟動。就是不能按。

set label 2.text把標籤 2的文字設定成按鈕按下的這個時間。
set label 3.text把標籤 3的文字設定成按鈕按下的時間,再加上 15秒。
補充一下,用 call clock.getmillis這個程式取出的時間值,是用毫秒,也就是千分之一秒來計算。所以要加上 15秒的話,就是要加上 15000。

call firebasedb 1.storevalue,呼叫 firebasedb儲存檔案。
把變數_當下時間的值,儲存在 savetime這個標籤下頭。

變數_還有多久的值,設定成變數_當下時間加 15秒後,減去變數_當下時間

set label 4.text的值為變數_還有多久


第 5部份的程式碼說明。

when firebasedb1.getvalue,當 firebase取得數值的時候。
變數_之前的時間,直接設定成 value的值。

設定一下 label 2.text以及 lable 4.text及 label 3.text的顯示文字。

加入流程判斷
如果變數_之前的時間不等於空白,而且變數_當下時間大於變數_之前的時間加上 15000毫秒的話,就設定 button 1.enabled為 true,不然的話就設定成 false。


這次的範例,是在程式初始化的時候,抓當下的時間下去做判斷。
如果要在程式打開的時候也能做判斷的話,就要在多設定一個計時間,讓計時器可以持續的去抓 firebase的資料來做判斷。

這次的 aia檔的下載連結如下:
NO_123_button_wait.aia

參考書籍請見博客來書籍介紹頁面:
手機應用程式設計超簡單 App Inventor 2零基礎入門班
TQC+ 創意App程式設計認證指南
TQC+創意App程式設計認證指南解題秘笈
手機應用程式設計超簡單:App Inventor 2初學特訓班
手機應用程式設計超簡單:App Inventor 2小專題特訓班
手機應用程式設計超簡單:App Inventor 2資料庫專題特訓班

之前介紹過的一些 appinventor的使用記錄,都整理在下面這個頁面上了。
APP INVENTOR學習記錄及資源整理頁面

發表迴響