top button
Flag Notify
Site Registration

explain Nesting of Layout in XAML??

+2 votes
347 views

how to combining Grid Layout + Stack Panel Layout.

posted Nov 14, 2014 by Karthi Kumar

Share this question
Facebook Share Button Twitter Share Button LinkedIn Share Button

1 Answer

+2 votes
 
Best answer

In following example we would be combining Grid Layout + Stack Panel Layout. This would give us effect of Table control and Span Control of HTML.

   <Grid>

    <Grid.RowDefinitions>
        <RowDefinition Height="60"/>
        <RowDefinition Height="40"/>
        <RowDefinition Height="40"/>
        <RowDefinition Height="40"/>
        <RowDefinition Height="40"/>
    </Grid.RowDefinitions>

    <Grid.ColumnDefinitions>
        <ColumnDefinition Width="*"/>
    </Grid.ColumnDefinitions>

    <TextBlock x:Name ="Nesting Layout Demo" 
            FontSize="15" FontWeight="Bold"
            Foreground="Blue"
            Grid.Column="0" Grid.Row="0" Grid.ColumnSpan="3"/>

    <StackPanel Grid.Column="0" Grid.Row="1" Orientation="Horizontal">
        <TextBlock Text="Name" FontSize="25" FontWeight="Bold" />
        <TextBox x:Name="txtName" Text="Query Home" VerticalAlignment="Bottom" Height="76" Margin="0,-21,0,-15" Width="281"/>
    </StackPanel>

    <StackPanel Grid.Column="0" Grid.Row="3" Orientation="Horizontal" Margin="10,30,-10,10" Grid.RowSpan="2">
        <TextBlock Text="City" FontSize="25" FontWeight="Bold" Width="52"/>
        <TextBox x:Name="txtCity" Text="Bangalore" VerticalAlignment="Center" Width="300" Height="70" Margin="0,-30,0,0"/>
    </StackPanel>

    <StackPanel Grid.Column="0" Grid.Row="4" Orientation="Horizontal" Margin="0,66,0,-66">
        <TextBlock Text="State" FontSize="25" FontWeight="Bold"/>
        <TextBox x:Name="txtState" Text="Karnataka" VerticalAlignment="Center" Width="295" Height="70" Margin="0,0,0,-30" RenderTransformOrigin="0.616,0.485"/>
    </StackPanel>

    <StackPanel Grid.Column="0" Grid.Row="4" Orientation="Horizontal" Margin="0,148,0,-148">
        <TextBlock Text="Country" FontSize="25" FontWeight="Bold"/>
        <TextBox Name="txtCountry" Text="India" VerticalAlignment="Center" Width="262" Height="73" Margin="0,0,0,-33"></TextBox>
    </StackPanel>
</Grid>

enter image description here

answer Nov 17, 2014 by Jdk
...