CODEWITHSUNDEEP
wpflistboxstackpanel
Sabuncu
Sabuncu

Reputation: 5274

WPF ListBox with bottom-alignment displays at top within StackPanel

I have the following XAML:

<Window x:Class="test_stacking.MainWindow"
        xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
        xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
        Title="MainWindow" Height="350" Width="525">

    <StackPanel Background="AliceBlue">

        <Canvas Background="Red">
        </Canvas>

        <ListBox Width="200" VerticalAlignment="Bottom">
            <TextBlock Text="One" />
            <TextBlock Text="Two" />
        </ListBox>

    </StackPanel>

</Window>

I would like the Canvas to be on top, and the ListBox to be on the bottom. Since the default orientation for a StackPanel is vertical, I thought I would get the Canvas and the ListBox, in that order, stacked within the StackPanel.

But instead, I get what is shown below: the ListBox is on top, and the Canvas does not show at all. What am I doing wrong?

.NET FW 4 Client Profile, Windows 7, VS 2010.

Upvotes: 0

Views: 361

Answers (2)

Vishal
Vishal

Reputation: 6378

If it is not mandatory to use StackPanel then you can achieve that by using Grid's * sizing.

Here is an example:

<Window x:Class="WpfApplication1.Window1"
        xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
        xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
        Title="Window1" Height="500" Width="500">
    <Grid Background="AliceBlue">

        <Grid.RowDefinitions>
            <RowDefinition Height="*" />
            <RowDefinition Height="Auto" />
        </Grid.RowDefinitions>

        <Canvas Background="Red">
        </Canvas>

        <ListBox Grid.Row="1" Width="200" VerticalAlignment="Bottom">
            <TextBlock Text="One" />
            <TextBlock Text="Two" />
        </ListBox>

    </Grid>
</Window>

Output:

enter image description here

Or

<Window x:Class="WpfApplication1.Window1"
        xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
        xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
        Title="Window1" Height="500" Width="500">
    <Grid Background="AliceBlue">

        <Canvas Background="Red">
        </Canvas>

        <ListBox Width="200" VerticalAlignment="Bottom">
            <TextBlock Text="One" />
            <TextBlock Text="Two" />
        </ListBox>

    </Grid>
</Window>

Output:

enter image description here

Upvotes: 1

Sivasubramanian
Sivasubramanian

Reputation: 965

Since you haven't set any height or width to the canvas, the height and width for the canvas is set to zero and thats why its not shown in the UI.

Try this

<StackPanel Background="AliceBlue">
      <Canvas Background="Red" Width="200" Height="200">
      </Canvas>

       <ListBox Width="200" VerticalAlignment="Bottom">
             <TextBlock Text="One" />
             <TextBlock Text="Two" />
       </ListBox>

</StackPanel>

Upvotes: 1

Related Questions