Logo Questions Linux Laravel Mysql Ubuntu Git Menu
 

How to divide stackpanel in 7 equal height rectangles

I am working on Windows Phone 8 app wherein I have a Stackpanel and I want to put 7 rectangles in it. I want those rectangles to be of equal height irrespective of screen size. I tried setting Height="*" but it is giving error.

        <StackPanel>
            <Rectangle Fill="Violet" Height="*"></Rectangle>
            <Rectangle Fill="Indigo" Height="*"></Rectangle>
            <Rectangle Fill="Blue" Height="*"></Rectangle>
            <Rectangle Fill="Green" Height="*"></Rectangle>
            <Rectangle Fill="Yellow" Height="*"></Rectangle>
            <Rectangle Fill="Orange" Height="*"></Rectangle>
            <Rectangle Fill="Red" Height="*"></Rectangle>
        </StackPanel>

Can anyone help me with it?

like image 292
MaxRecursion Avatar asked Feb 20 '26 07:02

MaxRecursion


1 Answers

The following should do it for you:

<Grid HorizontalAlignment="Stretch" VerticalAlignment="Stretch">
    <Grid.RowDefinitions>
        <RowDefinition Height="*">
        <RowDefinition Height="*">
        <RowDefinition Height="*">
        <RowDefinition Height="*">
        <RowDefinition Height="*">
        <RowDefinition Height="*">
        <RowDefinition Height="*">
    <Grid.RowDefinitions>

    <Rectangle Fill="Violet" Grid.Row="0" />
    <Rectangle Fill="Indigo" Grid.Row="1" />
    <Rectangle Fill="Blue" Grid.Row="2" />
    <Rectangle Fill="Green" Grid.Row="3" />
    <Rectangle Fill="Yellow" Grid.Row="4" />
    <Rectangle Fill="Orange" Grid.Row="5" />
    <Rectangle Fill="Red" Grid.Row="6" />
</Grid>

There is also a UniformGrid that can do this for you:

<UniformGrid Columns="1" Rows="7" />
like image 102
dotNET Avatar answered Feb 22 '26 00:02

dotNET



Donate For Us

If you love us? You can donate to us via Paypal or buy me a coffee so we can maintain and grow! Thank you!