Panorama control for Windows Phone 8

May 10, 2014

Applies to: Windows Phone 8 and Windows Phone Silverlight 8.1 | Windows Phone OS 7.1

Panoramic experiences are a part of the native Windows Phone look and feel. Unlike standard apps that are designed to fit within the confines of the phone screen, panoramic apps offer a unique way to view controls, data, and services by using a long horizontal canvas that extends beyond the confines of the screen. These inherently dynamic views use layered animations and content so that layers smoothly pan at different speeds, similar to parallax effects.

This topic contains the following sections.

At the base of the app is the Panorama control that is essentially a long horizontal canvas. A secondary control called a PanoramaItem serves as a container that hosts other content and controls such as links, grids, and lists. For more information about the panorama control architecture, see Panorama control architecture for Windows Phone 8.

The content of panoramic apps can vary:

  • Casual browsing back and forth where the user is encouraged to explore content in a non-task-directed way.

  • More data-dense information Hubs where the user can achieve more conscious goals like looking for a specific contact or game to play.

The People and Pictures Hubs illustrate the look and feel of a panorama app.

OEM_OemMoAppDevGuide_PeoplePan

OEM_OemMoAppDevGuide_PictPan

The Windows Phone panorama experience comes with built-in support for touch interaction and navigation. You do not have to implement any special gesture functionality in your app because it is enabled by default. The panorama experience supports the following gestures and navigational effects:

  • Horizontal pan (tap and drag left/right)

  • Horizontal flick (tap and swipe quickly left/right)

  • Navigating hosted controls—for example, links can be tapped and lists can be scrolled

The following illustrations demonstrate how a typical Panorama control responds as the control is scrolled from left to right.

OEM_OemMoAppDevGuide_PanoHorizScrollLeft

Panorama scrolled all the way to the left

OEM_OemMoAppDevGuide_PanoHorizScrollCenter

Panorama scrolled near the center

OEM_OemMoAppDevGuide_PanoHorizScrollRight

Panorama scrolled all the way to the right

NoteNote:

In the preceding illustrations, when you are positioned on a particular content section, you will have a 24 pixel preview of the next section visible on the screen. This serves as a type of visual hint that there is additional content available.

The following table lists a selection of the supported features in a panorama app.

Feature

Description

Design-time experience

The panorama app will provide a default experience with a root Panorama control and multiple PanoramaItem controls added. You can work with the design surface in Visual Studio or Blend for Visual Studio performing such actions as adding additional PanoramaItem controls and switching between item views.

Matching the Windows Phone panorama experience

Your app can look and react like the integrated Windows Phone panorama experiences.

Built-in flick and gesture support

The panorama app already provides gesture support for common navigation. You do not have to implement gestures such as drags, flicks, or taps in your app.

Hiding and showing panorama items at run time

You can hide the panorama item by setting its Visibility property to Collapsed based on a number of scenarios. For example, you may decide to conceal a PanoramaItem control until it has been populated with content.

Adding and removing panorama items at run time

PanoramaItem controls can be programmatically added and removed from the panorama control.

Show:
© 2014 Microsoft