根据上下文动态更改列表框中 uniformgrid 中的列数

Question

我有一个列表框，我想根据上下文（图像大小）在其中设置列。所以如果我有更大的图像，那么我想要更少的列。如果未设置 columns 属性，则它可以正常工作，但如果我有非常宽的图像，则拉伸太大。如果我设置图像的 minWidth 或 minHeight，由于图像大小不同（宽图像中添加了许多空白区域），并不总是能正常工作。所以我的下一个想法是以编程方式设置列数以取决于图像大小。也许有绑定，但我不知道如何将其应用到代码中。

<ListBox SelectionMode="Multiple" Grid.Column="0" x:Name="lvBox" ScrollViewer.HorizontalScrollBarVisibility="Disabled" VerticalAlignment="Top">
                <ItemsControl.ItemsPanel>
                    <ItemsPanelTemplate>
                        <UniformGrid Columns="2" HorizontalAlignment="Stretch"/>
                    </ItemsPanelTemplate>
                </ItemsControl.ItemsPanel>
                <ListBox.ItemContainerStyle>
                    <Style TargetType="{x:Type ListBoxItem}">
                        <Setter Property="Template">
                            <Setter.Value>
                                <ControlTemplate TargetType="ListBoxItem">
                                    <Border Name="Border" Padding="2" SnapsToDevicePixels="true" Background="White" Margin="0">
                                        <ContentPresenter/>
                                    </Border>
                                    <ControlTemplate.Triggers>
                                        <Trigger Property="IsSelected" Value="true">
                                            <Setter TargetName="Border" Property="Background" Value="LightBlue"/>
                                        </Trigger>
                                    </ControlTemplate.Triggers>
                                </ControlTemplate>
                            </Setter.Value>
                        </Setter>
                    </Style>
                </ListBox.ItemContainerStyle>
                <ListBox.ItemTemplate>
                    <DataTemplate>
                        <StackPanel Orientation="Vertical" HorizontalAlignment="Stretch">
                            <Image Name="imageView" Source="{Binding ImageData}" HorizontalAlignment="Stretch" VerticalAlignment="Top" Stretch="UniformToFill" />
                            <TextBlock Text="{Binding TimeStamp}" HorizontalAlignment="Stretch" VerticalAlignment="Bottom"/>
                        </StackPanel>
                    </DataTemplate>
                </ListBox.ItemTemplate>
            </ListBox>

这里有问题，uniformgrid 中的columns 属性没有设置并且图像很宽。图片太小（列太多）。

这里是普通图片的问题，列数直接设置为2，图片太大（列数不够）

知道如何解决这个问题吗？如何在没有硬编码设置 minWidth 或 minHeight 的情况下限制拉伸，或者如何在 C# 中设置列数取决于图像大小。

Answer 1

我找到了适合我的解决方案。我像这样添加 ItemsPanelTemplate 绑定：

<ItemsPanelTemplate>
  <UniformGrid Columns="{Binding Path=Cols}" HorizontalAlignment="Stretch"/>
</ItemsPanelTemplate>

我用Property Change Notification。将 INotifyPropertyChanged 添加到 class，这是其余代码：

private int _cols = 1;
public bool Cols
{
  get => _cols;
}

public event PropertyChangedEventHandler PropertyChanged;
void RaisePropertyChanged(string propertyName)
{
  PropertyChanged?.Invoke(this, new PropertyChangedEventArgs(propertyName));
}

RaisePropertyChanged(nameof(Cols));

当我计算列数时，我设置了 _cols 然后调用 RaisePropertyChanged(nameof(Cols));

根据上下文动态更改列表框中 uniformgrid 中的列数

Dynamically change columns number in uniformgrid inside listbox dependent on context

c#

wpf

listbox

uniformgrid