Scroll viewer
[This documentation is preliminary and is subject to change.]
Control description
A scroll viewer presents a pannable and zoomable viewport into an area of content that can extend beyond the bounds of the screen.
Usage guidance
Scroll viewer functionality is already built into the list box, drop-down list, text input box, grid view, list view, and hub controls. So if you use any of those controls then you’ll be benefitting from scroll viewer goodness. With those controls, if there are too many items to show all at once, the user is able to scroll either horizontally or vertically over the list of items. If you want to show a list of items, then it’s best to use an items control, such as one of those listed.
But there are cases where the user wants to pan in both directions around a larger area, and possibly they want to zoom, too. For example, if you want to allow the user to pan and zoom over a full-sized image (rather than an image sized to fit the screen) then placing the image inside a scroll viewer is appropriate.
Scrolling through a long passage of text requires that the scroll viewer be configured to scroll vertically only.
A scroll viewer can contain one object only. But that object can be a layout panel, in turn containing any number of objects of its own.
Appearance and interaction
A scroll viewer is composed of as much content as will fit in the viewport, and either one or two scroll bars. Touch gestures can be used to pan and zoom (the scroll bars fade in only during manipulation), and the pointer can be used to scroll. The flick gesture pans with inertia.
Related topics
Quickstart: Screen orientation for Windows Phone