最近開始著手新專案，剛好有ChatGPT-4開始提供使用圖片提問的功能，這讓我想到可以把設計圖丟給ChatGPT，然後就可以拿生成好的程式碼交差。
但是事情當然沒有這麼美好，生出來的Code大部分都還需要再進行修改才能符合設計圖的樣式。為了能確保生出來的Code是自己要的，這幾天發現DartPad是個很好用的工具，接下來開始介紹怎麼使用DartPad快速檢視Flutter元件的樣式。
首先先將設計圖某個功能截圖後丟給ChatGPT
將ChatGPT提供的程式碼丟給DartPad後發現樣式不太一樣
將不一樣的地方回報給ChatGPT，像是勾選框不夠大以及需要倒圓角，接著ChatGPT又給我一組程式碼，把這組程式碼再放到DartPad上執行看看
這次很幸運地結果與想要的樣式幾乎一樣！只要重複上述的步驟很快就能得到想要的元件樣式了。
