用途:帮助在 React Native / Expo 移动应用中构建响应式布局,覆盖安全区域处理(刘海、Home 指示条)、屏幕尺寸自适应、iOS 与 Android 平台差异化样式、屏幕方向变化以及平板支持。
使用场景:该技能会在以下情况自动调用——构建响应式布局、处理安全区域、支持多种屏幕尺寸、实现平台特定 UI。
可用模板:templates/responsive.ts(响应式尺寸工具)、templates/safe-view.tsx(安全区域包装组件)、templates/typography.tsx(响应式文本组件)、templates/platform-styles.ts(平台特定样式)。
关键工具(摘自 templates/responsive.ts):wp(50) 表示屏幕宽度的 50%;hp(25) 表示屏幕高度的 25%;moderateScale(16) 用于缩放字号;isTablet 用于设备类型检测。
最佳实践:始终用 SafeAreaProvider 包裹根组件;布局使用百分比与 flex;遵循平台惯例(iOS / Android);在小屏与大屏设备上均进行测试。
限制:资料未提供安装命令、版本要求、收费信息或具体 API 详细文档,相关细节暂未提供。