该技能用于指导 React Native 与 Flutter 应用的移动端开发实践,重点是组件结构、导航组织、响应式布局和平台适配。
主要能力:在 React Native 中,演示如何用 FlatList 渲染可滚动列表,并设置 windowSize、maxToRenderPerBatch、initialNumToRender 等参数以优化大列表;使用 @react-navigation/native 的 NavigationContainer 搭配原生堆栈与底部标签导航,并用 TypeScript 定义路由参数类型;通过 useWindowDimensions 实现手机、平板、桌面三档响应式布局与多列网格;用 Platform.select 处理 iOS 与 Android 的样式差异;使用 SafeAreaView 处理刘海、状态栏与 Home 指示器。Flutter 侧展示 StatelessWidget 组件模式,含 Card、Image.network 的错误占位与主题文字样式。
使用方式:作为开发参考模式直接套用于项目,按清单逐项检查,例如所有可滚动列表使用 FlatList 并设置 keyExtractor、导航路由使用 TypeScript 类型、样式统一用 StyleSheet.create 定义、图片处理加载与错误状态、重计算任务移出 JS 线程。
适用场景:需要构建跨平台移动应用的界面、导航与布局时参考。
限制:资料以 React Native 示例为主,Flutter 内容较少,未提供安装命令、依赖版本、收费或平台支持等具体信息,这些事实暂未提供。