LCD 螢幕

Web:AI 內建一塊 2.3 吋 LCD 螢幕，可以使用程式積木配合感測器、控制器、按鈕開關等物聯網相關硬體設備，將執行的結果顯示在螢幕上，達成各種跨領域應用。

LCD 顯示文字

「LCD 顯示文字」積木能夠讓 Web:AI 的螢幕上顯示指定的英文字、數字，更可以搭配其它積木的互動，讓程式執行結果展示在 LCD 螢幕上。

LCD 畫文字

「LCD 畫文字」積木是將 Web:AI 的螢幕以畫布的方式畫上指定的文字，更可以透過積木組合，讓文字顯示在圖片上面。

因為「LCD 畫文字」積木在程式邏輯是將螢幕設定一張畫布，所以如下方的積木會讓「LCD 顯示文字」積木的「ABCDE」被覆蓋。

清除 LCD 畫面

「清除 LCD 畫面」積木可以將 LCD 畫面原本的顯示的任何文字或執行結果清除，方便繼續執行後續步驟。

範例：3 秒後清除 LCD 畫面

1. 使用「LCD 顯示文字」積木讓 LCD 螢幕顯示 Hello World。
2. 下方放入「等待」積木設定 3 秒，並加入「清除 LCD 畫面」積木。
3. 按下執行，可以看到螢幕顯示 Hello World，等待 3 秒之後，螢幕畫面中的文字消失。

LCD 畫直線

「LCD 畫直線」積木可以同時在螢幕中畫出 多條 直線，並可以設定線段的起點、終點、顏色、線粗、箭頭。

箭頭的端點位在終點位置。

範例：畫出紫色箭頭

1. 使用「LCD 畫直線」積木，設定起點、終點的 x、y 位置、顏色、線粗，箭頭選擇「顯示」。
2. 按下執行，可以看到 LCD 螢幕顯示紫色箭頭線段。

LCD 畫圓

「LCD 畫直線」積木可以同時在螢幕中畫出 多個 圓形，並可以設定圓形的位置、半徑、顏色、線粗、是否填滿。

範例：畫一張臉

1. 如下方程式範例，使用「LCD 畫圓」積木設定座標、半徑及是否填滿，做出眼睛和鼻子。
2. 使用「LCD 畫直線」積木做出嘴巴。
3. 按下執行，可以看到完成一張臉在 LCD 螢幕上。

LCD 畫矩形

「LCD 畫直線」積木可以同時在螢幕中畫出 多個 矩形，並可以設定矩形的位置、寬高、顏色、線粗、是否填滿。

矩形的起點 x、y 是依據矩形左上角的座標而定。

LCD 顯示圖片

「LCD 顯示圖片」積木可以讓 LCD 螢幕顯示出拍攝的圖片，或是存放在 Web:AI 開發板中的圖片。

開發板預設的圖檔：

• logo：Webduino Logo
• m01：笑臉
• m02：閉眼
• mleft：向左看
• mright：向右看
• mrun：>o<
• red：紅色小怪獸
• blue：藍色小怪獸
• yellow：黃色小怪獸
• green：綠色小怪獸

範例：照相畫面

1. 使用「LCD 顯示圖片」積木，裡面放入「拍攝圖片」積木。
2. 因為這樣的程式設計只能顯示一次固定的畫面，因此需要讓程式不斷執行。
3. 在最外層放入「無限重複」積木。
4. 按下執行，可以看到開發板開啟照相鏡頭功能，顯示鏡頭拍攝的畫面。

關於照相畫面的更多應用變化，可以參考：照相畫面。

範例：改變表情

1. 使用「建立陣列」積木放入各種圖檔名稱。
2. 在外層使用「取出陣列元素並執行」積木，讓程式會根據陣列中的元素逐項執行。

1. 放入「LCD 顯示圖片」積木，顯示圖片、檔名為「變數 i」
2. 讓表情每 1 秒改變一次，因此放入「等待 1 秒」積木。
3. 目前的程式執行到最後一個項目就會停止，並不會永久重複，所以在最外層放入「無限重複」積木。
4. 按下執行，可以看到螢幕不斷變換表情。

照相畫面

「拍攝照片」積木可以使用鏡頭拍攝一次畫面，配合「無限重複」積木就可以達成照相鏡頭的效果。

另外也可以使用「變數」積木替拍攝照片命名，透過命名來做出更多變化。

以上兩種積木組合方式執行後會達到相同的結果，差別在於若是要做出更多應用變化，就需要搭配「變數」積木的命名。

LCD 畫圖片

「LCD 畫圖片」積木內建了各種使用積木畫出的範例圖案，可以直接選用並直接顯示在螢幕上，不需要使用大量積木來畫出。

範例：畫出人臉

1. 放入「LCD 畫圖片」積木，選單選擇人臉。
2. 按下執行，可以看到螢幕顯示人臉。