做Flutter界面用这Skill看空间

构建响应式 Flutter 界面,自动适配手机、平板、桌面和折叠屏。

flutter-adaptive-ui 是规划 Flutter 自适应界面的 Skill。它用窗口或父组件提供的空间决定布局,再单独处理输入方式与平台能力。

一台平板也可能开窄窗口,不能只因设备名就显示大布局。页面级决策看窗口,局部卡片看父约束;导航栏与侧栏共用目的地数据,避免两份名单走偏。

改尺寸时,表单输入、选择、滚动与焦点应保持;大屏也不宜把所有文字拉满。主文断点是默认起点,需让真实内容在切换边界附近接受检查。

适合处理溢出、状态丢失或键盘路径。本文未改 Flutter 应用,完整配方与素材未展开;静态分析通过仍不等于多宽度验收,能力可用也不同于产品决定应否展示。

分类:编程开发

来源仓库:madteacher/mad-agents-skills

适合用来做什么

  • 为我的Flutter应用设计一个适配平板和桌面的UI。
  • 修复这个Flutter页面在不同屏幕尺寸下的布局问题。

安装 flutter-adaptive-ui

npx skills add https://www.iskills.cc/skills/madteacher/mad-agents-skills/flutter-adaptive-ui/SKILL.md

在本机终端执行安装命令。安装前请阅读原始说明,确认所需工具、账号和权限。

查看安装步骤 · 查看常见问题

查看 flutter-adaptive-ui 的用途与原始说明

浏览全部 Skill 指南