c# - ListBox 中的 WrapPanel 具有水平和垂直滚动功能

Question

根据https://stackoverflow.com/a/2573386/864101 ，我正在使用这段代码:

<ListBox ScrollViewer.HorizontalScrollBarVisibility="Disabled">
    <ListBox.ItemsPanel>
        <ItemsPanelTemplate>
            <WrapPanel HorizontalAlignment="Center" VerticalAlignment="Center" />
        </ItemsPanelTemplate>
    </ListBox.ItemsPanel>
    <Image Source="http://placehold.it/50x50" Stretch="None"/>
    <Image Source="http://placehold.it/60x50" Stretch="None"/>
    <Image Source="http://placehold.it/70x50" Stretch="None"/>
    <Image Source="http://placehold.it/80x50" Stretch="None"/>
    <Image Source="http://placehold.it/90x50" Stretch="None"/>
    <Image Source="http://placehold.it/100x50" Stretch="None"/>
    <Image Source="http://placehold.it/600x200" Stretch="None"/>
</ListBox>

它是这样的:

我需要水平和垂直滚动条，就像这样(只是使用 HTML 的快速模型):

使用 ScrollViewer.Horizo​​ntalScrollBarVisibility="Disabled" 使图像换行，但禁用水平滚动条，这就是为什么我看不到 600x200 图像的其余部分.

我花了几个小时来解决这个问题，但没有运气，有人可以帮助我吗？

列表框中的图像根据用户输入的不同尺寸进行更新。

Answer 1

添加边距:

<ListBox>
<ListBox.ItemsPanel>
    <ItemsPanelTemplate>
        <WrapPanel MaxWidth="600" HorizontalAlignment="Center" VerticalAlignment="Center" />
    </ItemsPanelTemplate>
</ListBox.ItemsPanel>
<Image Margin ="5" Source="http://placehold.it/50x50" Stretch="None"/>
<Image Margin ="5" Source="http://placehold.it/60x50" Stretch="None"/>
<Image Margin ="5" Source="http://placehold.it/70x50" Stretch="None"/>
<Image Margin ="5" Source="http://placehold.it/80x50" Stretch="None"/>
<Image Margin ="5" Source="http://placehold.it/90x50" Stretch="None"/>
<Image Margin ="5" Source="http://placehold.it/100x50" Stretch="None"/>
<Image Margin ="5" Source="http://placehold.it/600x200" Stretch="None"/>
</ListBox>

也许您需要小于 5 的边距；你试一试。也许还有 600 的其他值。