使用 Antigravity IDE 協作開發 Raspberry Pi Pico W，並用視訊鏡頭進行此 IoT 實體閉環驗證

在傳統的嵌入式與物聯網（IoT）開發中，除錯通常是最痛苦的一環：你必須一邊寫著程式碼，一邊盯著序列埠輸出，還要低頭去數麵包板上的 LED 燈有沒有亮。

本文分享我們如何與 Antigravity IDE 協作進行編程，並搭配 Webcam 實時串流影像分析，在不停機、不接實體除錯器的情況下，完成一個具備 MQTT 遠端校正功能的 Pico W 溫控器開發。在 https://mqttgo.vip/ 的儀表板成果如下 :

---

1. 與 Antigravity IDE 的高效協作：自動化工具鏈與依賴解決

在這次協作中，開發人員只需專注於高階的架構決策（例如:功能規劃與 MQTT 儀表板的呈現），而 Antigravity IDE (以下簡稱 Antigravity )則在背景自動化處理了所有繁瑣的系統操作：

• 自動定位編譯工具鏈：Antigravity 透過掃描 Windows 註冊表 (Registry) 的 Uninstall 資訊，精確定位了系統中安裝的 Arduino IDE 2.3.10 的 arduino-cli.exe 實體路徑。

• 自動硬體探測：執行 arduino-cli board list 發現連在 COM15 的 RP2040 設備，並確認其對應的 FQBN 為 rp2040:rp2040:rpipicow。

• 自動排查與安裝依賴：當編譯因缺少 #include <PubSubClient.h> 失敗時，Antigravity 自動呼叫 arduino-cli lib install "PubSubClient" 安裝相應程式庫，排除手動查閱安裝的麻煩。

• 排除多INO檔案編譯衝突：針對 Arduino 編譯器會將目錄下所有 .ino 檔合併編譯的特性，Antigravity 自動將目錄下的參考檔案改名為 .bak，實現了一鍵乾淨編譯。

注意:使用 Antigravity 協作時，務必將 Arduino IDE 關閉。不然就會出現 "由於您的電腦畫面上開啟著 Arduino IDE 軟體，且軟體正在開啟 Serial Monitor 佔用 COM 連接埠"。另外，用 Codex 也進行協作也是可以的。

---

2. 開始開發：使用 Webcam 鏡頭進行開發板分析

我們引進了 iriun-webcam-stream-analyzer 技能 (因為 PC 沒有 webcam，所以用 AI 寫了個 app 與 skills 來完成影像擷取。一般 Antigravity 是可以直接使用 webcam，不用這麼麻煩)，以「影像」作為反饋迴路，進行實體世界的開發：

• 先讓 Antigravity 知道開發版的樣子 :

            詢問以下的問題: "幫我分析畫面"

            得到的回答：

                已更新最新畫面並完成分析：                 📷 最新畫面分析結果（畫面有變動與新元件）                 🆕 新增元件 — OLED 顯示器：                 在麵包板上方新增了一塊 0.96 吋 OLED 顯示模組（藍色 PCB 板，4 Pin 接腳：GND, VCC, SCL, SDA，螢幕左邊帶有綠色保護膜拉條）。                 電路板佈局調整：                 麵包板轉為橫向擺放，Raspberry Pi Pico W 朝左（黑色 USB 傳輸線從左側插入）。                 3 顆 LED 指示燈（綠、黃、紅）移至 Pico W 下方排列。                 黑色蜂鳴器 位於 Pico W 下方中央。                 藍色 DHT11 溫濕度感測器 位於麵包板右下角。                 各元件透過杜邦線與 Pico W 引腳相連。

• 開始開發:

                詢問以下的問題: " 如何讓 arduino 軟體識別到此裝置 "

                得到的回答：" 要讓 Arduino IDE 識別並支援 Raspberry Pi Pico W，請依序完成以下 3 個步驟：........"

• 之後就是你的想像了!

---

3. 突破次元壁：使用 Webcam 鏡頭進行實體狀態驗證

當我們把程式燒錄進 Pico W 後，如何確保板子上的 OLED 螢幕顯示正確？如何確認 LED 燈號確實亮起？ 我們引進了 iriun-webcam-stream-analyzer 技能，以「影像」作為反饋迴路，進行實體世界的閉環驗證：

視覺驗證架構設計

1. 實時影像串流：我們在本地運行一個 Flask 伺服器，利用網頁端的 navigator.mediaDevices.getUserMedia() 讀取手機上的 Iriun Webcam 影像，並以 Base64 編碼連續 POST 發送到後端進行 OpenCV 分析。

2. API 觸發拍照：當 Antigravity 需要驗證硬體時，它會向 http://127.0.0.1:5010/api/trigger_snapshot 發送請求。

3. AI 視覺除錯：後端將最新畫面儲存為 latest_frame.jpg，Antigravity 則直接透過 view_file 工具讀取並解讀這張實體相片。

實際驗證成果

當我們完成燒錄後，Antigravity 自動觸發截圖並分析了以下畫面：

透過這張影像，Antigravity 幫我們確認了以下實體狀態：

• OLED 畫面：溫度顯示 28.0 C、濕度 61.2 %，且最下方成功印出繁體中文 開電風扇。

• LED 狀態：麵包板右上角的黃色 LED 燈正發出亮光，紅燈與綠燈皆為熄滅。

• 邏輯一致性比對：程式中設定「當溫度介於 25.0 到 29.0 度之間時，觸發 action 3 (開電風扇) 並點亮黃燈」。畫面的物理狀態與程式碼邏輯 100% 吻合。

---

4. 解決真實 bug：從數據校正到健壯解析

我們接著開發了「溫度遠端校正 (tadj)」功能，讓使用者能透過 MQTT 發送 JSON 訊息（如 {"tadj": -1.5}）來動態校正溫度。在此過程中，Antigravity 與我們共同克服了格式相容的 bug：

Antigravity 建議在 MQTT 儀表板中 json 格式的正確寫法

詢問以下的問題: " 如圖的設定就會接收到 MQTT Recv [/user/******/picow/control]: {"tadj":value} "

得到的解法：

這張圖的設定畫面是物聯網控制面板（常見於 Node-RED 或 MQTT Dash 等工具）的 Payload 模板設定。 因為軟體在發送時需要識別特殊的「變數佔位符」，直接寫 value 或單大括號 {value} 會被當作一般文字直接送出。請根據您使用的軟體，將設定修改如下： 情況 A：如果這是在 Node-RED Dashboard (Slider 節點) 請將 Payload 模板改成使用雙大括號：{"tadj":{{value}}}

情況 B：如果這是在手機 App (如 MQTT Dash) 請將 Payload 模板改成使用 $val$： {"tadj":$val$}

開發過程中可能會有很多 bug 要解決，這裡只是示範一個例子而已。

---

5. 結語

這次與 Antigravity 的協作編程，在沒有親手寫任何程式下，向我們展示了現代 IoT 開發的嶄新工作流。AI 助手不僅能幫我們編寫邏輯、自動化管理本地編譯器與依賴庫，還能主動延伸視覺感官到實體世界，透過 Webcam 鏡頭幫我們「看」著麵包板進行閉環驗證。這種結合虛擬代碼與實體影像的開發方式，無疑大幅縮短了軟硬整合專案的開發與除錯週期。