Windows apps
Collapse the table of content
Expand the table of content

Grid view and list view

Note  Pre-Release Content: This topic is currently being adapted to apply to both Windows 8.1 and Windows Phone (code-named "Blue"). To view the Windows 8.1 version of this topic, click here.

A sample of what standard grid and list view controls look like

Control description

A grid view or a list view is a collection of content within a Windows Store app. It is optimized for touch and allows the user to interact with the content efficiently and intuitively. You can enliven this control by adding rich visuals that portray the Windows personality. Grid views and list views provide a consistent item viewing experience.

The control comes in multiple formats - ungrouped grid, grouped grid, list (HTML), ungrouped list (XAML), and grouped list (XAML). Grids pan horizontally. Lists pan vertically. The reading order for grids is top to bottom, left to right. The reading order for lists is top to bottom.

Usage guidance

You can use a grid view or list view control to display a data collection, such as a list of contacts, images in a gallery, or the contents of an email inbox. Grid views and list views have similar functionality but display data differently. The list view displays data stacked vertically. It's often used to show an ordered list of items, such as a list of email messages or search results. It's also useful in hierarchical systems in which each list item contains only a small amount of info and the details of the item are shown separately. The grid view displays data horizontally. It's often used to show a rich visualization of each item, such as a photo gallery.


Grid view

A screenshot illustrating a standard grid view control

Related APIs and code samples

WinJS.UI.ListView object

GridView class

ListView class

Guidelines for ListView controls



© 2017 Microsoft