# Controls

### Pages

Pages are the root of the UI hierarchy in .NET MAUI inside of a `Shell`.

* `ContentPage`: This is the simplest and most common page type. A content page simply displays its contents.
* `TabbedPage`: This is the root page used for tab navigation. A tabbed page contains child page objects; one for each tab.
* `FlyoutPage`: This page enables you to implement a master/detail style presentation. A flyout page contains a list of items. When you select an item, a view displaying the details for that item appears.

### Views <a href="#views" id="views"></a>

A content page typically displays a view.

* `ContentView`: The default view for a content page, which displays items as-is. If you shrink the view, items may disappear from the display until the view is resized.&#x20;
* `ScrollView`: enables you to display items in a scrolling window; if you shrink the window you can scroll up and down to display items.&#x20;
* `CarouselView`: is a scrollable view that enables the user to swipe through a collection of items.&#x20;
* `CollectionView`: can retrieve data from a named data source and present each item using a template as a format.

### Layouts

* `StackLayout`, arranges its child views in a single row or column. In addition to `StackLayout`, there's also a new optimized `VerticalStackLayout` and `HorizontalStackLayout` when you don't need to change orientation.
* `AbsoluteLayout`, which lets you set exact `x` and `y` coordinates for controls.
* `FlexLayout`, which is similar to `StackLayout` except that it enables you to wrap the child controls it contains if they don't fit in a single row or column.
* `Grid`, which lays out its controls according to a column and row location we set. You can define the column and row sizes as well as spans, so grid layouts don't necessarily have a "checkerboard look" to them.

{% embed url="<https://docs.microsoft.com/en-in/training/dot-net-maui/customize-xaml-pages-layout/media/2-layouts.png>" %}