Header Ads

What is XAML?

.NET Framework further extends its feature with XAML. This article will introduce in brief about different things associated with Extensible Application Markup Language (XAML), how we do programming with XAML, using controls like listview, treeview, chart, map with XAML, XAML samples, how to develop applications using XAML, how XAML source looks like, how XAML works with ASP.NET, and much more. In fact, it will serve as good as an XAML wiki for you.

To understand XAML, one needs to have a basic understanding of XML and the concept of classes in .NET.


To begin with, lets discuss some history about the XAML language. XAML is pronounced as 'zammel' by many developers around the world. XAML is a language developed by Microsoft Corporation, as a part of its Open Specification Promise (OSP - This is a promise given by Microsoft in 2006, that it will not assert legal rights on some patents that belong to Microsoft). The XAML language may be used to create structured values and object entities in software programs. It is mainly used in the Microsoft Windows Presentation Foundation (WPF), a set of classes released along with the Microsoft .NET 3.0 Framework.

The magic of XAML is that it communicates like a smooth piece of chocolate with the Common Language Runtime (CLR). Essentially, XAML has two parts, i.e. the XAML Elements and the XAML Properties. The XAML elements have the capability to communicate directly with CLR elements, similarly, XAML properties have the ability to communicate with CLR properties. Wow! XAML is also used in Windows Workflow Foundation (WF).

The markup of XAML is based on XML. This makes it easier for interoperability of XAML across various platforms and paradigms of software design architecture.

XAML works with both C# and VB.NET.

What is a .baml file?

An XAML file whenever compiled in .NET, becomes a file with a .baml extension, which stands for binary XAML. Any .baml file may be easily consumed by a DLL (assembly) in .NET.

How do we use XAML based controls in applications?

Now its getting more interesting, lets see how a simple XAML based component may be inserted in an ASP.NET based web application.

What are the essentials for running XAML based components on the web? Well, the simple answer to this is that the web browser needs to be XBAP compliant. XBAP stands for XAML Browser Application. The simplest way to make a browser XAML compliant is to install the Silverlight Plugin, which ofcourse, is freely available, just like any Adobe Flash plugin that may run .swf files. Important Note here is that XAML based files also work without Silverlight Plugin, in case you are using Internet Explorer 7 or above, and latest version of Firefox. These browsers are compatible with XAML. However, its also important to note here that such XAML files are good enough only for showing visual data in browsers, they can't hold any processed logic inside them as they are not in a compiled form.

As a sample example code below, see how the XAML example works...

<canvas xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation">
<textblock background="YELLOW" foreground="GREEN">The .NET XAML is a language</textblock>

As we see in the XAML code snippet above, 'canvas' is a container in WPF used to hold controls inside it.


Its important for any developer to understand whats the use of XAML. Well, to answer this, the most important significance of XAML is that it makes life a lot easier for developers to create the User Interface of an application, by allowing a simple XML based markup for defining the user interface.

An XAML file separates the UI from the underlying logic in the code behind files. When an XAML based program is compiled, the compiler refers all classes associate with the XAML object, by referring all the partial classes.

A Partial Class is a feature that comes in .NET 2.0 and above, where in classes may be maintained in separate files, but if they have the same name, they get compiled together as one assembly, whenever the application is compiled.

Another advantage of XAML is that it is simple to debug, and it directly represents instances of objects that are of managed type.

What are XAML Object Elements?

There are some definitions relate object elements to structures and classes, XAML attributes to properties/events, and namespaces of XAML to the namespaces of CLR.

In the XAML code example above, we can see that there are 2 objects, namely Canvas and Textbox. Each of these objects are actually instances of the Canvas class and the Textbox class respectively, which ofcourse, is a part of the .NET Framework's library. To be more precise, a part of the WPF set of classes that support XAML. How this works - well when the XAML code is compiled, the compiler, be it CSC or VBC looks for the objects inside the XAML markup, and then creates instances using the classes associated with these objects. This happens for every XAML page that is loaded.

What are XAML Object Property Attributes?

As we can see in the XAML code example above, Foreground and Background are properties of the XAML objects. These entities are actually attributes of XAML objects. Similar to these lines, there may be several different types of XAML properties.

What are XAML Object Property Elements?

Not all features of XAML objects can be expressed as attributes. For this reason, XAML also provides a construct called Property Elements. See the XAML example snippet below:

<textbox .foreground=".foreground">
<solidcolorbrush color="BLACK">

Note here that the Property Element is the SolidColorBrush entity.

Here, there is a significant difference between the interpretation of a normal XML and an XAML markup. For example, an XML interpretation signifies that is simply a markup, where Property is another element under TypeName. However, in XAML, this necessarily implies that Property is actually a property of the TypeName.

What is a markup extension in XAML?

In XAML, markup extensions is a new concept, this is indicated by using a pair of curly braces, and informs the compiler that the XAML markup within the braces needs to be treated like literal string, or a string convertible value. To save to load on instantiation of new objects, a reference to existing objects may be taken. As an example in XAML, the purpose of binding is most commonly achieved using a reference.

Is XAML case sensitive? Yes. Objects, Controls, Names, all used in the XAML markup should have the same case as the underlying class in the .NET library.

What is the x: prefix?

The x: prefix is actually used to map XAML XML namepace defined at http://schemas.microsoft.com/winfx/2006/xaml. The x: prefix/XAML XML namepace contain several programming constructs that will be used quite frequently in XAML. The following is a listing of the most common x: prefix/XAML namespace programming constructs...

x:Key: Sets a unique key for each resource in a ResourceDictionary. x:Key will probably account for 90% of the x: usages you will see in your application's markup.

x:Class: Specifies the CLR namespace and class name for the class that provides code-behind for a XAML page. You must have such a class to support code-behind, and it is for this reason that you almost always see x: mapped, even if there are no resources.

x:Name: Specifies a run-time object name for the instance that exists in run-time code after an object element is processed. You use x:Name for cases of naming elements where the equivalent WPF framework-level Name property is not supported. This happens in certain animation scenarios.

x:Static: Enables a value reference that gets a static value that is not otherwise a XAML-compatible property.

x:Type: Constructs a Type reference based on a type name. This is used to specify attributes that take Type, such as Style..::.TargetType, although in many cases the property has native string-to-Type conversion such that the x:Type usage is optional.

How does an XAML file relate to a code behind class?

The relationship between an XAML file and a code behind class, may easily be established in the root of the XAML file. This is done by the x:Class attribute. See XAML example below:

<page x:class="SomeNamespace.SomePageCode" xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml" xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation">
<linkbutton click="ClickHandler">Creating applications with XAML</linkbutton>

Similar to a TextBox, a LinkButton, several other controls in ASP.NET and winforms may be used with XAML and create beautiful attractive looking applications, with a separate layer for the UI altogether, like XAML gridviews, menus, listviews, frames and more.

Hope you had a nice time reading the introduction to XAML. There are several XAML books available around.

No comments:

Powered by Blogger.