# Layout Lens

> A constraint lint of one Flutter screen against the skill's rule: constraints go down, sizes go up, the parent sets
> the position. Paste the screen's widget classes (or drop a .dart file) and, optionally, the layout error Flutter
> printed; the browser masks comments and strings, matches every call to its closing bracket, links every widget to
> its parent (through your own widget classes and helpers used once) and works out whether each widget's width and
> height are bounded, unbounded or unknown. It flags a ListView, GridView or PageView given unbounded height or width,
> an Expanded in a Column with no height to share, an Expanded, Flexible or Spacer outside a Row, Column or Flex, a
> Positioned outside a Stack, double.infinity or CrossAxisAlignment.stretch across an unbounded axis, a TextField with
> unbounded width, a list inside an intrinsic size query, a SingleChildScrollView that never scrolls, nested scroll
> views, and Rows whose fixed widths overflow the narrowest screen - with the arithmetic - and ties the pasted error to
> the finding that throws it. Metered runs write the review and the corrected widget tree. Built on the SkillSafe skill
> @flutter/flutter-building-layouts, from flutter/skills (BSD-3-Clause), by the Flutter team.

Layout Lens is an independent tool for Flutter developers, not affiliated with or endorsed by Google or the Flutter team. Flutter is a trademark of Google LLC.

https://layout-lens.skillsafe.ai/

## What is free
- The scan: every finding with an id (F1, F2, ...), a severity (blocker - it throws a layout error, major - it overflows, minor - polish), the line, the widget, what the page saw (with Flutter's exact error text), the path from the screen to the widget and the fix.
- The pasted error read: which error it is, the error-causing widget and line, and the finding it matches; an overflow's pixel count is checked against the page's own arithmetic.
- Every Row with fixed-width children measured at the narrowest width (320, 360, 412, 600 or 800 dp) less the padding above it; branches such as if (constraints.maxWidth > 600) are measured at their own width.
- test/layout_test.dart: pump the screen at the narrowest width and at 1280 dp, expect no exception. The skill's four-phase checklist marked from the scan, a findings CSV and everything as JSON.

## The metered lanes
Two tasks on gpt-terra, metered per run, routed by `task`. Input string fields: `task` (review or rewrite), `screen`, `code`, `error` (the pasted error, or a sentence saying none), `carry` (rewrite: the review's decisions) and `facts` (the page's scan).
- `review` replies with `summary`, `cause` (the id and line behind the pasted error), `findings` (confirmed ids with the issue, the fix and a short code fix), `cleared`, `extra` (up to five issues a scan cannot see, on real lines), `plan` (the fixes in order, naming their ids) and `caveats`.
- `rewrite` replies with `summary`, `code` (the whole corrected widget file), `changes`, `kept` and `caveats`.
The page holds every reply to its scan: each id accounted for exactly once, the pasted error given a cause, every class, every Text and the whole file kept, and the corrected tree re-scanned - a claimed fix the re-scan still finds, or a new finding, is flagged.

## Links
- API tutorial: https://layout-lens.skillsafe.ai/api.html
- Source skill: https://skillsafe.ai/skill/@flutter/flutter-building-layouts