XAML

WPF user interfaces are built using a declarative markup language called XAML. XAML declares the controls that will
make up the interface. An opening angle bracket (<) followed by the name of the control type and a closing bracket
define the control. For example, the following markup defines a button control inside a Grid.
<Grid>

<Button/>

</Grid>
Notice the Grid needs a formal closing tag because it contains the Button control. Since the Button control does not contain any other elements, you can use a forward slash (/) in front of the end bracket to close it
The next step is to define the properties of the controls. For example, you may want to set the background colour of the button to red and write some text on it. The properties of the control are set by using attribute syntax, which consists of the property name followed by an equal sign and the attribute value in quotation marks. The following mark-up shows the Button control with some attributes added:

<Grid>
<Button Content="Click Me" Background="Red"/>
</Grid>
For some properties of an object element a syntax known as property element syntax is used. The syntax for the property element start tag is <typeName.propertyName>. For example, you can create rows and columns in the layout grid to control placement of controls in the grid, as shown:

<Grid.ColumnDefinitions>
<ColumnDefinition Width="100" />
<ColumnDefinition Width="*" />
</Grid.ColumnDefinitions>
<Grid.RowDefinitions>
<RowDefinition Height="25" />
<RowDefinition Height="25" />
<RowDefinition Height="25" />
</Grid.RowDefinitions>
Controls are positioned in the grid by including a Grid.Rowand Grid.Columnattribute, as shown:
<Label Grid.Column="0" Grid.Row="0" Content="Name:" />
<Label Grid.Column="0" Grid.Row="1" Content="Password:" />
<TextBox Name="txtName" Grid.Column="1" Grid.Row="0"/>
<TextBox Name="txtPassword" Grid.Column="1" Grid.Row="1"/>
<Button Grid.Column="1" Grid.Row="3"
Content="Click Me" HorizontalAlignment="Right"
MinWidth="80" Background="Red"/>