View your design or the XAML that defines your design

Visual Studio 2012

You can change the artboard to show the visual design of your XAML document or the XAML markup that describes your visual design. Alternatively, you can display both.

The connection between Design view and Code view

The connection between Design and XAML view
  • Design view    Changes the artboard to Design view, the visual design view of your document. In this view, you can use the tools from the Tools panel to draw or modify objects on the artboard, view the objects that make up your design in the Objects and Timeline panel, and view the Properties of selected objects.

  • Code view    Changes the artboard to XAML view. In this view, you can edit XAML code manually, and use XAML IntelliSense. You can go to a specific line or search for and replace text, just as you can in any text editor. However, in this view, you cannot use the tools in the Tools panel, view the tree of objects in the Objects and Timeline panel, or use the Properties panel to modify objects. Additionally, most menu items are disabled in this view.

  • Split view    Changes the artboard to a panel layout that shows both Design and Code views. In this view, all the Blend tools and features are available as if Design view were selected, and when you select an object, the respective line of XAML is highlighted. You can further configure the panel layout in this view.

Note Note

Code-behind files do not have different authoring views. For more information, see Modify a code-behind file.

To change the authoring view of the active document

  • Do one of the following:

    1. Click one of the tabs on the upper-right area of the artboard: Design 32be2832-9f81-4617-97e6-a4a3988a136c, Code d62c8271-e5e5-4bfd-8aba-9f6f8f5b7a3d, or Split 5b79e600-984e-4f44-b8cd-6c1522832ad4.

    2. Press F11 to cycle through all three views.

    3. On the View menu, click Active Document View, and then select one of the following options: Design View, Split View, or Code View.

To change the default authoring view

  • On the View menu, click Active Document View, and then click one of the views: Design View , Code View , or Split View.

    Caution note Caution

    This option specifies how to display all future documents that are opened. You can still change the authoring view of individual documents that are open.

To change the Split view panel layout

  1. Make sure Split view 5b79e600-984e-4f44-b8cd-6c1522832ad4 is selected.

  2. On the View menu, click Split View Orientation, and then select one of the following options: Arrange Panes Horizontally, Arrange Panes Vertically, or Swap Design and XAML Panes.

    You can drag the border between the two panes to resize them.