天天看點

Flutter實戰總結-4- XCode和VSCode調試的Hot Reload

作者:滬上小樹

繼加載自定義Entrypoint之後,嘗試熱加載(Hot Reload)調試。

iOS的環境:XCode v14.2和iPhone 16.3.1。

先在XCode中運作App,讓Flutter Engine運作起來後,在VSCode中,有兩種方式:

  1. 在Terminal中,運作flutter attach
  2. 在View-Command Palette...-Flutter: Attach to flutter on device(注意在底部狀态欄中,是不是選擇的目前連結裝置)
Flutter實戰總結-4- XCode和VSCode調試的Hot Reload

然後右下角會出現Launching的提示,在DEBUG CONSOLE中提示:Waiting for a connection from Flutter on “xxx”的 iPhone... ,開始遇到一直等待,無法連接配接上的問題。

反複測試成功的情況是:需要在iPhone的App要打開Flutter的界面後,在VSCode中再Attach,僅僅是在delegate的程式啟動時,flutterEngine運作起來還不夠。

attach成功之後,會同步檔案到Device:

Flutter實戰總結-4- XCode和VSCode調試的Hot Reload

然後就可以進行代碼修改,Hot Reload加載,iOS App的界面會實時更新,例如把SignUp界面的标題改為“Sign up Hot Reload”,如下圖:

Flutter實戰總結-4- XCode和VSCode調試的Hot Reload
Flutter實戰總結-4- XCode和VSCode調試的Hot Reload

ps. 有時我按照這個操作順序也不能成功attach,我索性把iPhone裝置重新連接配接電腦,并且先把iOS App kill掉,再重新執行以上步驟。