OLED 顯示手繪圖案

這篇教學會使用 MakeCode 編輯 micro:bit 擴充板程式 ( EZ Start Kit+ )，讓 OLED 可以顯示 Google 試算表或 Excel 所繪製的黑白點陣圖。

• 操作 EZ Start Kit+ 需要載入對應的擴充積木，請先參考：載入 EZ Start Kit+ 的程式積木。
• 更多資訊：ICShop EZ Start Kit+ 官方網站。

使用 Google 試算表繪圖

開啟空白的 Google 試算表，用滑鼠建立一個 64x32 的儲存格陣列 ( 開啟範本：EZ Start Kit - OLED 繪圖範本 )。

為什麼要使用 64x32 的尺寸呢？因為 EZ Start Kit+ 的 OLED 尺寸為 128x64，但 micro:bit 第一代的記憶體容量無法容納 128x64 的文字陣列，所以將長寬尺寸減半為 64x32。

用滑鼠選取 64x32 的儲存格，點擊右鍵，選擇「查看更多儲存格動作 > 條件式格式設定」。

設定 64x32 的儲存格的格式為如果內容「非空白」，將背景色改成黑色。

如此一來，當儲存格有內容時，背景就會變成黑色，就能透過這種方式繪製黑白像素圖片，下圖的例子中，儲存格的內容為 1。

Google 試算表儲存為 CSV

在 Google 試算表的 64x32 範圍裡，繪製自己喜歡的圖片。

繪製完成，將檔案下載為 CSV。

下載後，使用筆記本或文字編輯器開啟 CSV，就能看到之後 OLED 要顯示的內容。

編輯 OLED 顯示圖片程式

回到 MakeCode 程式編輯器，編輯 OLED 顯示圖片程式：

• 啟動時，建立 bitmap 變數，內容是將 CSV 的所有內容。
• 建立 y_list 變數，將 bitmap 根據換行的空白拆分成陣列 ( y 軸 )。
• 使用重複迴圈，讀取 y_list 的每個項目。
• 讀取 y 項目後，建立 x_list 變數，將項目根據逗號，再度拆分成陣列 ( x 軸 )。
• 再次使用重複迴圈讀取每個 x 項目，判斷如果該項目不是空值，就在 OLED 上顯示。
• 因為 CSV 繪圖的長寬尺寸為 OLED 的一半，所以顯示像素時長寬要多加一倍。

完成後將程式燒錄至 micro:bit，就會看見 OLED 顯示自己繪製的圖案。

範例解答

• 範例解答： EZ Start Kit+ OLED 顯示手繪圖案

延伸練習

如果已經熟悉了 EZ Start Kit+ OLED 顯示手繪圖案的原理，還可以嘗試更多好玩的作法：

• 使用按鈕開關，按下 A 和 B 時顯示不同圖案 ( 解答 )。

意見回饋

如果有任何建議或問題，可傳送「意見表單」給我，謝謝～