关于 expo-ui-swift-ui
expo-ui-swift-ui 是使用 Expo UI 中 SwiftUI 风格 API 构建界面的技能，适用于 Expo SDK 55 项目。它说明如何查阅组件和修饰符文档、重建原生应用，以及在 SwiftUI 视图树中嵌入 React Native 视图。
主要功能
- 01面向 SDK 55 的指南
- 02SwiftUI 风格的 Expo UI API
- 03查阅组件与修饰符文档
- 04SwiftUI 视图树使用 Host 包装
- 05嵌入 React Native 视图
适用场景
- 01构建基于 SwiftUI 的 Expo 界面
- 02核对组件和修饰符 API
- 03在 SwiftUI 中嵌入 React Native 视图
安装
复制下面的命令，在终端中运行。
$
npx skills add https:/安装后在 Claude Code 中输入/expo-ui-swift-ui确认已加载。
附带文件agents/openai.yaml
详细介绍
此技能中的说明仅适用于 SDK 55。对于其他 SDK 版本，请参阅对应版本的 Expo UI SwiftUI 文档，以获取最准确的信息。
安装
npx expo install @expo/ui
安装后需要进行原生重建（npx expo run:ios）。
说明
- Expo UI 的 API 与 SwiftUI 的 API 相对应。请运用 SwiftUI 知识来决定使用哪些组件或修饰符。
- 从
@expo/ui/swift-ui导入组件，从@expo/ui/swift-ui/modifiers导入修饰符。 - 使用组件前，请获取其文档以确认 API：https://docs.expo.dev/versions/v55.0.0/sdk/ui/swift-ui/{component-name}/index.md
- 不确定修饰符的 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 中缺少所需的修饰符或 View，可以通过本地 Expo 模块扩展。请参阅：https://docs.expo.dev/guides/expo-ui-swift-ui/extending/index.md。扩展前请先与用户确认。
评论
支持 Markdown