WPF Tutorial: What is XAML?, XAML and Codebehind, Attribute and Property Element Syntax, XAML File Compilation Process

Introduction to XAML, Attribute and Property Element Syntax, XAML File Compilation Process

Introduction:

In my previous articles i explained various articles on WPF, Asp.Net and Oops Concepts.

        Now we will see importance of XAML in WPF, XAML vs Codebehind, Benefits of Attribute and Property Element Syntax and how the xaml file compiles. You can find other WPF Tutorials here.

Description:

What is XAML?

  XAML called as Zammel stands for Extensible Markup Language. It is declarative language based on XML. It allows us to create UI declaratively which are visible.  It gives flexibility to work individuals on designing and programming at a time. This was introduced in wpf and also used in Silverlight and WF and other technologies which supports XAML. XAML and along with it's powerful binding techniques we can create WPF Applications with less code written.

  XAML vs Codebehind:

Writing Code with XAML is when compare to code behind file.

<grid> <button Name="Btn1" Content="Button" Height="30" Width="90"/> </Grid>

 For the above XAML we can write it in code behind file as below

Grid Obj = new Grid(); Button btn = new Button(); btn.Name = "Btn1"; btn.Content = "Clck Me"; btn.Width = 150; btn.Height = 50; Grid.SetColumn(btn, 0); Grid.SetRow(btn, 0); Obj.Children.Add(btn); this.AddChild(Obj);

Attribute Syntax and Property Element Syntax:

In XAML we can write the code in two ways. i.e  Attribute Syntax and Property Element Syntax.

 Some times it is not possible to specify the property values using Attribute Syntax in that cases We can use Property Element Syntax.

Attribute Syntax and Property Element Syntax:

<!--Property Syntax--> <button Name="Btn1" Content="Button" Height="30" Width="90" Background="LightBlue"/> <!--Attribute Element Syntax--> <button> <Button.Content>Click Me</Button.Content> <Button.Width>150</Button.Width> <Button.Height>40</Button.Height> <Button.Background> <lineargradientbrush> <gradientstop Color="Red" Offset="1"/> <gradientstop Color="Blue" Offset=".1"/> </LinearGradientBrush> </Button.Background> </Button>

 In the above case it is not possible to set background as LinearGradientBrush using Property Syntax so in this case you have to use Attribute Element Syntax as Above.

XAML File Compilation Process:

Every XAML file contains two files i.e XAML and XAML.CS files. When you compile your application it will first Converts XAML file into BAML and cs file into g.cs. For eg your application contains window1.xaml and window1.xaml.cs then compiler converts it to window1.baml and window1.g.cs files. BAML stands for Binary Applicaton markup Language and g stands for generated. Compiler uses BAML and g.cs file to generate executable files.

        BAML is compiled version of XAML so it's not humarn readable format but it is more effcient for loading and parsing at runtme. BAML files are optimized for faster loading at runtime. The g.cs file code to load BAML from executable and create UI. These both fles are stored in Obj\Debug and Obj\Release folder of application's local folder respectively.

Reference :http://msdn.microsoft.com/en-us/library/ms752059.aspx

Conclusion:

I hope you got overview on what is xaml, how xaml file compiles, Attribute Syntax vs Property Element Syntax. It is One of Successive WPF Tutorials, You can find other WPF Tutorials here.

        Don't forget to Comment and Share for our friends if  you like this post. Thank You.