将项目动态添加到网格 WPF

Question

我有以下“网格”：

<Grid x:Name="ImagesGrid" Grid.Row="1"  >
    <ItemsControl ItemsSource="{Binding FrameViewers}" />
</Grid>

我还有以下 collection 项，共 UserControl 项：

private ObservableCollection<FrameViewer> m_frameViewers = new ObservableCollection<FrameViewer>();

public ObservableCollection<FrameViewer> FrameViewers
{
    get => m_frameViewers;
    set
    {
        m_frameViewers = value;
        OnPropertyChanged();
    }
}

我想将 FrameViewer 动态添加到我的屏幕，使其看起来像附件中的图片：

目前我看到它们是这样垂直排序的：

我可以玩 'Grid' 并向 ItemSource 添加了一个 StackPanel，但随后它们的大小都由标题的长度决定，并附加到Grid

的左侧

我在这里错过了什么？我错过了什么？

Answer 1

默认情况下，ItemsControl 将垂直排列项目。

对于水平布局，您需要将其 ItemsPanel 更改为不同的 ItemsPanelTemplate - 使用水平 StackPanel 或 UniformGrid 之类的东西，具体取决于您希望什么时候发生集合中有超过三个 FrameViewer 项。

有关示例，请参阅 here。

然后您需要将 ItemsControl ItemTemplate 设置为适当的 DataTemplate，以确保每个 FrameViewer 项目都以所需的大小显示。

将项目动态添加到网格 WPF

Dynamically add items to grid WPF

c#

wpf

binding

user-controls

itemsource