Defining layouts and views (XAML)

[This article is for Windows 8.x and Windows Phone 8.x developers writing Windows Runtime apps. If you’re developing for Windows 10, see the latest documentation]

When you create a Windows Runtime app using C++, C#, or Visual Basic, you have a flexible layout system available that helps you accommodate multiple devices and application states. With a flexible design, you can make your app look great on screens with different sizes, resolutions, pixel densities, and orientations.

In this section

Topic Description

Quickstart: Defining layouts

When you create a Windows Runtime app using C++, C#, or Visual Basic, you have a flexible layout system available that helps you accommodate multiple devices and application states. With a flexible design, you can make your app look great on screens with different app window sizes, resolutions, pixel densities, and orientations. We describe how to design a user interface that automatically adjusts to different sizes.

Quickstart: Designing apps for different window sizes

When you design an app to look good and function well at any window size, you must choose if you want to create additional layouts to complement your default full-screen horizontal layout.

Quickstart: Creating multiple windows for an app

You can help your users be more productive by allowing them to view multiple independent functions in separate windows.

Alignment, margin, and padding for UI element layout

In addition to dimension properties (width, height and constraints) elements can also have alignment, margin and padding properties that influence the layout behavior when an element goes through a layout pass and is rendered in a UI. There are relationships between alignment, margin, padding and dimension properties that have a typical logic flow when a FrameworkElement object is positioned, such that values are sometimes used and sometimes ignored depending on the circumstances.

XAML custom panels overview

You can define custom panels for XAML layout by deriving a custom class from the Panel class.

Transforms overview

Learn how to use transforms in the Windows Runtime API, by changing the relative coordinate systems of elements in the UI. This can be used to adjust the appearance of individual XAML elements, such as scaling, rotating, or transforming the position in x-y space.