SuperAPI AI 工具集

building-native-ui

设计与创作

查看项目

更新于 10-16 06:47

技能介绍

用途:为使用 Expo Router 构建应用界面提供完整指引,涵盖基础、样式、组件、导航、动画、模式与原生标签栏(NativeTabs),目标是构建符合原生观感的应用界面。文档以 references/ 目录下的分主题文件组织,包括动画(Reanimated 进入、退出、布局、滚动驱动、手势)、原生 iOS 控件、表单表(form sheet)、实验性背景渐变、SF Symbols 图标、摄像头与音视频与文件保存、路由结构、搜索栏、SQLite/AsyncStorage/SecureStore 存储、NativeTabs 与 iOS 26 特性、堆栈头部与工具栏、模糊与液态玻璃效果、WebGPU 与 Three.js 以及 Apple Zoom 过渡等。

主要能力:给出编码风格约定(kebab-case 文件名、路径别名、导入置于顶部);路由约定(路由放在 app 目录、避免在 app 内混放组件、始终保留匹配“/”的路由);库选择偏好(使用 expo-audio、expo-video、expo-image 的 sf: 源、react-native-safe-area-context、process.env.EXPO_OS 等,避免已移除的 Picker/WebView/SafeAreaView/AsyncStorage 与旧版 expo-permissions);响应式做法(滚动视图、contentInsetAdjustmentBehavior="automatic"、flexbox、useWindowDimensions);样式规则(优先 flex gap 与 padding、使用 boxShadow、{ borderCurve: 'continuous' }、遵循 Apple 人机界面指南、不支持 CSS 与 Tailwind);以及导航用法(Link、Link.Preview、Link.Menu 上下文菜单、Stack 与 _layout.tsx、模态与 formSheet、NativeTabs 示例结构)。

使用方式:运行应用时建议先尝试 Expo Go,执行 npx expo start 并用 Expo Go 扫码。仅在需要本地 Expo 模块、Apple 目标(小组件、App Clip、扩展)、Expo Go 未包含的第三方原生模块或无法在 app.json 表达的自定义原生配置时,才使用 npx expo run:ios、npx expo run:android 或 eas build。

适用场景与限制:适合需要遵循原生 iOS 交互与视觉规范的 Expo Router 应用开发。文档中的部分能力有平台或版本限制(如部分头部与工具栏特性仅 iOS、页面过渡需 iOS 18+、液态玻璃需 iOS 26+、渐变需新架构)。资料的介绍文本未提供收费、价格与具体平台覆盖等事实,相关细节暂未提供。