跳到主要內容

從網頁開始新增 iOS 作為目標平台

若要將 iOS 新增為 macOS 的 Flutter 應用程式目標,請按照此程序進行。

安裝 Xcode

#
  1. 為 Xcode 分配至少 26 GB 的儲存空間。考慮分配 42 GB 的儲存空間以獲得最佳配置。
  2. 安裝 Xcode 16 以除錯和編譯原生 Swift 或 Objective-C 程式碼。

設定 iOS 開發環境

#

安裝並設定 Xcode

#

若要為 iOS 開發 Flutter 應用程式,請安裝 Xcode 以編譯為原生位元組碼。

  1. 開啟 App Store 並登入。

  2. 搜尋 Xcode

  3. 按一下 安裝

    Xcode 安裝程式會佔用 6+ GB 的儲存空間。下載可能需要一些時間。

  4. 若要設定命令列工具以使用已安裝的 Xcode 版本,請使用以下命令。

    sudo sh -c 'xcode-select -s /Applications/Xcode.app/Contents/Developer && xcodebuild -runFirstLaunch'

    針對最新版本的 Xcode 使用此路徑。如果您需要使用不同的版本,請改為指定該路徑。

  5. 簽署 Xcode 授權協議。

    sudo xcodebuild -license

盡量保持使用最新版本的 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
    HD 精確視窗 > 像素精確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. 在左側導覽面板中的 目標 下,選取 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. 一旦裝置名稱旁邊出現網路圖示,請將您的 iOS 裝置從 Mac 上拔除。

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

flutter run --device-timeout 60

安裝 CocoaPods

#

如果您的應用程式依賴具有原生 iOS 程式碼的 Flutter 外掛程式,請安裝 CocoaPods。此程式會在 Flutter 和 iOS 程式碼之間捆綁各種相依性。

若要安裝和設定 CocoaPods,請執行以下命令

  1. 依照 CocoaPods 安裝指南 安裝 cocoapods

    sudo gem install cocoapods
  2. 開啟您慣用的文字編輯器。

  3. 在文字編輯器中開啟 Zsh 環境變數檔案 ~/.zshenv

  4. 複製以下這行程式碼,並貼到您的 ~/.zshenv 檔案的末尾。

    bash
    export PATH=$HOME/.gem/bin:$PATH
  5. 儲存您的 ~/.zshenv 檔案。

  6. 若要套用此變更,請重新啟動所有已開啟的終端機工作階段。

檢查您的開發設定

#

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 2 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 應用程式。

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