import { Meta } from '@storybook/addon-docs/blocks'

<Meta title="Layouts|Introduction" />

# Base Layouts

All view groups include a width and height (`lwidth` and `lheight`), and each view is required to define them.

You can specify width and height with exact measurements, though you probably won't want to do this often. More often, you will use one of these constants to set the width or height:

- `wrap_content` tells your view to size itself to the dimensions required by its content.
- `match_parent` tells your view to become as big as its parent view group will allow.

In general, specifying a layout width and height using absolute units such as pixels is not recommended. Instead, using `wrap_content`, or `match_parent`, is a better approach, because it helps ensure that your app will display properly across a variety of device screen sizes.

> source [Android Guide: Declaring Layouts](https://developer.android.com/guide/topics/ui/declaring-layout#layout-params)

## Container

`Container` is the component in the design system that add margin to the child element.

Container include a space

## LinearLayout

LinearLayout is a view group that aligns all children in a single direction, vertically or horizontally. You can specify the layout direction with the `orientation` prop.

## ColumnLayout

ColumnLayout is a view group that organizes its childern in columns with a fixed size, ignoring children width. It is useful with components that match parent width.

# Pattern Layouts

## Notifications Layout

## Chrome Layout

## Page Layout