react-native-design

React Native Design 技能为移动工程师提供了一套完整的工具组，用于构建响应式、跨平台的用户界面。此技能的核心在于现代 React Native 开发实践，强调通过高效的样式设计、稳健的导航架构与流畅的动画，来实现原生级别的用户体验。它专为需要将设计规范转化为功能性代码的开发者设计，确保移动应用程序在 iOS 与 Android 平台上皆能保持高性能与可维护性。

• 掌握使用 StyleSheet、Flexbox 与动态组件样式的核心布局策略，以支持各种屏幕尺寸与方向需求。

• 通过 React Navigation 6+ 实作复杂的导航架构，包括 Stack、Tab 与 Drawer 导航器，以及嵌套导航模式与深度链接 (Deep Linking)。

• 利用 Reanimated 3 创建高性能、手势驱动的互动，这些互动在 UI 线程执行，确保即使在繁重处理下仍能保持 60FPS 的流畅度。

• 整合 Gesture Handler 处理进阶触控互动，如平移、滑动与缩放，达到原生级的手感与响应能力。

• 在必要时使用平台专有的样式技术，根据 iOS HIG 与 Material Design 指南自定义 UI 元素。

• 应用性能优化技术以最小化 Bridge 通讯与布局抖动，确保 React Native 生命周期内的代码架构简洁。

• 当您在架构新的移动应用程序屏幕，或重构现有 UI 组件以提升性能时，请使用此技能。

• 非常适合用于生成导航器的样板代码、设定复杂的动画状态值，或解决嵌套组件结构中的 Flexbox 布局问题。

• 请确保所有样式皆使用 StyleSheet.create 模式，以在 TypeScript 环境中获得更好的性能与类型安全性。

• 在实作动画时，优先使用 useSharedValue 与 useAnimatedStyle，将繁重的计算维持在 JavaScript 线程之外。

• 参考所提供的动态样式模式，以维护简洁且可重复使用的组件接口。