使用 Arduino UNO R4 WiFi 輕鬆製作 LED Matrix 動畫!

一、Arduino UNO R4 WiFi LED Matrix 特殊點?

使用 Arduino UNO R4 WiFi 輕鬆製作 LED Matrix 動畫!

Arduino UNO R4 WiFi ( 以下簡稱為 UNO R4 WiFi )上的 LED 矩陣可以直接顯示圖案和文字等資訊。傳統的 LED 矩陣控制方法是使用橫排和直列的 IO 腳,所以一個 12×8 的矩陣需要 20 個 IO 腳。 但是,UNO R4 WiFi 只需要使用 11 個 IO 腳!這是因為 UNO R4 WiFi 利用兩個 IO 腳之間的電壓差來同時控制兩顆 LED,並且實現了獨立定址。因此,只需 n 個 IO 腳就能創造出最大為 n*(n-1) 的 LED 矩陣。

使用 Arduino UNO R4 WiFi 輕鬆製作 LED Matrix 動畫!
UNO R4 WiFi 連接後的範例程式

接下來要請讀者準備 USB to Type-C 的傳輸線!此次 UNO R4 WiFi 的更新使用的介面不同於之前,所以這邊要特別注意所使用的傳輸線是否為 Tpye-C 的接口喔!

準備完成後就帶上身邊的 UNO R4 WiFi 吧!以下將會透過一些範例程式來帶大家實際操作看看 LED Matrix 能在此次 UNO R4 WiFi 的更新中帶來怎麼樣的功能!

二、在 Arduino IDE 上面安裝相關套件

若是還沒有下載 Arduino IDE 這個程式的話請先點擊連結下載最新版本(此次示範為使用2.1.1版本)

打開Arduino IDE

使用 Arduino UNO R4 WiFi 輕鬆製作 LED Matrix 動畫!

輸入Arduino UNO R4 WiFi,點擊安裝最新版本。

使用 Arduino UNO R4 WiFi 輕鬆製作 LED Matrix 動畫!

輸入Arduino UNO R4 WiFi,點擊安裝最新版本。

使用 Arduino UNO R4 WiFi 輕鬆製作 LED Matrix 動畫!

三、使用範例程式測試LED Matrix

接下來請使用 Tpye-C 傳輸線連接 UNO R4 WiFi 與電腦。

選擇Board開發板

使用 Arduino UNO R4 WiFi 輕鬆製作 LED Matrix 動畫!

選擇對應之COM接口

使用 Arduino UNO R4 WiFi 輕鬆製作 LED Matrix 動畫!

開啟範例程式:從檔案中選擇範例,可以看到在 LED_Matrix 中有許多已經撰寫完成的程式了!這裡請點選 Displaysingleframe 來開啟程式檔案。

使用 Arduino UNO R4 WiFi 輕鬆製作 LED Matrix 動畫!

隨後會跳出另外一個視窗顯示這個範例程式檔案, 會看到程式如下:

鍵盤的Ctrl鍵按住後點擊 frames 可以查看其中的內容。

使用 Arduino UNO R4 WiFi 輕鬆製作 LED Matrix 動畫!

在這邊可以看見範例程式中所需顯示的圖示都在這邊設定完成了,在下一個範例程式中也會告訴大家要怎麼設計自己想要顯示的內容或是動畫。

使用 Arduino UNO R4 WiFi 輕鬆製作 LED Matrix 動畫!

點選箭頭燒入 upload。

使用 Arduino UNO R4 WiFi 輕鬆製作 LED Matrix 動畫!

成果驗收!燒入完成時會出現像這樣子的提示訊息。

使用 Arduino UNO R4 WiFi 輕鬆製作 LED Matrix 動畫!

接著會看見裝置上面的 LED Matrix 上面會開始出現更迭的圖示。

使用 Arduino UNO R4 WiFi 輕鬆製作 LED Matrix 動畫!

四、在 LED Matrix 上即時顯示自繪圖案

接下來進行下一個範例程式!請再一次確認連接的板子和連接埠口是否正確。

點選範例程式:一樣是從檔案中的範例去找到LED_Matrix的分類,然後請點選 Livepreview。

使用 Arduino UNO R4 WiFi 輕鬆製作 LED Matrix 動畫!

隨後會跳出另外一個視窗顯示這個範例程式檔案, 會看到程式如下:

點選箭頭進行燒錄 upload,完成時會出現像這樣子的提示訊息。

使用 Arduino UNO R4 WiFi 輕鬆製作 LED Matrix 動畫!

接下來請使用 Google chrome 瀏覽器,到這個網站 https://ledmatrix-editor.arduino.cc/ 繼續操作。

然後點擊上面這個按鈕確保連接裝置成功

按照指示 瀏覽器會跳出這個視窗, 再選擇連接上 arduino 的序列埠。

使用 Arduino UNO R4 WiFi 輕鬆製作 LED Matrix 動畫!

點選對應的序列埠連線之後,接著會看見裝置上面的Arduino R4 wifi 會即時反應網頁中使用者作畫的途徑。

使用 Arduino UNO R4 WiFi 輕鬆製作 LED Matrix 動畫!

六、Arduino UNO R4 LED Matrix 動畫製作!

經過上述兩個基礎範例的實作,相信讀者們應該 UNO R4 WiFi 上面的 LED Matrix 有基本的瞭解了!接下來就讓讀者嘗試自己在 LED Matrix 上面創作動畫吧!

此次示範最終想呈現的效果是像這樣子的動畫,下方則是此效果的步驟教學,當然筆者在這邊也很歡迎讀者進行自由創作!所以繪製的部分更是鼓勵讀者能夠盡情發揮想像力喔!

使用 Arduino UNO R4 WiFi 輕鬆製作 LED Matrix 動畫!

回到這個繪製圖案的網頁 https://ledmatrix-editor.arduino.cc/ 操作。

使用 Arduino UNO R4 WiFi 輕鬆製作 LED Matrix 動畫!

可以看到左邊兩個標示(複製跟刪除),可以對選擇目前框選的分頁(藍框標示)做複製或是刪除的處理,看到顯示 ”66” 的位置則是可以命名,右側的 + 符號則可以新增新的空白分頁。

使用 Arduino UNO R4 WiFi 輕鬆製作 LED Matrix 動畫!

接下來使用繪圖區旁邊的工具列就可以開始繪製第一步了!

使用 Arduino UNO R4 WiFi 輕鬆製作 LED Matrix 動畫!

每一個動畫都繪製完成後可以點擊上方的三角形撥放鍵來查看預覽效果。

使用 Arduino UNO R4 WiFi 輕鬆製作 LED Matrix 動畫!

右上角這邊三個按鍵可以看到此網頁可以下載存檔,也可以上傳尚未完成的檔案繼續編輯,當你完成繪製之後可以點擊最右側的按鈕下載此動畫的程式碼檔案。

使用 Arduino UNO R4 WiFi 輕鬆製作 LED Matrix 動畫!

下載後用記事本打開可以看見裡面有撰寫方才繪製的動畫之相應程式碼。

使用 Arduino UNO R4 WiFi 輕鬆製作 LED Matrix 動畫!

接著請打開 Arduino IDE ,一樣透過檔案中的範例,在 LED_Matrix 分類中點選 PlayAnimation 來開啟程式檔案。

使用 Arduino UNO R4 WiFi 輕鬆製作 LED Matrix 動畫!

按住鍵盤上的Ctrl鍵再點擊 animation.h 會看見其中範例的程式動畫程式碼。

使用 Arduino UNO R4 WiFi 輕鬆製作 LED Matrix 動畫!

接下來請將方才從繪製動畫的網頁中下載到電腦的檔案內容複製取代範例的程式碼。取代完成後點擊燒入 upload 就能在 UNO R4 WiFi 上面看見讀者繪製的動畫了!

使用 Arduino UNO R4 WiFi 輕鬆製作 LED Matrix 動畫!

六、小結

在此文章中,我們先是介紹了 Arduino UNO R4 LED Matrix,之後透過數個範例來瞭解 LED Matrix 的操控,綜合上面的範例可以得知 Arduino uno R4 做了很有趣且方便的更新。

有了 LED Matrix 的顯示,就可以不用再外接 OLED 去做提示或是提醒文字,也可以結合其他資訊比如溫溼度感測或是時間顯示,完成更多的專案創作,而且可以直接在網站上繪製圖示,不用另外下載外掛程式真的大大的增加了方便性,即時預覽動畫的效果也免除了不清楚效果為何需要反覆修改調整的情況,接上合適的擴展板也能供您實現更多有趣的專案,下一篇將會介紹也是此次 Arduino uno R4 更新的一大重點「 WiFi 功能 」!