Device panel (XAML)

The Device panel includes settings to help you simulate the various views for your app at run time.

You can also customize the appearance of the views by modifying the application view states in the States panel (XAML).

The Device panel

	View   Use to simulate different views for your app at design-time, including Portrait, Landscape, Filled or Snapped views.
	Visual state   Use to select a state in the ApplicationViewStates group to preview and edit visual states. The Base state is selected by default.
	Enable state recording   Indicates whether or not a visual state is selected in the ApplicationViewStates group. When a state in the ApplicationViewStates group is selected, the recording check box is enabled. When record mode is turned on, changes made on the design surface or in the Properties panel are made to the currently selected visual state instead of to the Base state.
	Display   Select the display resolution for which you want to preview your app.
	Theme   Use to simulate Dark, Light and High Contrast themes.
	Override scaling   Use to simulate the built-in display scaling of the device.
	Show chrome   Select or clear the Show chrome check box to turn the simulated tablet frame around your app in the Design view on or off.
	Clip to display   Select or clear the Clip to display check box to either clip the entire document or show the document display.
	Deploy target   Select the target device where your app will be deployed when it builds.

View state

The Grid, Split, and Blank project templates for Windows Store apps have built-in support for detecting and displaying different views. Use the View buttons in the Device panel to test visual states and orientations provided for each of the orientations of your app.

The orientations and view states supported by Blend are:

• FullscreenLandscape   The app is displayed in full screen mode using a landscape orientation. This is the default layout.

• Snapped   The app is snapped to one side, and the panning direction is vertical.

• Filled   Two apps are snapped, one to each side, filling the display.

• FullscreenPortrait   The app is displayed in full screen mode using a portrait orientation.

Changing view states

When you click one of the View state buttons in a Windows Store app built using XAML, the following happens:

• Any control that responds to the Resize event will be updated on the artboard.

• The width and height for the root control hosting the current page or user control is updated to match the values at runtime.

• The chrome is updated if the Show chrome check box is checked and if the View is in Snapped or Filled mode.

• The visual state will update if there is a state that matches the name of the view.

  Note

  The Resize event code is located in the LayoutAwarePage file.

See Also

Concepts

Blend app workspace (XAML)

Artboard (XAML)

Assets panel (XAML)

Objects and Timeline panel (XAML)

Projects panel (XAML)

Properties panel (XAML)

Results panel (XAML)

States panel (XAML)

Tools panel (XAML)