用途
Flutter Platform Patterns 是一个面向 Flutter 开发的参考技能,用于在用户询问 Flutter 平台差异、响应式布局或平台通道时,指导平台自适应 UI 与原生集成模式。它属于特定技术栈的 Tier 3 参考技能,覆盖 Material 与 Cupertino 模式、自适应组件、响应式布局策略以及平台通道。
主要能力
该技能围绕四类审查展开:
- 平台自适应 UI 审查:检查在 iOS 上本应使用 Cupertino 等价组件却硬编码 Material 组件的情况(例如 Switch 与 CupertinoSwitch);检查平台特定行为是否缺少平台判断(Platform.isIOS、Theme.of(context).platform);检查导航模式是否符合目标平台习惯(例如 Android 与 iOS 的底部标签约定差异);检查是否优先使用 Switch.adaptive、Slider.adaptive 等自适应组件。
- 响应式布局审查:检查在不同屏幕尺寸下会失效的硬编码宽高;检查是否缺少 LayoutBuilder 或 MediaQuery 用于响应式断点;检查在平板和桌面端浪费空间的单列布局;检查 Column 内 ListView 是否考虑 shrinkWrap: true(常见布局缺陷);检查是否缺少 SafeArea 包裹以适配刘海和系统 UI。
- 平台通道审查(如涉及原生集成):检查方法通道命名约定(反向域名:com.example.app/channel);检查 Dart 与原生两侧是否缺少错误处理;检查通道通信是否缺少空安全;检查是否在平台通道上执行本应使用 Isolate 或后台线程的重计算;检查在手动通道带来不必要样板代码时是否使用 Pigeon 或 flutter_rust_bridge。
- 平台特定关注点审查:iOS 方面检查 Info.plist 权限、App Transport Security、键盘处理;Android 方面检查 AndroidManifest.xml 权限、返回按钮处理、深度链接;Web 方面检查是否缺少 kIsWeb 判断、不支持的插件、SEO 考虑;桌面端检查窗口管理、菜单栏集成、键盘快捷键。
使用方式
该技能的工作流程如下:
- 读取项目设置:检查 .chalk/docs/engineering/ 中的架构文档,确定目标平台(iOS、Android、Web、桌面)、最低 SDK 版本以及任何平台特定要求或设计规范。
- 确定范围:解析 $ARGUMENTS 中的具体平台模式或关注点,类别包括自适应 UI、响应式布局、平台通道或平台特定行为。
- 执行上述四类审查。
- 报告发现:以具体文件引用、当前做法、推荐模式及平台相关理由的形式呈现发现。
输出格式为在对话中交付的审查报告,关键部分包括:平台自适应 UI 发现、响应式布局评估、平台通道审查(如适用)、平台特定关注点、带代码示例的推荐模式。
适用场景
适用于 Flutter 项目中需要处理平台差异、响应式布局或原生集成的开发场景,例如:为 iOS 和 Android 提供符合各自平台习惯的 UI;适配手机、平板、桌面等不同屏幕尺寸;通过平台通道与原生代码交互;处理各平台的权限、返回按钮、深度链接、键盘等特定行为。
限制与反模式
该技能明确列出若干反模式:
- 一切平台无关:并非所有 UI 都应在每个平台上看起来一样,用户期望 iOS 应用有 iOS 的感觉、Android 应用有 Android 的感觉,应在约定不同处使用自适应组件和平台判断。
- 过度使用平台判断:反过来,把每个组件都包在 Platform.isIOS ? CupertinoX : MaterialX 中不可维护,应优先使用可用的自适应变体,仅对真正不同的行为添加显式判断。
- 直到平板才考虑响应式设计:手机有多种尺寸,在 Pixel 7 上正常的布局可能在 iPhone SE 上失效,应从开始就用 LayoutBuilder 测试。
- 同步平台通道:平台通道调用是异步的,等待原生响应时阻塞 UI 线程会导致卡顿,应始终处理加载和错误状态。
- 跳过通道错误处理:原生代码可能抛出异常,若 Dart 侧未捕获会导致应用崩溃,应始终用 try/catch 包裹通道调用,并处理未实现该通道的平台上的 MissingPluginException。
关于该技能的收费、价格、具体平台支持范围等更多信息,资料中暂未提供。