← ClaudeAtlas

flutter-fix-layout-issueslisted

Fixes Flutter layout errors (overflows, unbounded constraints) using Dart and Flutter MCP tools. Use when addressing "RenderFlex overflowed", "Vertical viewport was given unbounded height", or similar layout issues.
izo/Ulk · ★ 1 · AI & Automation · score 68
Install: claude install-skill izo/Ulk
# Resolving Flutter Layout Errors ## Contents - [Constraint Violation Diagnostics](#constraint-violation-diagnostics) - [Layout Error Resolution Workflow](#layout-error-resolution-workflow) - [Examples](#examples) ## Constraint Violation Diagnostics Flutter layout operates on a strict rule: **Constraints go down. Sizes go up. Parent sets position.** Layout errors occur when this negotiation fails, typically due to unbounded constraints or unconstrained children. Diagnose layout failures using the following error signatures: * **"Vertical viewport was given unbounded height"**: Triggered when a scrollable widget (`ListView`, `GridView`) is placed inside an unconstrained vertical parent (`Column`). The parent provides infinite height, and the child attempts to expand infinitely. * **"An InputDecorator...cannot have an unbounded width"**: Triggered when a `TextField` or `TextFormField` is placed inside an unconstrained horizontal parent (`Row`). The text field attempts to determine its width based on infinite available space. * **"RenderFlex overflowed"**: Triggered when a child of a `Row` or `Column` requests a size larger than the parent's allocated constraints. Visually indicated by yellow and black warning stripes. * **"Incorrect use of ParentData widget"**: Triggered when a `ParentDataWidget` is not a direct descendant of its required ancestor. (e.g., `Expanded` outside a `Flex`, `Positioned` outside a `Stack`). * **"RenderBox was not laid out"**: A cascadin