flutter-build-responsive-layoutlisted

# Implementing Adaptive Layouts ## Contents - [Space Measurement Guidelines](#space-measurement-guidelines) - [Widget Sizing and Constraints](#widget-sizing-and-constraints) - [Device and Orientation Behaviors](#device-and-orientation-behaviors) - [Workflow: Constructing an Adaptive Layout](#workflow-constructing-an-adaptive-layout) - [Workflow: Optimizing for Large Screens](#workflow-optimizing-for-large-screens) - [Examples](#examples) ## Space Measurement Guidelines Determine the available space accurately to ensure layouts adapt to the app window, not just the physical device. * **Use `MediaQuery.sizeOf(context)`** to get the size of the entire app window. * **Use `LayoutBuilder`** to make layout decisions based on the parent widget's allocated space. Evaluate `constraints.maxWidth` to determine the appropriate widget tree to return. * **Do not use `MediaQuery.orientationOf` or `OrientationBuilder`** near the top of the widget tree to switch layouts. Device orientation does not accurately reflect the available app window space. * **Do not check for hardware types** (e.g., "phone" vs. "tablet"). Flutter apps run in resizable windows, multi-window modes, and picture-in-picture. Base all layout decisions strictly on available window space. ## Widget Sizing and Constraints Understand and apply Flutter's core layout rule: **Constraints go down. Sizes go up. Parent sets position.** * **Distribute Space:** Use `Expanded` and `Flexible` within `Row`, `Column`, or `