Introduction to XAML

For writing XAML code you can use any .NET supporting tool as will explain in the context of .NET.

XAML | Basic

XAML is a little bit similar to the very popular markup language HTML. XAML is nothing but the EXtensible Markup Language XML. XML is also similar to HTML since both markup languages share some base common properties and tags.



The only major difference we can determine is that HTML is a structure based markup language whereas XML is more generic (you can easily use XML for nearly any development work depending on your requirements).

In the past decades developers have used XML for things like:

• Storing application settings
• Data transfer
• Communication medium

For using XML in your development work, first define a schema for declaring the proper name elements and their corresponding related attributes.

XAML is nothing but a special usage of XML. XAML has something to do with defining a user interface in our development work interface. So in this fashion it seems very similar to HTML, but there is a big difference between both of these. XAML is actually used to create instances of classes and sets of values of the properties and their related part.

Example | XAML

This example presents how XAML looks and works.

<Button Name=”PlayAudioButton”
Width=”100”
Height=”70”
HorizontalAlignment =”Left”
VerticalAlignment =”Top”
Background = ”Green” // Green (#99FF00)Click =”PlayAudioButton_Click”
>Play</Button>



Example | C#

The following example uses the C# language to do the same thing so that you can understand the functionality.

Public MainPage()
{
   InitializeComponent()
   Button myButton = new Button();
   myButton.Name = “PlayButton”;
   myButton.Width = 100;
   myButton.Height = 70;
   myButton.HorizontalAlignment = System.Windows.HorizontalAlignment.Left;
   myButton.VerticalAlignment = System.Windows.VerticalAlignment.Top;
   myButton.Background = new SolidColorBrush(Colors.Green);
   myButton.Content = “Pause”;
   ConentPne1.Children.Add(myButton);
}



Type Converters | XAML

A type converter is a class that can translate string values into a strong type. These type converters are widely used in several applications where the .NET framework or related things are used for development.

As I mentioned in the code, you must have noticed that both C# and XAML have a type converter property. In the preceding example System.Windows.HorizontalAlignment.Left is a type converter.

What if you try to change type converters in your XAML code, like:

HorizontalAlignment =”eft”

You will get a compilation error like type converter mismatch. So the right way to write this code line is:

HorizontalAlignment =”Left”