跳至主要內容

從 macOS 開始,新增 iOS 作為目標平台

若要為 macOS 上的 Flutter 應用程式新增 iOS 作為目標平台,請依照下列步驟進行。

此步驟假設您的 Flutter 入門路徑是從 macOS 開始時,您已安裝了 Xcode 16。

設定 iOS 開發環境

#

安裝並設定 Xcode

#

此章節假設您在安裝 Flutter 以進行 macOS 桌面開發時,已安裝並設定了 Xcode。

請盡量保持使用最新版本的 Xcode。

設定您的目標 iOS 裝置

#

透過 Xcode,您可以在 iOS 裝置或模擬器上執行 Flutter 應用程式。

設定您的 iOS 模擬器

#

若要準備在 iOS 模擬器上執行和測試您的 Flutter 應用程式,請依照下列步驟進行。

  1. 若要安裝 iOS 模擬器,請執行下列命令。

    xcodebuild -downloadPlatform iOS
  2. 若要啟動模擬器,請執行下列命令

    open -a Simulator
  3. 將您的模擬器設定為使用 64 位元裝置。這涵蓋了 iPhone 5s 或更新版本。

    • Xcode 中,選擇一個模擬器裝置類型。

      1. 前往 視窗 > 裝置和模擬器

        您也可以按下 Cmd + Shift + 2

      2. 一旦 裝置和模擬器 對話框開啟,請按一下 模擬器

      3. 從左側列表中選擇一個 模擬器,或按下 + 來建立新的模擬器。

    • 模擬器 應用程式中,前往 檔案 > 開啟模擬器 > 選擇您的目標 iOS 裝置。

    • 若要檢查模擬器中的裝置版本,請開啟 設定 應用程式 > 一般 > 關於本機

  4. 模擬的高螢幕密度 iOS 裝置可能會溢出您的螢幕。如果您的 Mac 上出現這種情況,請在 模擬器 應用程式中變更顯示大小。

    顯示大小選單命令鍵盤快速鍵
    視窗 > 實際大小Cmd + 1
    中等視窗 > 精確點Cmd + 2
    高畫質精確視窗 > 精確像素Cmd + 3
    符合螢幕視窗 > 符合螢幕Cmd + 4

設定您的目標實體 iOS 裝置

#

若要將您的 Flutter 應用程式部署到實體 iPhone 或 iPad,您需要執行下列操作

  • 建立一個 Apple Developer 帳號。
  • 在 Xcode 中設定實體裝置部署。
  • 建立開發佈建描述檔以自我簽署憑證。
  • 如果您的應用程式使用 Flutter 外掛程式,請安裝第三方 CocoaPods 相依性管理工具。
建立您的 Apple ID 和 Apple Developer 帳號
#

您現在可以跳過此步驟。在您準備好將應用程式發佈到 App Store 之前,您實際上不需要 Apple Developer 帳號。

如果您只需要測試部署您的應用程式,請完成第一步,然後移至下一節。

  1. 如果您沒有 Apple ID,請建立一個。

  2. 如果您尚未加入 Apple Developer 計畫,請立即加入。

    若要瞭解更多關於會員類型的資訊,請查看 選擇會員資格

將您的實體 iOS 裝置連接到您的 Mac
#

設定您的實體 iOS 裝置以連接到 Xcode。

  1. 將您的 iOS 裝置連接到 Mac 上的 USB 連接埠。

  2. 第一次將您的 iOS 裝置連接到 Mac 時,您的 iOS 裝置會顯示 信任此電腦嗎? 對話框。

  3. 按一下 信任

    Trust Mac

  4. 出現提示時,解鎖您的 iOS 裝置。

在 iOS 16 或更新版本上啟用開發者模式
#

從 iOS 16 開始,Apple 要求您啟用 開發者模式 以防止惡意軟體。在部署到執行 iOS 16 或更新版本的裝置之前,請啟用開發者模式。

  1. 點選 設定 > 隱私權與安全性 > 開發者模式

  2. 點選以將 開發者模式 切換為 開啟

  3. 點選 重新啟動

  4. 在 iOS 裝置重新啟動後,解鎖您的 iOS 裝置。

  5. 當出現 開啟開發者模式? 對話框時,點選 開啟

    該對話框說明開發者模式需要降低 iOS 裝置的安全性。

  6. 解鎖您的 iOS 裝置。

啟用開發者程式碼簽署憑證
#

若要部署到實體 iOS 裝置,您需要與您的 Mac 和 iOS 裝置建立信任關係。這需要您將已簽署的開發者憑證載入到您的 iOS 裝置。若要在 Xcode 中簽署應用程式,您需要建立開發佈建描述檔。

若要佈建您的專案,請依照 Xcode 簽署流程進行。

  1. 啟動 Xcode。

  2. 前往 Xcode > 設定...

    1. 前往 Xcode > 設定...
    2. 按一下 帳號
    3. 按一下 +
    4. 選取 Apple ID,然後按一下 繼續
    5. 出現提示時,輸入您的 Apple ID密碼
    6. 關閉 設定 對話框。

    開發和測試支援任何 Apple ID。

  3. 前往 檔案 > 開啟...

    您也可以按下 Cmd + O

  4. 導覽至您的 Flutter 專案目錄。

  5. 開啟專案中的預設 Xcode 工作區:ios/Runner.xcworkspace

  6. 在執行按鈕右側的裝置下拉式選單中,選取您打算部署的實體 iOS 裝置。

    它應該會出現在 iOS 裝置 標題下方。

  7. 在左側導覽面板的 Targets 下方,選取 Runner

  8. Runner 設定窗格中,按一下 簽署與功能

  9. 在頂部選取 全部

  10. 選取 自動管理簽署

  11. 團隊 下拉式選單中選取一個團隊。

    團隊是在您的 Apple Developer 帳號頁面的 App Store Connect 區段中建立的。如果您尚未建立團隊,您可以選擇一個個人團隊

    團隊 下拉式選單會將該選項顯示為 您的名稱 (個人團隊)

    Xcode account add

    在您選取團隊後,Xcode 會執行下列工作

    1. 建立並下載開發憑證
    2. 將您的裝置註冊到您的帳號
    3. 在需要時建立並下載佈建描述檔

如果 Xcode 中的自動簽署失敗,請確認專案的 一般 > 身分 > 套件識別碼 值是唯一的。

Check the app's Bundle ID

啟用您的 Mac 和 iOS 裝置的信任關係
#

當您第一次連接您的實體 iOS 裝置時,請為您的 Mac 和 iOS 裝置上的開發憑證啟用信任關係。

當您將裝置連接到您的 Mac時,您應該已在您的 iOS 裝置上啟用了對您的 Mac 的信任關係。

為您的 iOS 裝置啟用開發者憑證
#

啟用憑證在不同版本的 iOS 中有所不同。

  1. 開啟 iOS 裝置上的 設定 應用程式。

  2. 點選 一般 > 描述檔與裝置管理

  3. 點選以將您的憑證切換為 啟用

  1. 開啟 iOS 裝置上的 設定 應用程式。

  2. 點選 一般 > VPN 與裝置管理

  3. 點選以將您的憑證切換為 啟用

  1. 開啟 iOS 裝置上的 設定 應用程式。

  2. 點選 一般 > VPN 與裝置管理

  3. 開發者應用程式 標題下方,您應該會找到您的憑證。

  4. 點選您的憑證。

  5. 點選 信任「<憑證>」

  6. 當對話框顯示時,點選 信任

如果顯示 codesign 想要存取金鑰... 對話框

  1. 輸入您的 macOS 密碼。

  2. 點選 永遠允許

在您的 iOS 裝置上設定無線除錯 (選用)

#

若要使用 Wi-Fi 連線除錯您的裝置,請依照下列步驟進行。

  1. 將您的 iOS 裝置連接到與您的 macOS 裝置相同的網路。

  2. 為您的 iOS 裝置設定密碼。

  3. 開啟 Xcode

  4. 前往 視窗 > 裝置和模擬器

    您也可以按下 Shift + Cmd + 2

  5. 選取您的 iOS 裝置。

  6. 選取 透過網路連線

  7. 一旦裝置名稱旁邊出現網路圖示,請從您的 Mac 上拔下您的 iOS 裝置。

如果您在使用 flutter run 時看不到您的裝置列出,請延長逾時時間。逾時時間預設為 10 秒。若要延長逾時時間,請將值變更為大於 10 的整數。

flutter run --device-timeout 60

檢查您的開發設定

#

help 說明

執行 Flutter doctor

#

flutter doctor 命令會驗證 macOS 的完整 Flutter 開發環境的所有元件。

  1. 開啟您的終端機。

  2. 若要驗證您安裝的所有元件,請執行下列命令。

    flutter doctor

由於您選擇為 iOS 開發,您不需要所有元件。如果您遵循本指南,您的命令結果應該會類似

Running flutter doctor...
Doctor summary (to see all details, run flutter doctor -v):
[✓] Flutter (Channel stable, 3.24.5, on macOS 14.4.0 23E214 darwin-arm64, locale en)
[!] Android toolchain - develop for Android devices
[!] Chrome - develop for the web
[✓] Xcode - develop for iOS and macOS (Xcode 16)
[!] Android Studio (not installed)
[✓] VS Code (version 1.95)
[✓] Connected device (1 available)
[✓] Network resources


! Doctor found issues in 3 categories.

疑難排解 Flutter doctor 問題

#

flutter doctor 命令傳回錯誤時,可能是因為 Flutter、VS Code、Xcode、連接的裝置或網路資源。

如果 flutter doctor 命令針對這些元件中的任何一個傳回錯誤,請使用詳細資訊旗標再次執行它。

flutter doctor -v

檢查輸出中您可能需要安裝的其他軟體或需要執行的其他工作。

如果您變更了 Flutter SDK 或其相關元件的組態,請再次執行 flutter doctor 以驗證安裝。

開始使用 Flutter 在 macOS 上開發 iOS 應用程式

#

恭喜您。 在安裝所有必要條件和 Flutter SDK 之後,您就可以開始在 macOS 上開發 iOS 的 Flutter 應用程式了。

若要繼續您的學習旅程,請參考以下指南