步驟1：組件

一塊 Arduino 兼容板（我使用Arduino Nano，因為我有一塊，但是其他任何一塊都可以）

一塊 I2C SSD1306 OLED顯示器

4條母-母跳線

步驟2：將SSD1306 OLED顯示器連接到Arduino

連接母對母電線-電源（紅線），地線（黑線）， SDA （綠線）和《將strong》 SCL （黃線）連接到 I2C SSD1306 OLED顯示器（圖片1 ）

連接接地（黑線）的另一端連接到 Arduino 板（ PIC圖2 ）

將電源（紅色電線）的另一端連接到 5V 電源 Arduino 板的引腳（圖片2 ）

連接 SDA線的另一端（綠色）連接到 Arduino Nano 板的 SDA/模擬引腳4 （圖片2 ）

連接將 SCL線（黃色線）的另一端連接到 Arduino Nano 板的 SCL/模擬引腳5 （圖片2 ）

圖片3 顯示接地， 5V 電源， Arduino Nano

的 SDA/模擬引腳4 和 SCL/模擬引腳5 引腳

第3步：啟動Visuino，然后選擇Arduino電路板類型

要開始對Arduino進行編程，從此處安裝的 Arduino IDE ：http://www.arduino.cc/。

請注意，Arduino IDE 1.6.6中存在一些嚴重的錯誤。 。

請確保您安裝了1.6.7或更高版本，否則此Instructable將無法使用！

還需要安裝 Visuino ：https://www.visuino.com。

開始 Visuino ，如第一張圖片

所示，單擊 Arduino 組件上的“ 工具”按鈕（ Visuino

中的（圖片1 ）），如所示，選擇“ Arduino Nano ”圖片2

步驟4：在Visuino中：添加并連接SSD1306 OLED顯示組件

我們需要添加組件來控制OLED顯示屏：

在“組件工具箱”的“過濾器”框中鍵入“ oled ”，然后選擇“ SSD1306 OLED顯示器（I2C）”組件（圖片1 ），并將其放入設計區域（圖片2 ）

在對象檢查器中，您可能需要更改地址”屬性的值。 ng》 DisplaySSD13061 組件（圖片2 ）（請參閱此說明，以了解如何掃描I2C總線以找到顯示器的I2C地址）

連接將 DisplaySSD13061 組件的“ Out ”引腳連接到該通道的“ I2C ”通道的“ In ”引腳。 Arduino 組件（圖片2 ）

第5步：在Visuino中：將位圖元素添加到顯示組件

下一步，我們需要添加要顯示的位圖元素：

單擊“ 工具 DisplaySSD13061 組件（圖片1 ）

”按鈕

在“ 元素”編輯器中，選擇“ 繪制位圖”元素，然后單擊左側的“ + ”按鈕以添加繪制位圖元素（圖片2 ）

步驟6：在Visuino中：選擇圖片位圖元素

選擇新添加的“ 繪制Bitmap1 ”元素（圖片1 ）

在對象檢查器中，選擇“ 位圖”屬性，然后單擊在其值旁邊的“ 。.. ”按鈕上（圖片1 ）

在“ 位圖編輯器”中單擊“ 加載。.. ”按鈕（圖片2 ）

在文件對話框中，選擇一個圖像文件（圖片3 ）

如有必要，您可以通過點擊“ 反轉”按鈕（圖片4和5， ）

關閉“ 位圖編輯器”對話框。

步驟7：在Visuino中：設置位圖元素的屬性

在對象檢查器中，設置“ 將顏色填充”屬性“ tmcBlack ”（圖片1 ）-這意味著將繪制位圖中的任何黑色像素，并擦除之前的顯示內容。默認情況下，黑色像素被認為是透明的。

在對象檢查器中，將“ X ”屬性的值設置為“ 30 ”（圖片2 ）

在對象檢查器中，將“ Y ”屬性的值設置為“ 14 ”（圖片3 ）

步驟8：在Visuino中：為位圖元素的X和Y位置添加引腳

要設置位圖運動的動畫，我們需要控制X和Y屬性。為此，我們將向其添加引腳：

在對象檢查器中，選擇“ X ”屬性（圖片1 ）

單擊屬性前面的“ Pin ”按鈕（圖片1 ）

從下拉菜單列表中，選擇“ 整數SinkPin ”（圖片2 ）

對“ Y ”執行相同的操作屬性（圖片3 ）

關閉“ 元素”對話框（圖片4 ）

您將看到新的“ X ”和“ Y ”引腳被添加到“ Elements.Draw Bitmap1 ”元素（圖片4 ）

步驟9：在Visuino中：為位圖的X移動添加和配置整數正弦發生器

接下來，我們將添加Sine生成器來控制添加的X和Y引腳，通過這種方式來移動位圖屏幕上：

在“組件工具箱”的“過濾器”框中鍵入“ 正弦”，然后選擇“ Sine Integer Generator ”組件（ 圖片1 ），并將其放在設計區域（圖片2 ）

在“對象檢查器”中，設置“將 SineIntegerGenerator1 組件的 Amplitude ”屬性設置為“ 30 ”（圖片2 ）

在對象檢查器中，將 SineIntegerGenerator1 組件的“ 偏移”屬性的值設置為“ 30 ”（圖片3 ）

在對象檢查器中，將 SineIntegerGenerator1 組件的“ 頻率”屬性的值設置為“ 0.1 ”（圖片4 ）

步驟10：在Visuino中：添加和配置整數正弦發生器以用于位圖的Y移動

在“組件工具”框中，再次選擇“ Sine Integer Generator ”組件（圖片1 ），并將其放在設計區域中（圖片2 ）

在“對象檢查器”中，設置“ 對象中 SineIntegerGenerator2 的振幅屬性為“ 14 ”（圖片2 ）

檢查器中，將 SineIntegerGenerator2 組件的“ 偏移”屬性的值設置為“ 14 ”（圖片3 ）

在對象檢查器中，將 SineIntegerGenerator2 組件的“ 頻率”屬性的值設置為“ 0.2 “（圖片4 ）

步驟11：在Visuino中：將正弦發生器連接到位圖元素

連接“ SineIntegerGenerator1 組件的ng》 Out ”輸出引腳連接到“ Elements.Draw Bitmap1 ”的“ Clock ”輸入引腳。 DisplaySSD13061 組件（圖片1 ）的組成部分-每次生成器生成新值時，這都會強制繪制位圖

連接“ 《 SineIntegerGenerator1 組件的strong》 Out ”輸出引腳連接到“ Elements.Draw Bitmap1 ”的“ X ”輸入引腳。 DisplaySSD13061 組件（圖片2 ）

連接 SineIntegerGenerator2的“ Out ”輸出引腳組件連接到 DisplaySSD13061 組件的《 Elements.Draw Bitmap1 ”輸入引腳的“ Y ”（圖片3 ）

步驟12：生成，編譯和上傳Arduino代碼

在 Visuino 中，按 F9 或單擊圖片1 上顯示的按鈕以生成Arduino代碼，然后打開Arduino IDE

在 Arduino IDE 中，單擊 Upload 按鈕，以編譯并上傳代碼（圖片2 ）

第13步：播放。..

祝賀您 ！。您已經完成了項目。

圖片1 和視頻顯示了已連接并已供電項目。您會看到位圖在 OLED顯示器上移動，就像在視頻上看到的那樣。

在圖片2 上，您可以看到完整的 Visuino 圖。

還隨附了我為此Instructable創建的 Visuino 項目以及帶有 Visuino 徽標的位圖。您可以在 Visuino 中下載并打開它：https://www.visuino.com

責任編輯：wv