Location via proxy:   [ UP ]  
[Report a bug]   [Manage cookies]                
Permalink
docs
Switch branches/tags

Name already in use

A tag already exists with the provided branch name. Many Git commands accept both tag and branch names, so creating this branch may cause unexpected behavior. Are you sure you want to create this branch?
Go to file
 
 
Cannot retrieve contributors at this time
description title keywords ms.date ms.topic ms.assetid ms.localizationpriority
Learn how to create a flexible UI that looks great on different screen sizes, window sizes, resolutions, and orientations.
Layout overview for Windows apps
uwp app layout, universal windows platform, app design, interface
01/28/2022
article
1aa12606-8a99-4db3-8311-90e02fde9cf1
medium

Layout

These articles help you create a flexible UI that looks great on different screen sizes, window sizes, resolutions, and orientations.

:::row::: :::column:::

Screen sizes and breakpoints

Learn about screen sizes across the Windows ecosystem and how to design for breakpoints. :::column-end::: :::column:::

Responsive design techniques

Learn about responsive design techniques that optimize your app's layout for breakpoints. :::column-end::: :::row-end:::

:::row::: :::column:::

Layouts with XAML

Implement responsive UI in XAML with adaptive or tailored layouts. :::column-end::: :::column:::

Multiple views

Show independent parts of your app in separate windows. :::column-end::: :::row-end:::

:::row::: :::column:::

Alignment, margin, padding

Use alignment, margin, and padding to influence layout behavior. :::column-end::: :::column:::

Layout panels

Learn about each type of layout panel an how to use them to arrange UI elements. :::column-end::: :::row-end:::

:::row::: :::column:::

Transforms

Use transforms to rotate, skew, and scale elements. :::column-end::: :::column:::

Attached layouts

Learn advanced layout concepts in XAML and how to create a custom virtualizing layout. :::column-end::: :::row-end:::