WrapPanel具有水平和垂直方向

Question

我有一个ListBox，它包含三种不同大小的项目类型。 物品＆＃39;高度如下：

• 178x100px
• 100x100px
• 100x178px

我想要项目的布局，它们之间没有填充或边距。

但我得到了这个结果：

高度/宽度不同的物品之间存在差距。

我想要做的是删除这些项目之间的这个边距，并将它们紧挨着彼此，但我不知道要使用哪个面板或样式。

这是ListBox的XAML。这些项是视图模型的一部分，其枚举代表纵横比（16：9,1：1,9：16）

<ListBox x:Name="previewList">
    <ListBox.ItemsPanel>
        <ItemsPanelTemplate>
            <WrapPanel Width="525" IsItemsHost="True"/>
        </ItemsPanelTemplate>
    </ListBox.ItemsPanel>

    <ListBox.ItemTemplate>
        <DataTemplate>
            <Grid Height="{Binding Path=previewSize, Converter={StaticResource sizeConverter}, ConverterParameter={StaticResource True}}"
                  Width="{Binding Path=previewSize, Converter={StaticResource sizeConverter}, ConverterParameter={StaticResource False}}" Background="Blue">

            </Grid>
        </DataTemplate>
    </ListBox.ItemTemplate>
    <ListBox.ItemContainerStyle>
        <Style TargetType="{x:Type ListBoxItem}">
            <Setter Property="Padding"
            Value="0"/>
        </Style>
    </ListBox.ItemContainerStyle>
</ListBox>

Answer 1

Tokfrans，

您需要删除ListViewItems上的边框。

1. 创建ListViewItemStyle资源（您可以右键单击列表框/编辑其他模板/编辑副本）



1. 创建的XAML遵循BorderThickness的手动修改：

编辑：** **抱歉XAML解决方案不可见！

op =

并将样式分配给ListBox：

<Window.Resources>
    <Style x:Key="ListBoxItemStyle1" TargetType="{x:Type ListBoxItem}">
        <Setter Property="Padding"
            Value="0"/>
        <Setter Property="BorderThickness"
            Value="0"/>
    </Style>
</Window.Resources>

此致

Answer 2

各种控件的标准样式通常都有一个小的（1-2像素）内置边距和/或填充。我猜这就是你在这里看到的。您可以尝试通过以下方式解决此问题：

1. 设置零或甚至负填充和/或保证金（您必须测试看起来正确的内容）。
2. 创建自己的ControlTemplate，删除内置边距/填充。