Flutter 响应式布局

原名：flutter-build-responsive-layout

使用 LayoutBuilder、MediaQuery 和弹性组件适配手机、平板与桌面。

中文 Skills 技能说明

适合界面在不同宽度、横竖屏或大字体下出现拥挤。技能会从真实约束和断点出发布局，避免只针对一台设备写死尺寸；完成后应检查常用尺寸、文本缩放和滚动行为。

上游能力依据

上游原始适用说明：Use LayoutBuilder, MediaQuery, or Expanded/Flexible to create a layout that adapts to different screen sizes. Use when you need the UI to look good on both mobile and tablet/desktop form factors.

上游 SKILL.md 主要章节（保留原文标题）：

• Contents
• Space Measurement Guidelines
• Widget Sizing and Constraints
• Device and Orientation Behaviors
• Workflow: Constructing an Adaptive Layout
• Workflow: Optimizing for Large Screens
• Examples
• Adaptive Layout using LayoutBuilder
• Constraining Width on Large Screens

使用边界

先核对上游说明、依赖、输入资料和所需权限。涉及写入、删除、发布、支付或外部发送时，必须在执行前人工确认。

作者、翻译与许可证

原作者

The Flutter Authors 与 flutter/agent-plugins contributors

中文翻译

CEOFans翻译

许可证

BSD-3-Clause

上游来源

https://github.com/flutter/agent-plugins/tree/864cf8797b190ddb81e4875db6dd6bab89641f62/skills/flutter-build-responsive-layout

适用范围

平台：linux、macos、windows；标签：设计与前端、Flutter 响应式布局

安全提示

基础静态扫描不等于绝对安全。技能可能调用命令、浏览器、云服务或本地文件，请在最小权限环境中使用，高风险操作必须人工确认。

如发现侵权、许可证或安全问题，可在本页前台提交投诉，管理员复核后可立即下架。