首页 > 解决方案 > How can I force ListBoxItems to display inline in XAML

问题描述

<ListBox Background="Black" ScrollViewer.VerticalScrollBarVisibility="Auto">
    <ListBox.ItemsPanel>
        <ItemsPanelTemplate>
            <StackPanel Orientation="Horizontal"/>
        </ItemsPanelTemplate>
    </ListBox.ItemsPanel>
    <ListBoxItem Background="White" Width="150" Height="200" VerticalAlignment="Top" HorizontalAlignment="Left" Margin="5">Item0</ListBoxItem>
    <ListBoxItem Background="White" Width="150" Height="200" VerticalAlignment="Top" HorizontalAlignment="Left" Margin="5">Item1</ListBoxItem>
    <ListBoxItem Background="White" Width="150" Height="200" VerticalAlignment="Top" HorizontalAlignment="Left" Margin="5">Item2</ListBoxItem>
    <ListBoxItem Background="White" Width="150" Height="200" VerticalAlignment="Top" HorizontalAlignment="Left" Margin="5">Item3</ListBoxItem>
    <ListBoxItem Background="White" Width="150" Height="200" VerticalAlignment="Top" HorizontalAlignment="Left" Margin="5">Item4</ListBoxItem>
    <ListBoxItem Background="White" Width="150" Height="200" VerticalAlignment="Top" HorizontalAlignment="Left" Margin="5">Item5</ListBoxItem>
    <ListBoxItem Background="White" Width="150" Height="200" VerticalAlignment="Top" HorizontalAlignment="Left" Margin="5">Item6</ListBoxItem>
    <ListBoxItem Background="White" Width="150" Height="200" VerticalAlignment="Top" HorizontalAlignment="Left" Margin="5">Item7</ListBoxItem>
</ListBox>

This code above produces this Image below. enter image description here

But I want to create something like this image below. Where the box breaks down to the next line at the end of it's parent control. And I want to achieve this using XAML (and C# if required) enter image description here

标签: c#xaml

解决方案


只需将您的 ItemsPanelTemplate 更改为

<ItemsPanelTemplate>
    <WrapPanel MaxWidth="800" Orientation="Horizontal"/>
</ItemsPanelTemplate>

推荐阅读