Horizontal ListBox items vertical layout

Question

I have horizontal ListBox. Here is code for it (removed some irrelevant):

            <ListBox Grid.Row="1"
                     ItemContainerStyle="{StaticResource ListBoxUnselectableItemStyle}"
                     ItemsSource="{Binding ...}"
                     BorderThickness="0"
                     Background="{x:Null}"
                     ScrollViewer.CanContentScroll="False">

                <ListBox.ItemsPanel>
                        <ItemsPanelTemplate>
                            <StackPanel Orientation="Horizontal"
                                        VerticalAlignment="Top"
                                        HorizontalAlignment="Center"
                                        Background="Red"/>
                        </ItemsPanelTemplate>
                </ListBox.ItemsPanel>
            </ListBox>

And I get items' layout behavior like this: ]

As you can see, second item is smaller, and VerticalLayout is not Top as I want.

Can anybody help me?

Answer 1

HorizontalAlignment and VerticalAlignment refer to how the StackPanel is aligned within its parent container.

You probably need to be looking at ItemContainerStyle, where you would set VerticalAlignment to Stretch (so that the ListBoxItem occupies the full height of the ListBox), and VerticalContentAlignment to Top (so that the content of the ListBoxItem is aligned to the top of the ListBoxItem).