XAML Application Basics

Learn XAML

If you’ve seen “Avalon” demos, then = you know that it is often developed with using a specialized form of XML called= <= span style=3D'font-family:Verdana'>XAML.

It is possible to write “Avalon” to the ba= re metal using code (C#, VB, or your favorite CLS-Compliant-Language of choice= ), however the designers of the Avalon libraries have optimized the “feel” of their APIs for <= span style=3D'font-family:Verdana'>XAML – sometimes this is just shortened to the word “markup”. Charles Petzold has an interesting discussion <= span style=3D'font-family:Verdana'>here about when to use what.

Some XAML you gotta know

<= o:p>

&= lt;!-- Window1.xaml -->

<Window

xm= lns= =3D"http://schemas.microsoft.com/winfx/2006/xaml/presentat= ion"

<= span style=3D'mso-spacerun:yes'> xm= lns:x= =3D"http://schemas.microsoft.com/winfx/2006/xaml&qu= ot;

<= span style=3D'mso-spacerun:yes'> x:Class= =3D"WindowsApp= lication1.Window1"

Title=3D"Main Window"

&= nbsp; >

What is xmlns?

Definition from W3C:

XML namespaces provide a simple method for qualifying element and attribute names used in Extensible Markup Language documents by associating them with namespaces identified by URI references.

By bringing in custom xml namespaces, we essentially bring in another set of “valid” XML element types and attribute names.

xm= lns= =3D"http://schemas.microsoft.com/winfx/2006/xaml/presentat= ion"

This pulls in the XML schema for the Windows Presentat= ion Foundation itself. By setting= this as the default XML namespace, we can just create <Button> without prepending it with anything silly like <wpf:Button>.

xm= lns:x= =3D"http://schemas.microsoft.com/winfx/2006/xaml&qu= ot;

This brings in XAML keywords, markup extensions (the f= unny stuff you’ll sometimes see in curly braces). Interesting x: stuff includes

“x:Key” for setting keys in a resource dictionary

“x:Static” for fetching statics off a= CLR class

“x:Class” for associating a codebehin= d

“x:Type” for specifying a type

“x:Null” for setting something to nul= l in XAML

x:Class=3D"WindowsApplication1.Window1"

This helps the XAML compiler to find the associated code-behind – in this case it would look for WindowsApplication1.Wind= ow1 as its codebehind file.

Title=3D"Main Window"

Finally an easy one: this one sets the title for the window to say “Main Window”.

Bringing in your own objects to the XAML party

It is possible to create any CLR type within XAML. You just need to learn the equival= ent of the “using” statement in XAML.

&= lt;!-- Window1.xaml -->

<Window x:Class=3D"WindowsApplication1.Window1"

xm= lns= =3D"http://schemas.microsoft.com/winfx/2006/xaml/presentat= ion"

<= span style=3D'mso-spacerun:yes'> xm= lns:x= =3D"http://schemas.microsoft.com/winfx/2006/xaml&qu= ot;

xmlns:local=3D"clr-namespace:WindowsA= pplication1"

<local:MyBut= ton>Moo</<= span style=3D'color:maroon'>local:MyButton>=

</Window>

= // Window1.xaml.cs

namespace WindowsApplication1 {=

public cla= ss MyButton : System.Windows.Controls.Button {

}

Note that the use of “local” is a matter of choice – it’s what you’ll use to prefix your elements from that namespace. We could have replaced all the “local” strings with “foo” or “WindowsApplication1” and it would have worked.

Bringing in c= ustom objects from another assembly

When you bring in an object from another assembly, you= have to specify the particular assembly in the xmlns assignment. As usual, you also have to add a reference to the assembly in your Visual Studio project.

&= lt;Window x:Class=3D"WindowsApplication1.Window1"

xm= lns= =3D"http://schemas.microsoft.com/winfx/2006/xaml/presentat= ion"

<= span style=3D'mso-spacerun:yes'> xmlns:x= =3D"http://schemas.microsoft.com/winfx/2006/xaml&qu= ot;

<= span style=3D'mso-spacerun:yes'> xmlns:sys= =3D"clr-namespace:System;assembly=3DSystem"=

<= span style=3D'mso-spacerun:yes'> >

<= span style=3D'mso-spacerun:yes'> <ListBox&= gt;

<= span style=3D'mso-spacerun:yes'> <sys:String&= gt;One</sys:String>

<= span style=3D'mso-spacerun:yes'> </ListBox&= gt;

</Window&= gt;

Talking to El= ements Defined in XAML From Code

If you name your elements in your XAML file, you can a= ccess them as if they were member variables on the class.

&= lt;!-- Window1.xaml -->

&= lt;Window = x:= Class= =3D"WindowsApplication14.Window1"

xm= lns= =3D"http://schemas.microsoft.com/winfx/2006/xaml/presentat= ion"

<= span style=3D'mso-spacerun:yes'> xmlns:x= =3D"http://schemas.microsoft.com/winfx/2006/xaml&qu= ot;

<= span style=3D'mso-spacerun:yes'> Ti= tle= =3D"WindowsApplication14"

<= span style=3D'mso-spacerun:yes'> >=

<= span style=3D'mso-spacerun:yes'> <Canvas&= gt;

<= span style=3D'mso-spacerun:yes'> <TextBox = Na= me= =3D"textBox1">&l= t;/TextBox>

<= span style=3D'mso-spacerun:yes'> </Canvas&= gt;

&= lt;/Window&= gt;

<= /o:p>

From code:

= // Window1.xaml.cs

textBox1.Text =3D "Hello World!";

<= /o:p>

You can either write this code in the constructor, or = you can use the “Loaded” event instead.

Option 1: Hooking onto the Loaded event from XAML

<= o:p>

<!-- Window1.xaml -= ->

<Window = x:= Class= =3D"WindowsApplication14.Window1"

xmlns=3D"http://schemas.microsoft.com/winfx/2006/xaml/presentat= ion"

<= span style=3D'mso-spacerun:yes'> xmlns:x=3D"http://schemas.microsoft.com/winfx/2006/xaml"

Ti= tle= =3D"WindowsApplication14"

Loaded=3D"OnWindowLoaded"

<Canvas&= gt;

<TextBox = Na= me= =3D"textBox1">&l= t;/TextBox>

</Canvas&= gt;

</Window&= gt;

= // Window1.xaml.= cs<= o:p>

private void = OnWindowLoaded(object sender, Route= dEventArgs e) {

= textBox1.Text =3D "Hello World!&qu= ot;;

}

Option 2: Hooking onto the Loaded event from code

public Window1() {

= InitializeComponent();

<= span style=3D'mso-spacerun:yes'> = this.Loaded +=3D new RoutedEventHandler(OnWindowLoaded);

}

void OnWindowLoaded(object send= er, RoutedEventArgs e) {

= textBox1.Text =3D "Hello World!&qu= ot;; =

}

Tools for Editing XAML

Microsoft Expression codenamed “Sparkle”

Visual Studio codename “Orcas” de= signer codenamed “Cider”

XamlPad

XamlCru= ncher (Petzold)

Application and MyApp.xaml

“Avalon” has three kinds of application st= yles – a simple Application (Window-based, just like windows forms), a NavigationApplication (page based, just like Microsoft Money or a website), and a DocumentApplication (specialized sub-set of NavigationApplication for displaying content).

An “Avalon” application can either be run = in two modes: Express (run from brows= er) and Installed (behaves like cl= assic Windows applications). Just l= ike Windows Forms, “Avalon” works with ClickOnce for installation.<= /p>

Files in a si= mple Application

If you create a new “Windows Application (WPF)&#= 8221; in Visual Studio, you’ll get several files:

Application declaration in xaml

Application code behind – application startup events and so on

Window declaration in xaml

Window code behind – event handlers and so on

MyApp.xaml and its codebehind file are most like the Program.cs from a C# Windows Forms application. This is where you’ll put any= thing that applies to the entire application – typically you may want to associate resources, styles to be shared between all your Windows in your a= pplication.

Where is Application.Run?

Believe it or not, “Avalon” has an Application.Run too – to find it we need to talk about what happens w= hen you build XAML.

When you build Avalon takes the .xaml and generates a = set of files that are then compiled in to the exe. For <Name>.xaml the follo= wing are generated:

<Name>.baml

Binary version of the .xam= l file. Compiled into the .exe as a resource

<Name>.g.cs (or .g.vb)

Partial class that is comb= ined with <Name>.xaml.cs (or .vb). Contains initialization code that does = the following:

§§§Peeking at My= App.g.cs

[ST= AThread()]

public static= int Main(string[] args) {

= WindowsApplication22.MyApp app =3D new WindowsApplication22.MyApp();

= app.InitializeComponent();

= return app.Run(args);

}

So if Main is= in an automatically generated class how do I add stuff to Main?

You can hook the StartingUp event on Application to add custom logic.

<!-- MyApp.XAML -= ->

&= lt;Application = x:= Class= =3D"WindowsApplication22.MyApp"

<= span style=3D'mso-spacerun:yes'> xmlns= =3D"http://schemas.microsoft.com/winfx/2006/xaml/presentat= ion"

<= span style=3D'mso-spacerun:yes'> xmlns:x= =3D"http://schemas.microsoft.com/winfx/2006/xaml&qu= ot;

<= span style=3D'mso-spacerun:yes'> StartupUri= =3D"Window1.xaml"

<= span style=3D'mso-spacerun:yes'> Startup=3D"OnApplicationStartingUp"<= /span>

<= span style=3D'mso-spacerun:yes'> >=

<= span style=3D'mso-spacerun:yes'> <Application.Resources&= gt;

<= span style=3D'mso-spacerun:yes'>

<= span style=3D'mso-spacerun:yes'> </Application.Resources&= gt;

&= lt;/Application&= gt;

// MyApp.xaml.cs

public<= /span> partial class= MyApp : Application<= /span> {

private void = OnApplicationStartingUp= (object sender,

= &nb= sp; = &nb= sp; StartupEventArgs e) {

= if (e.Args.Length =3D=3D 1 &&a= mp; e.Args[0] =3D=3D "/?") {=

= MessageBox.Show("Help!");

= }

}