Expo UI

Flexbox 样式适用于 Host 组件本身。进入原生上下文后，便无法使用 Yoga。在 Android 上使用 Row 和 Column 定义布局，在 iOS 上使用 HStack 和 VStack。

Host 是 React Native 与原生 UI 工具包之间的桥梁。每个 Expo UI 组件都必须由它包裹。你可以把它想象成 DOM 中的 <svg>，或者 react-native-skia 中的 <Canvas>。在 iOS 上，它使用 UIHostingController 在 UIKit 中渲染 SwiftUI 视图。有关跨平台用法，请参见通用版 Host。

Expo UI 不是“又一个”UI 库，也不是带有特定设计理念的设计套件。相反，它是一个基础组件库。它直接向 JavaScript 暴露原生 Jetpack Compose 和 SwiftUI 组件，而不是用 JavaScript 重新实现或模拟 UI。

不可以。@expo/ui/swift-ui 渲染 SwiftUI 视图，而 SwiftUI 仅适用于 Apple 平台。Android 请使用 @expo/ui/jetpack-compose。如果你想要一个适用于 Android、iOS 和 Web 的组件树，请使用通用组件。

可以，你可以将 React Native 组件作为 JSX 子元素放入 Expo UI 组件中。Expo UI 会自动为你创建 UIViewRepresentable 包装器。 不过请注意，SwiftUI 布局系统的工作方式与 UIKit 不同，且存在一些限制。根据 Apple 的文档：

警告 SwiftUI 完全控制 UIKit 视图的 center、bounds、frame 和 transform 属性。请勿在自己的代码中直接设置由 UIViewRepresentable 实例管理的视图上的这些布局相关属性，因为这会与 SwiftUI 冲突，并导致未定义行为。

另请注意，渲染 React Native 组件后，你就离开了 SwiftUI 上下文。若要再次添加 Expo UI 组件，请重新引入 Host 包装器。

请保持 SwiftUI 布局独立。虽然可以进行互操作，但明确划分边界时效果最佳。

React 所倡导的“学一次，到处编写”如今也适用于 Jetpack Compose 和 SwiftUI。你可以运用现有知识，在 React Native 生态系统中构建应用。同一个应用还可以通过 DOM 组件扩展到 Web，并使用 react-native-skia 添加 2D 渲染，或使用 react-native-webgpu 添加 3D 渲染。应用的不同部分可以采用不同方式，因为集成是在组件层级进行的。