# Layout & Structure

The Layout System is the structural framework of your application. It defines how widgets are arranged, aligned, and positioned on the screen. Understanding these core concepts is crucial for building responsive and adaptive interfaces.

## Core Concepts

Before diving into individual widgets, understand the three main layout models:

1. **Box Model (Container & Sized Box)**: Every widget is a box. You can control its size, padding, and margins.
2. **Flex Layout (Row & Column)**: The most common way to arrange widgets linearly (horizontally or vertically).
3. **Stack Layout (Stack & Overlay)**: Positioning widgets on top of each other, useful for background images or floating badges.

## Layout Widgets Catalog

Below are the specific widgets used to implement these concepts:

### Container & Spacing

* [**Container**](/ui-building-blocks/widgets/layout-structure-widgets/container.md) - A versatile box with styling, padding, and dimensions.
* [**Sized Box**](/ui-building-blocks/widgets/layout-structure-widgets/sized-box.md) - precise control over spacing and fixed dimensions.

### Linear & Flow Layouts

* [**Row & Column**](/ui-building-blocks/widgets/layout-structure-widgets/flex.md) - The workhorses of layout; arrange children in a line.
* [**Wrap**](/ui-building-blocks/widgets/layout-structure-widgets/wrap.md) - Like a row/column, but wraps to the next line when space runs out.

### Layered Layouts

* [**Stack**](/ui-building-blocks/widgets/layout-structure-widgets/stack.md) - Place widgets on top of each other (z-axis).
* [**Overlay**](/ui-building-blocks/widgets/layout-structure-widgets/overlay.md) - Float content above the entire application.

### Screen Structure

* [**Scaffold**](/ui-building-blocks/widgets/layout-structure-widgets/scaffold.md) - The standard page layout structure (AppBar, Body, Floating Action Button).
* [**Safe Area**](/ui-building-blocks/widgets/layout-structure-widgets/safe-area.md) - Avoids system intrusions like the notch or home indicator.
* [**AppBar**](/ui-building-blocks/widgets/layout-structure-widgets/appbar.md) - The standard top navigation bar.


---

# Agent Instructions: Querying This Documentation

If you need additional information that is not directly available in this page, you can query the documentation dynamically by asking a question.

Perform an HTTP GET request on the current page URL with the `ask` query parameter:

```
GET https://docs.digia.tech/ui-building-blocks/widgets/layout-structure-widgets.md?ask=<question>
```

The question should be specific, self-contained, and written in natural language.
The response will contain a direct answer to the question and relevant excerpts and sources from the documentation.

Use this mechanism when the answer is not explicitly present in the current page, you need clarification or additional context, or you want to retrieve related documentation sections.