CODEWITHSUNDEEP
.netsilverlightxaml
IEnumerable
IEnumerable

Reputation: 3790

Space items evenly on a stackpanel -Silverlight

I have a <StackPanel> control that I am populating with a TextBox controls.

I want to Vertically space evenly the TextBox objects. However with my code all three TextBoxes are still grouped at the top of the <StackPanel> even though I have set VerticalAligment to Stretch.

Also not sure if this helps, my LayoutRoot is a Grid 8 x 8 and the border alignes to fill most of the LayoutRoot

I cant manually assign a margin to each text box either as the StackPanel will be populated manually and the number of TextBoxes can vary.

    <Border  
        Grid.Row="1" 
        Grid.RowSpan="6"
        Grid.Column="0"
        Grid.ColumnSpan="8"
        BorderBrush="Black"
        Background="White">

            <StackPanel x:Name="listItems" 
                Grid.Row="1" 
                Grid.RowSpan="6"
                Grid.Column="0"
                Grid.ColumnSpan="8"
                Margin="10"

                HorizontalAlignment="Left"
                VerticalAlignment="Stretch">

                   <TextBox Text="line 1" />
                   <TextBox Text="line 2" />
                   <TextBox Text="line 3" />

            </StackPanel>

    </Border>

Upvotes: 0

Views: 2912

Answers (2)

har07
har07

Reputation: 89285

You can use UniformGrid to achieve that evenly distributed vertical space with dynamic number of TextBlocks. For example :

XAML :

<UniformGrid x:Name="listItems" 
    Grid.Row="1" 
    Grid.RowSpan="6"
    Grid.Column="0"
    Grid.ColumnSpan="8"
    Margin="10"
    HorizontalAlignment="Left"/>

Code-behind :

//populate the UniformGrid dynamically from code :
int numberOfRow = 3;
listItems.Columns = 1;
listItems.Rows = numberOfRow;
for (int i = 0; i < numberOfRow; i++)
{
    var txt = new TextBlock { Text = "test " + i };
    listItems.Children.Add(txt);
}

Upvotes: 2

Rob J
Rob J

Reputation: 6629

Take a look at this link: http://blogs.msdn.com/b/devdave/archive/2008/07/26/layout-fundamentals-part-2-layout-containers.aspx It does a really good job of explaining the Silverlight layout panels and their options. I would use a grid with vertical alignment of stretch and grid row definitions of no height set as this will evenly divide the available space between the grid rows for you. Something like so:

<Border  
    Grid.Row="1" 
    Grid.RowSpan="6"
    Grid.Column="0"
    Grid.ColumnSpan="8"
    BorderBrush="Black"
    Background="White">

        <Grid x:Name="listItems" 
            Grid.Row="1" 
            Grid.RowSpan="6"
            Grid.Column="0"
            Grid.ColumnSpan="8"
            Margin="10"

            HorizontalAlignment="Left"
            VerticalAlignment="Stretch">
            <Grid.RowDefinitions>
               <RowDefinition />
               <RowDefinition />
               <RowDefinition />
            </Grid.RowDefinitions>

               <TextBox Grid.Row="0" Text="line 1" />
               <TextBox Grid.Row="1" Text="line 2" />
               <TextBox Grid.Row="2" Text="line 3" />

        </Grid>

</Border>

Upvotes: 1

Related Questions