Expo UI (Swift UI)

---

name: expo-ui-swift-ui description: expo-ui-swift-ui risk: unknown source: community

---

name: expo-ui-swift-ui description: @expo/ui/swift-ui 包允许你在应用中使用 SwiftUI Views 和 modifiers。

本技能中的说明仅适用于 SDK 55。其他 SDK 版本请参考对应版本的 Expo UI SwiftUI 文档以获取最准确的信息。

何时使用

• 你需要在 Expo 中使用 @expo/ui/swift-ui 构建 iOS 原生 UI。
• 任务涉及选择 SwiftUI views 或 modifiers、用 Host 包裹树结构，或使用 RNHostView 嵌入 React Native 组件。
• 你的目标是 Expo SDK 55 的 SwiftUI 集成和扩展行为。

安装

npx expo install @expo/ui

安装后需要进行原生重建（npx expo run:ios）。

使用说明

• Expo UI 的 API 镜像了 SwiftUI 的 API。使用 SwiftUI 知识来决定使用哪些组件或 modifiers。
• 组件从 @expo/ui/swift-ui 导入，modifiers 从 @expo/ui/swift-ui/modifiers 导入。
• 使用组件前，请获取其文档以确认 API - https://docs.expo.dev/versions/v55.0.0/sdk/ui/swift-ui/{component-name}/index.md
• 如果不确定某个 modifier 的 API，请参考文档 - https://docs.expo.dev/versions/v55.0.0/sdk/ui/swift-ui/modifiers/index.md
• 每个 SwiftUI 树必须用 Host 包裹。
• RNHostView 专门用于在 SwiftUI 树中嵌入 RN 组件。示例：

import { Host, VStack, RNHostView } from "@expo-ui/swift-ui";
import { Pressable } from "react-native";

<Host matchContents>
  <VStack>
    <RNHostView matchContents>
      // Here, `Pressable` is an RN component so it is wrapped in `RNHostView`.
      <Pressable />
    </RNHostView>
  </VStack>
</Host>;

• 如果 Expo UI 中缺少所需的 modifier 或 View，可以通过本地 Expo 模块进行扩展。参见：https://docs.expo.dev/guides/expo-ui-swift-ui/extending/index.md。扩展前请与用户确认。

限制

• 仅在任务明确匹配上述范围时使用此技能。
• 不要将输出视为环境特定验证、测试或专家审查的替代品。
• 如果缺少必要的输入、权限、安全边界或成功标准，请停下来寻求澄清。