小時鐘- Webduino Blockly 教學
文章推薦指數: 80 %
要不斷更新時間的方法有兩種,可自行選擇要用哪種方式。
第一種方法是使用「迴圈+ 等待」,放入一個無窮迴圈,再把剛剛組合好的顯示時間積木 ...
小時鐘
時鐘是日常生活的必需品,每台電腦和行動裝置也都有內建時鐘的功能,透過WebduinoBlockly時間積木,搭配迴圈或流程,就能在網頁上做出小時鐘的效果,這個範例將會介紹「迴圈」和「流程」兩種不同的時鐘作法。
本篇範例會使用:變數、文字、流程、等待、顯示文字和控制台,如果尚未熟悉相關用法,請點選參考閱讀。
步驟1、顯示目前時間
顯示目前時間的方法很簡單,只要用顯示文字的積木,顯示目前時間即可,時間格式選擇「時:分:秒」。
如果要更改預設格式,也可以把時、分、秒單獨顯示在組合,下面的例子分別用三個變數h、m和s代表時、分、秒。
再新增一個變數time,使用建立字串的方式,把h、m和s與標點符號「:」組合,顯示後也會是一樣的結果。
步驟2、顯示並不斷更新時間
要不斷更新時間的方法有兩種,可自行選擇要用哪種方式。
第一種方法是使用「迴圈+等待」,放入一個無窮迴圈,再把剛剛組合好的顯示時間積木放到迴圈內,並在最後放上「等待1秒」的積木,執行後就會每秒更新時間。
第二種方法是使用「流程+等待」,建立一個流程show,將組合好的顯示時間積木放進流程內,並在後面放上「等待1秒」的積木,在等待積木後方再放入一次流程show,如此一來當show執行之後,就會每隔一秒在執行一次show,也會每秒更新時間。
步驟3、個位數補零
只要完成步驟2,就已經完成了時鐘的基本功能,但這邊仍有個小問題,就是如果時間有「個位數」,並不會「補零」(例如5顯示為05),補零的方式可以透過「邏輯」實現,當出現的數字小於10的時候,就使用字串組合將0組合到數字前面。
分別針對變數h、m、s,新增各自的判斷,完成後將這些邏輯積木,放到變數設定後方。
完成結果
執行程式之後,網頁就會出現一個小時鐘,持續不斷每秒更新時間。
範例解答:https://goo.gl/U2q4eo
聯絡我們
如果對於Webduino產品有興趣,歡迎透過下列方式購買:
個人線上購買:https://store.webduino.io/(支援信用卡、超商取貨付款)
企業&學校採購:來信[email protected]或來電07-3388511。
如果對於這篇教學有任何問題或建議,歡迎透過下列方式聯繫我們:
Email:[email protected](如對於產品有使用上的問題,建議透過Email附上照片或影片聯繫)
Facebook粉絲團:https://www.facebook.com/webduino/
Facebook技術討論社團:https://www.facebook.com/groups/webduino/
Webduino基礎教學
Webduino開發板
馬克一號(介紹)
馬克一號(初始化設定)
WebduinoFly(介紹)
WebduinoFly(初始化設定)
WebduinoSmart(介紹)
WebduinoSmart(初始化設定)
開發板擴充設定
Arduino韌體下載與燒錄
使用WebSocket操控
WebduinoBlockly
認識WebduinoBlockly
WebduinoBlockly基本操作
WebduinoBlockly特殊功能
連動多塊開發板
腳位偵測設定
發光元件
LED
三色LED
LED點矩陣
輸入輸出
繼電器
蜂鳴器
按鈕開關
震動開關
搖桿
紅外線發射接收
環境偵測
超音波偵測
溫濕度偵測
人體紅外線偵測
聲音偵測
光敏電阻
可變電阻
土壤濕度偵測
三軸加速度計
無線感應
RFID
玩具及馬達
伺服馬達
Webduino綜合應用
元件應用
LED(兩顆交互閃爍)
LED(霹靂燈)
LED(語音聲控)
LED(人臉追蹤)
LED(Google表單操控)
三色LED(調色盤)
蜂鳴器(多人協奏)
蜂鳴器(會說話的鬧鐘)
傳感器應用
超音波(改變圖片大小)
超音波(控制LED)
超音波(控制三色LED)
溫濕度(Firebase紀錄)
RFID(控制Youtube)
可變電阻(改變Youtube音量)
聲音偵測(吹點矩陣蠟燭)
玩具改造
Smart自走車(組裝步驟)
Smart自走車(網頁遙控器操控)
Smart自走車(超音波避障)
Smart自走車(溫濕度感測車)
Smart智慧路燈(組裝步驟)
Smart智慧路燈(接線教學)
Smart飛天車(組裝步驟)
Smart飛天車(接線教學)
馬克一號自走車(鍵盤操控)
馬克一號自走車(行動裝置操控)
馬克一號自走車(循跡功能)
WABot機器人(初始化設定)
WABot機器人(基礎操控)
百元玩具車大改造
智慧生活
智慧植栽(水泵)
智慧插座(組裝與操控)
智慧追蹤(伺服馬達+攝影機)
Webduino雲端平台
基本介紹
註冊與登入
Blockly程式積木
Device裝置管理(裝置認證)
Device裝置管理(雲端更新)
兌換券(領取與添加新功能)
發光元件
LCD螢幕
七段顯示器
輸入輸出
MP3播放器
環境偵測
PM2.5細懸浮微粒偵測
顏色感測器
電子羅盤
光度計
溫濕度計
資料庫
Google試算表(設定)
Google試算表(儲存)
Google試算表(讀取)
綜合應用
記錄PM2.5(Google試算表)
玩具改造
Smart智慧小屋(組裝步驟)
Blockly教學
基本功能
變數
流程
文字
數學式
列表
邏輯
迴圈
進階功能
控制台
等待
數值轉換
鍵盤行為
語音聲控
語音朗讀
行動裝置
網頁互動區
文字、點擊、圖片
顏色、按鈕、拉霸
遙控器
Youtube
影像追蹤
創意應用
抽籤並朗讀姓名
大樂透自動選號
隨機組合朗讀語句
語音朗讀逐字稿
小時鐘
語音報時
九九乘法你問我答
BlocklyGames
迷宮
鳥
烏龜
影片
池塘導師
Dr.Smart教學
開發板元件
三色LED
三色LED(色彩輪播)
光敏電阻
光敏電阻(色彩變化)
按鈕開關
按鈕開關(控制顏色)
按鈕開關(控制Youtube)
元件及傳感器
LED
蜂鳴器
震動開關
LED點矩陣
超音波偵測
溫濕度偵測
綜合應用
蜂鳴器(多人協奏)
超音波(倒車雷達)
超音波(控制Youtube)
LED點矩陣(顯示距離)
LED點矩陣(顯示溫度)
按鈕開關(控制蜂鳴器)
實戰智慧插座
基本操控
組裝智慧插座
網頁操控智慧插座
傳感器應用
超音波偵測距離
光線偵測
人體紅外線偵測
聲音偵測
電視機遙控器
按鈕開關
電流急急棒
土壤濕度偵測
RFID感應
進階應用
語音辨識
人臉、顏色追蹤
手機陀螺儀
聊天室(原理)
聊天室(前後端實作)
Google試算表(原理)
Google試算表(前後端實作)
Google地圖(原理)
Google地圖(前後端實作)
Youtube互動
Opendata實作
Node-Red(基礎操作)
Node-Red(Twitter)
Node-Red(E-mail)
日幣匯率(Node-Red爬蟲)
日幣匯率(Node-js爬蟲)
常見問題
Webduino相關
關於Webduino
購買Webduino產品
技術支援與合作
Webduino開發板
關於Webduino開發板
連線相關&初始化設定問題
Web:Bit相關問題
WebduinoSmart相關問題
其它問題
延伸文章資訊
- 1重複
「等待」積木可以讓程式暫停一段時間,當程式積木執行到「等待」積木,就會等待 ... 成「重複10 次」積木,按下執行,可以看到Web:AI 螢幕顯示Webduino 文字顏色閃爍。
- 2空氣品質偵測套件教學文件
方法二:. 1.瀏覽器連接:https://cloud.webduino.io/,登入webduino. 2.點選「Webduino Device 裝置管理」 ... 拔除電源,等待約20 秒,...
- 3迴圈- Webduino Blockly 教學
等待的積木在「進階功能> 等待」目錄下。 重複執行加入等待積木. 使用迴圈有個要注意的地方,就是放在迴圈後方的程式,會在 ...
- 4等待- Webduino Blockly 教學
不論是哪種程式語言,「等待」都是相當重要的功能,透過等待的方式,可以讓一連串程式延遲進行,也可以搭配迴圈進行一連串同步的動作,在一些較為複雜的程式運算裡, ...
- 5用LED 點矩陣+按鈕+蜂鳴器模擬擲骰子、認識等待、聲音播放 ...
Webduino模擬器「瘋」神榜:用LED 點矩陣+按鈕+蜂鳴器模擬擲骰子、認識等待、聲音播放與停止積木http://harmonica80.blogspot.tw/2017/08/webdui...