Use of Grid in Expression Blend 4

Step 1

Open Expression Blend 4 -> Select WPF -> Select WPF Application -> Change Name and Location accordingly -> hit OK, a Blank Window appears on ArtBoard.

Step 2

Select ToolBox -> Select Grid, draw Grid as shown below:

Step 3

When we Insert Grid on Artboard the XAML take's place automatically as shown below:

<Window

xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"

xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"

xmlns:d="http://schemas.microsoft.com/expression/blend/2008" xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006" mc:Ignorable="d"

x:Class="Grid1.MainWindow"

x:Name="Window"

Title="MainWindow"

Width="640" Height="480">

<Grid.RowDefinitions>

</Grid.RowDefinitions>

<Grid.ColumnDefinitions>

</Grid.ColumnDefinitions>

<Grid.LayoutTransform>

</TransformGroup>

</Grid.LayoutTransform>

</Grid>

</Window>

Step 4

Here, Grid is divided into Row's and Columns automatically as shown above. We can manage the Height-Width, Margin, Alignment, Orientation Padding as shown above.

Note: Here, when we Insert Row's-Column's the Default Value of Width-Height is set .

Step 5

Select any Image from Folder according to your choice, apply Copy-Paste Command, Insert Image according to your choice in the Grid as shown below:

Note: When we select Image Copy the Image in the Grid1 File as shown above.

Step 6

Here, when we Insert Image we can Define the Position of Row-Column according to our choice for the Insertion of Image as shown below:

Step 7

Press F5 and see the Result as shown below:

Summary

Through this Article we can learn the use of Grid in Expression Blend 4.