目录

Add iOS as a target platform from web start

目录

To add iOS as a Flutter app target for macOS, follow this procedure.

Install Xcode

#
  1. Allocate a minimum of 26 GB of storage for Xcode. Consider allocating 42 GB of storage for an optimal configuration.
  2. Install Xcode 15 to debug and compile native Swift or ObjectiveC code.

配置 iOS 开发

#

安装并配置 Xcode

#

要为 iOS 开发 Flutter 应用，请安装 Xcode，以便编译为原生字节码。

  1. 打开 App Store 并登录。

  2. 搜索 Xcode。

  3. 点击 获取 (Install)。

    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. 打开 Window > Devices and Simulators。

        你还可以使用快捷键：Cmd + Shift + 2

      2. 打开 Devices and Simulators 对话框后，单击 Simulators。

      3. 从左侧列表中选择一个 Simulator，或按 + 创建一个新的模拟器。

    • 从 Simulator 应用中，打开 File > Open Simulator > 选择目标 iOS 设备。

    • 在模拟器中检查设备版本，打开 Settings 应用 > General > About。

  4. 模拟的高分辨率 iOS 设备可能会溢出你的屏幕。如果在你的 Mac 上出现这种情况，请在 Simulator 应用中更改显示尺寸。

    显示尺寸 菜单项 快捷键
    小尺寸（与真机相同的物理尺寸） Window > Physical Size Cmd + 1
    适中 Window > Point Accurate Cmd + 2
    HD 高分辨率（与真机相同的像素尺寸） Window > Pixel Accurate Cmd + 3
    适应屏幕 Window > Fit Screen Cmd + 4

配置目标 iOS 设备

#

你需要执行以下操作，将 Flutter 应用程序部署到 iPhone 或 iPad 真机上：

  • 创建一个 Apple Developer 账户。

  • 在 Xcode 中配置真机设备部署。

  • 创建开发配置文件 (Provisioning Profile)，并自行签名证书 (Signing Certificate)。

  • 如果你的应用程序使用 Flutter 插件，请安装第三方 CocoaPods 依赖管理器。

创建 Apple ID 和 Apple Developer 账户
#

你可以暂时跳过这一步。实际上，你在准备向 App Store 发布应用之前，并不需要 Apple Developer 账户。

如果你只需要 测试 部署应用程序，请完成第 1 步后继续下一节。

  1. 如果你没有 Apple ID，请创建一个。

  2. 如果你未注册 Apple Developer program，请立即注册。

    了解有关会员类型的更多信息，请查阅 选择会员资格。

将 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 设备。

启用开发者代码签名证书 (signing certificates)
#

在部署到 iOS 真机前，你需要在 Mac 与 iOS 设备之间建立信任。这需要将签名的开发者证书加载到 iOS 设备上。在 Xcode 中签名应用程序，你需要创建一个开发者配置文件 (Provisioning Profile)。

请按照 Xcode 签名流程配置你的项目。

  1. 启动 Xcode。

  2. 使用 Apple ID 登录 Xcode。

    1. 打开 Xcode > Settings...

    2. 点击 Accounts。

    3. 点击 +。

    4. 选择 Apple ID 并点击 Continue。

    5. 出现提示时，请输入你的 Apple ID 和 Password。

    6. 关闭 Settings 对话框。

    开发和测试支持任意 Apple ID。

  3. 打开 File > Open...

    你还可以使用快捷键：Cmd + O

  4. 导航至 Flutter 项目目录。

  5. 打开项目中默认的 Xcode workspace：ios/Runner.xcworkspace。

  6. 在运行按钮右侧的设备下拉菜单中选择你要部署的 iOS 真机。

    它应该出现在 iOS devices 标题下方。

  7. 在左侧导航面板的 Targets 下，选择 Runner。

  8. 在 Runner 设置窗内，点击 Signing & Capabilities。

  9. 选择顶部的 All。

  10. 选择 Automatically manage signing。

  11. 从 Team 下拉菜单中选择一个团队。

    团队是在 Apple Developer Account 页面的 App Store Connect 创建的。如果你尚未创建团队，可以选择 个人团队 (personal team)。

    Team 下拉菜单中会显示名为 你的名称 (Personal Team) 的选项。

    Xcode account add

    选择团队后，Xcode 会执行以下工作。

    1. 创建并下载开发证书

    2. 将设备注册到你的账户

    3. 根据需要创建并下载配置文件 (Provisioning Profile)

如果在 Xcode 中自动签名失败，请检查项目的 General > Identity > Bundle Identifier 值是否唯一。

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. 点击 信任 "<certificate>"。

  6. 显示对话框时，点击 信任。

如果出现 codesign 想要访问密钥... 的提示对话框：

  1. 输入你的 macOS 密码。

  2. 点击 始终允许。

在 iOS 设备上设置无线调试（可选）

#

请按照以下步骤来使用 Wi-Fi 连接调试设备。

  1. 将 iOS 设备连接到与 macOS 设备相同的网络。

  2. 为 iOS 设备设置密码。

  3. 打开 Xcode。

  4. 选择 Window > Devices and Simulators。

    你还可以使用快捷键：Shift + Cmd + 2

  5. 选择你的 iOS 设备。

  6. 选择 Connect via Network。

  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. Open 你的 Terminal.

    打开你的 Terminal。

  2. 要检查所有组件的安装情况，请运行以下指令。

    flutter doctor

由于你选择为 iOS 进行开发，因此不需要 所有 组件。如果你遵循本指南，指令结果应该类似于：

Running flutter doctor...
Doctor summary (to see all details, run flutter doctor -v):
[✓] Flutter (Channel stable, 3.24.3, 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 15)
[!] Android Studio (not installed)
[✓] VS Code (version 1.93)
[✓] Connected device (1 available)
[✓] Network resources


! Doctor found issues in 2 categories.

解决 Flutter doctor 的问题

#

当 flutter doctor 指令返回错误时，可能是 Flutter、VS Code、Xcode、连接的设备或者网络资源出错。

如果 flutter doctor 指令返回这些组件中的任何一个错误，请使用 verbose 标志再次运行。

flutter doctor -v

查看输出结果，了解可能需要安装的其他软件或者需要执行的其他任务。

如果你更改了 Flutter SDK 或其他相关组件的配置，请 再次运行 flutter doctor 来检查安装。

开始使用 Flutter 开发 iOS on macOS 应用

#

恭喜你。 在安装完成所有必要条件和 Flutter SDK 后，你就可以开始开发适用于 iOS on macOS 的 Flutter 应用了。

如果你要继续学习之旅，请参考以下指南：

除非另有说明，本文档之所提及适用于 Flutter 的最新稳定版本，本页面最后更新时间: 2024-04-12。 查看文档源码 或者 为本页面内容提出建议。