XAML is XML so it follows all the rules of XML files. It also has its own special syntax that augments the XML rules. This tutorial provides an overview of the parts of XAML, from property attributes and property element to attached properties. You’ll see the syntax for markup extensions, object elements and type converters too.
- [Instructor] XAML is XML, so it follows all the rules of XML files. It also has its own special syntax that augments the XML rules. Here are some examples of XAML specific XML. Whenever XML has a predefined list of elements, and attributes, it will contain an XML namespace declaration. Typically, these are defined in the root element. You can see three namespace is defined in this file. The first one, the one I've highlighted, is the default WPF namespace. All the standard WPF elements and attributes are located here, that allows me to use this grid element, and this button element, and this textbox element in my XAML.
This namespace also tells the XML parser what dot net namespace is to look in to resolve the element name to a dot net type. This is the XAML namespace. It contains XAML language items, ones that make sense to the XAML parser, and not specifically tied to WPF, or Silverlight, or other XAML flavors. Line three is an example of a custom namespace. This allows me to define my own types, and work with them in the XML file. This is often used in data binding scenarios. Line four, and line five, and line 13, I'm using an example of what's known as an object element.
An object element typically declares and instance of a type. You see online four, there's a grid element, and it has children elements. There are several buttons and other elements nested inside the grid. Each object element has rules about nested content. Some objects, like the grid, can contain multiple children. Other elements, like this button, can only contain one child element. This is an example of a property attribute. They map to the dot net properties in the affiliated object. Most properties on the WPF type are available with these attributes.
The width attribute maps to the button width property. Dot net objects also contain event members. On the XAML side, events are also expressed in attributes. In this example, when the textchanged event fires, the code in this event handler, text box underscore, textchanged is executed. That code is not here in the XAML file, it's somewhere else in the project. Now, I want to explore the values assigned to the width and height properties. In the button class, the width property is typed as a double, meaning that numbers like 20, or five point one two five are acceptable for assignment, but change this to a string value, like ABC, and you'll see it's not supported.
You'll see that is not acceptable, because there's a blue error squiggle in my XML. What about this one, and two I N? These alpha characters are not causing an error. This shows a principle of XAML called a type converter. Behind the scenes, there is a helper class that converts the 30 CM, and two I N strings into a double value. Type converters are mostly invisible in XAML, they work for you without any extra XML syntax needed.
Before I do the next demo, I will uncomment line 17. I'll use control K, control U. Line 16 shows there is some text content between the start and end tags. In most situations, this is not allowed. You see, on line 17, the blue squiggle that tells me that the raw string values are not acceptable here in the rectangle element, but it works on line 16. That's because a small number of XAML elements can directly process text as their content, but only if they are written to support it. What's really happening here is that the raw text is assigned to the checkbox content property.
A better way to write this is shown here, on line 18. I'm explicitly using the content property attribute. Line 23 shows an example of a property element, an alternate way to specify property value. The key to this syntax is that it is a nested element, and there is a dot in the middle of the element name. It looks similar to the way we access property members in C sharp, or VB code. The way it works is, I've got the text box element. When I want to create a property, I use a text box dot text element as a child, and then I put the content between the beginning and ending elements like this.
You see, I'm setting the text property here, and I'm setting the fontweight property here. For the simple examples, it would've been easier and more compact to use property attributes, but there are complex scenarios where property attributes are a better solution, and that's why they are part of the XAML syntax. Line 29 shows an example of something called a markup extension. It's here, in the property assignment, between these curly braces. These curly braces indicate the start and end of the markup extension. Markup extensions provide a way to run code at runtime to determine what value to assign to the property.
Without markup extensions, I can only have static property values here in the XAML. In this example, I'm using the binding markup extension. At runtime, it will find the tour name property in my data source, and use it for the data value. Finally, line 30 and 31 show a special kind of property attribute, known as an attach property. You can tell it's an attach property by the period in the middle of the property name. Attach properties belong to another element. You see this grid text at the beginning of the name? That's the element that has the column and row property.
What I'm doing here is assigning a value in my textblock that is not used by the textblock. Instead, it is used by a grid element. I know that sounds somewhat confusing, but attach properties are an elegant solution to certain UI composition problems. That brings the short overview of XAML to a close. I've showed you all the basic parts of a XAML file, and how they relate to WPF and dot net principles. I'll explore these relationships, and the mechanics of the XAML system throughout the rest of this XAML series.
- What is XAML?
- What frameworks use XAML?
- Working with XAML and Visual Studio
- Exploring XAML namespaces
- Instantiating objects
- Subscribing to events
- Using XAML in Windows Presentation Foundations, Universal Windows, and more