flutter-building-layouts
Architecting Flutter Layouts
Contents
- Core Layout Principles
- Structural Widgets
- Adaptive and Responsive Design
- Workflow: Implementing a Complex Layout
- Examples
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
xandycoordinates 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 (RoworColumn) or within scrollable regions (ListView). This causes render exceptions.
Structural Widgets
More from gsmlg-dev/code-agent
flutter-animating-apps
Implements animated effects, transitions, and motion in a Flutter app. Use when adding visual feedback, shared element transitions, or physics-based animations.
20flutter-managing-state
Manages application and ephemeral state in a Flutter app. Use when sharing data between widgets or handling complex UI state transitions.
20elixir-architect
Use when designing or architecting Elixir/Phoenix applications, creating comprehensive project documentation, planning OTP supervision trees, defining domain models with Ash Framework, structuring multi-app projects with path-based dependencies, or preparing handoff documentation for Director/Implementor AI collaboration
19flutter-working-with-databases
Manages local data persistence using SQLite or other database solutions. Use when a Flutter app needs to store, query, or synchronize large amounts of structured data on the device.
19flutter-architecting-apps
Architects a Flutter application using the recommended layered approach (UI, Logic, Data). Use when structuring a new project or refactoring for scalability.
19flutter-reducing-app-size
Measures and optimizes the size of Flutter application bundles for deployment. Use when minimizing download size or meeting app store package constraints.
19