移动开发

flutter-building-layouts

flutter/agent-plugins

Builds Flutter layouts using the constraint system and layout widgets. Use when creating or refining the UI structure of a Flutter application.

  • 1.1万 次安装
  • 3100 星标
  • 收录于

安装命令

npx skills add https://github.com/flutter/agent-plugins --skill flutter-building-layouts

SKILL.md

Architecting Flutter Layouts

Contents

Core Layout Principles

Master the fundamental Flutter layout rule: Constraints go down. Sizes go up. Parent sets position.

  • Pass Constraints Down: Always pass constraints (minimum/maximum width and height) from the parent Widget to its children. A Widget cannot choose its own size independently of its parent's constraints.
  • Pass Sizes Up: Calculate the child Widget's desired size within the given constraints and pass this size back up to the parent.
  • Set Position via Parent: Define the x and y coordinates of a child Widget exclusively within the parent Widget. Children do not know their own position on the screen.
  • Avoid Unbounded Constraints: Never pass unbounded constraints (e.g., double.infinity) in the cross-axis of a flex box (Row or Column) or within scrollable regions (ListView). This causes render exceptions.

Structural Widgets

Architecting Flutter Layouts

Contents

Core Layout Principles

Master the fundamental Flutter layout rule: Constraints go down. Sizes go up. Parent sets position.

  • Pass Constraints Down: Always pass constraints (minimum/maximum width and height) from the parent Widget to its children. A Widget cannot choose its own size independently of its parent's constraints.
  • Pass Sizes Up: Calculate the child Widget's desired size within the given constraints and pass this size back up to the parent.
  • Set Position via Parent: Define the x and y coordinates of a child Widget exclusively within the parent Widget. Children do not know their own position on the screen.
  • Avoid Unbounded Constraints: Never pass unbounded constraints (e.g., double.infinity) in the cross-axis of a flex box (Row or Column) or within scrollable regions (ListView). This causes render exceptions.

Structural Widgets