Designing apps in Blend (XAML)

Windows Store apps can use two different kinds of markup: Extensible Application Markup Language, or XAML (pronounced "zammel"), an XML-based markup language developed by Microsoft, or Hypertext Markup Language, or HTML, the markup language commonly used to structure pages on the Worldwide Web (WWW). In conjunction with HTML, Cascading Style Sheets (CSS) provide styling for HTML pages.

For more information about creating apps using HTML, see Designing apps in Blend (HTML).

Note

You do not have to understand XAML to create applications in Blend if you work in Design view.

For more information, see Editing source code (Blend for Visual Studio).

Windows Store apps and XAML

When you choose to develop Windows Store apps using XAML, you can build visually stunning user interfaces (UI) in markup instead of in a programming language such as C#. You can create elaborate UI documents entirely in XAML by defining elements such as controls, text, images, shapes, animation, and more. Because XAML is declarative (like HTML), it requires the addition of code if you want to add run-time logic to your application. For example, if your application uses only XAML, you can create and animate UI elements, and configure them to respond in a limited way to user input (by using event triggers), but your application cannot perform and respond to calculations or spontaneously create new UI elements without the addition of code. The code for a XAML application is stored in a separate file from the XAML document. This separation of UI design from the underlying code enables developers and designers to work more closely together on the same project without delaying each other's progress.

Note

Windows Store applications only run on Windows 8 devices.

For more information about the requirements of WPF applications, see Packaging your app using Visual Studio 2012.

For more information about XAML and Windows Store app development, see the XAML Overview topic on the Windows Developer Center.

The relationship between XAML and code-behind files

The XAML for any given document in Blend is stored in a .xaml file. If there is underlying code for your XAML document, that code is stored in a file of the same name, with the additional extension of .cs, .vb, cpp, js. For example, if your XAML document is named MainPage.xaml, the code-behind file will be called MainPage.xaml.cs if the programming language of the code is C#.

For information about how to create XAML documents with or without code-behind files, see Create a new project (Windows Store apps).

When you build your project, the XAML parser reads the .xaml files for that project and reports any resulting errors. Likewise, when you open an existing project in Blend, the XAML parser reads the .xaml files that are included in your project folder and attempts to parse the elements and display the documents on the artboard in Design view. In both cases, if the parser encounters errors, the artboard is disabled, and Blend displays an error message with a link to open Code view so that you can resolve the errors. The parsing errors are also reported on the Errors tab in the Results panel.

For more information, see the following topics: