Section 3.1. Core XAML Syntax


3.1. Core XAML Syntax

XAML generally follows XML syntax rules, just as any other XML-based markup language does. Each XAML element has a name and one or more attributes. Attributes correspond directly to object properties, and the name of the XAML element exactly matches the name of a CLR class definition.

XAML is pure markup, which means that while the names of event handlers are specified as attributes, you must implement the actual logic of the event handler in code. If you're familiar with ASP.NET programming techniques, then you'll be familiar with the term codebehind, which refers to the code "behind" a XAML interface element that is responsible for providing application logic such as event handlers. It can be implemented in either C# or VB.NET. In both cases, the code can be placed inline in the XAML file, although this contradicts best practices in separating the presentation and application logic layers.

How does this work? Every event in XAML can be assigned to a codebehind handler, which is implemented in a supported .NET language. For example, it's a common task to do something when a Button is clicked. So, first a Button is declared with the XAML code shown in Example 3-1.

Example 3-1. XAML Button declaration

     <Button         OnClick="ButtonClickedHandler"         Name="MyButton"         Width="50"         Content="Click Me!" /> 

Then, a corresponding codebehind handler is declared, and, when the Button is clicked, the handler is automatically executed (Examples 3-2 and 3-3).

Example 3-2. Button OnClick handler in C#

     void ButtonClickedHandler(object sender, RoutedEventArgs eventArgs)     {           MyButton.Width = 100;           MyButton.Content = "Thank you!";     } 

Example 3-3. Button OnClick handler in VB.NET

     Sub ButtonClickedHandler(ByVal sender As Object,                              ByVal eventArgs as RoutedEventArgs)         MyButton.Width = 100         MyButton.Content = "Thank you!"     End Sub 

In both Examples 3-2 and 3-3, the handler will change the width of the Button from 50 to 100 and change the text displayed on it from "Click Me!" to "Thank you!". All XAML attributes can be manipulated within code because they are simply XML representations of actual CLR class attributes. You could just as easily change the button's background color, height, and even its position in code, just as you could in a traditional Windows application.

It is also acceptable to inline code in the XAML file by specifying the <x:Code> element. All inline code must be enclosed in the <CDATA[...]]> tag to ensure that the parser does not try to interpret the code. The XAML code from Example 3-1 and the C# code from Example 3-2 yield Example 3-4.

Example 3-4. Inlining code within a XAML file

     <Button         OnClick="ButtonClickedHandler "         Name="MyButton "         Width="50 "         Content="Click Me! " />           <x:Code>       <![CDATA          void ButtonClickedHandler(object sender, RoutedEventArgs eventArgs)         {           MyButton.Width = 100 ;           MyButton.Content = "Thank you! ";         }       ]]>      </x:Code> 

Application developers familiar with C# or VB.NET will immediately grasp the concept of codebehind and inline code and will be able to apply their existing skills to develop the code that drives the application.

XAML developers need to be aware that in order for application logic developers to access specific XAML elements, the elements must be named using either the Name or ID attribute. Developers will use one of these attributes to reference and manipulate the element directly from code. In Example 3-1, the Button's Name attribute was declared as MyButton. The same name was then used in both code examples to reference and directly access the object.

There are three basic rules to follow when declaring XAML elements:

  • XAML is case-sensitive. Element and attribute names must be properly cased

  • All attribute values, regardless of data type, must be enclosed in double quotes

  • The resulting XML must be well-formed

The basic syntax for declaring XAML elements and attributes is:

     <ElementName AttributeName="Value" AttributeName="Value" ... /> 

A simple login user interface, as shown in Figure 3-1, could be described with the code in Example 3-5, which illustrates these basic rules. Note the careful attention to case in declaring elements and attributes, the enclosure of all attribute values (regardless of underlying data type) in double quotes, and the fact that all elements are well-formed and closed with an end tag.

Figure 3-1. A simple user-login XAML page


Example 3-5. A simple login user interface

     <StackPanel         xmlns="http://schemas.microsoft.com/winfx/avalon/2005"         HorizontalAlignment="Left"         Margin="10">         <Label             Margin="5"             Content="Username" />         <TextBox             Margin="5"             BorderBrush="Blue"             BorderThickness="1"             Background="AliceBlue"             Foreground="Black"             Width="200"/>         <Label             Margin="5"             Content="Password" />         <PasswordBox             Margin="5"             BorderBrush="Blue"             BorderThickness="1"             Background="AliceBlue"             Foreground="Black"             Width="200" />         <Button             Margin="10"             Background="AliceBlue"             Foreground="Black"             Width="100"             Height="20"             Content="Submit" />     </StackPanel> 

Formatting is a matter of style and corporate standards. The format for the examples in this book was chosen because it is readable and clearly displays the nesting of elements in more complex markup. Elements can be declared all on one line, or attribute declarations can be split across lines; formatting is completely up to you. Because XAML is compiled into BAML before deployment, the amount of space taken up by elements in a XAML file is irrelevant. There are no advantages to using less space by declaring elements on a single line and no disadvantages to the formatting used in this book. The elements will become binary representations before deployment, and the whitespace will have no impact on the footprint of finished applications.

Clearly, XAML is comprised of elements and their attributes. The rest of this chapter will examine each of these concepts in depth.




XAML in a Nutshell
XAML in a Nutshell (In a Nutshell (OReilly))
ISBN: 0596526733
EAN: 2147483647
Year: 2007
Pages: 217

flylib.com © 2008-2017.
If you may any questions please contact us: flylib@qtcs.net