User Interface Controls Sample

This sample builds on the GameStateManagement XNA sample, adding UI elements with a look and feel similar to Windows Phone 7 Silverlight applications. These screens are designed to be easily added to an existing game, whether or not it uses GameStateManagement already.

Sample Controls

On the "Level Select" screen, drag sideways to flip between screens. On the "High Scores" screen, drag vertically to scroll through the content.

How the Sample Works

The sample extends the XNA GameStateManagement sample with a small set of UI controls, including image, text, scrolling panels, and multipage panels. The control classes do not require that you use GameStateManagement, but are designed to integrate easily if you do.

Control Classes

The Control classes themselves are very simple, but quite versatile.

  • TextControl – display a string of text
  • ImageControl – display a single image (as a Texture2D)
  • PanelControl – group a collection of child controls
  • ScrollingPanelControl – group a collection of child controls which may be larger than the screen, and allow the user to scroll through it with drag and flick gestures
  • PageFlipControl – display multiple page-sized child controls, and allow the user to flip between them with drag and flick gestures. Similar in look and feel to the Silverlight Panorama control

See Control.cs for a description of the layout system. The controls may be used with or without GameStateManagement’s GameScreen class. If you are using GameScreen, a SingleControlScreen class is provided to bridge with the Control classes.

Tracker Classes

The ScrollTracker and PageFlipTracker classes do the work of tracking touches and computing motion for scrolling and page-flipping screens, respectively. These classes have minimal dependencies, and can be re-used in other games to implement scrolling interfaces whether or not you choose to use the GameStateManagement classes or the Control classes from this sample.

Extending the Sample

Controls from this sample can be used as-is in games to display scrolling text, multi-page displays, or to build up other screens using Silverlight-style UI controls.