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:




       xmlns:d="" xmlns:mc="" mc:Ignorable="d"




       Width="640" Height="480">     

    <Grid x:Name="LayoutRoot">

        <Grid Background="White">


                <RowDefinition Height="0.238*"/>

                <RowDefinition Height="0.238*"/>

                <RowDefinition Height="0.238*"/>

                <RowDefinition Height="0.238*"/>



                <ColumnDefinition Width="0.244*"/>

                <ColumnDefinition Width="0.244*"/>

                <ColumnDefinition Width="0.244*"/>

                <ColumnDefinition Width="0.244*"/>




                    <ScaleTransform ScaleX="1.6" ScaleY="1.95"/>









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:

<Image  Source="1339750960_twitter follow me.png"  Grid.Row="0" Grid.Column="0"/>
<Image  Source="1339750960_twitter follow me.png"  Grid.Row="1" Grid.Column="1"/>
<Image  Source="1339750960_twitter follow me.png"  Grid.Row="2" Grid.Column="2"/>
<Image  Source="1339750960_twitter follow me.png"  Grid.Row="3" Grid.Column="3"/>

Step 7

 Press F5 and see the Result as shown below:



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