在列表框中绑定项目控件

Question

我想将我的itemscontrol绑定到列表框中，但是不起作用。 我想用堆栈样式向列表框添加一些FrameworkElement。

这是我的XAML代码：

<ListBox x:Name="listThemes">
            <ListBox.ItemTemplate>
                <DataTemplate>
                    <Grid Margin="5">
                        <Grid Grid.Column="1">
                            <Grid.RowDefinitions>
                                <RowDefinition Height="Auto" />
                                <RowDefinition Height="Auto" />
                            </Grid.RowDefinitions>
                            <TextBlock Text="{Binding Title}" FontWeight="Bold" />
                            <StackPanel Grid.Row="1" >
                                <ItemsControl  Width="Auto"
                                               Height="Auto"
                                               ItemsSource="{Binding ElementName=listThemes, Path=Items}">
                                </ItemsControl>
                            </StackPanel>
                        </Grid>
                    </Grid>
                </DataTemplate>
            </ListBox.ItemTemplate>
</ListBox>

我不知道如何在ListBox中绑定ItemsControl。 我尝试推出ItemsControl的Binding ElementName，但它总是崩溃。 如果ElementName是页面名称，则无法使用。

测试等级：

public class Testing
{
    public string Title { get; set; }
    public ObservableCollection<FrameworkElement> Items { get; set; }
}

C＃代码：

        observableCollection = new ObservableCollection<FrameworkElement>();

        for (int i = 0; i < 3; i++)
        {
            observableCollection.Add(new Button { Content = i.ToString() });
            observableCollection.Add(new Canvas
            {
                Background = new ImageBrush()
                {
                    ImageSource = new BitmapImage(new Uri(@"Assets/ApplicationIcon.png", UriKind.Relative)),
                    Stretch = System.Windows.Media.Stretch.Fill
                },
                Height = 100,
                Width = 100
            });
        }

        List<Testing> list = new List<Testing>();
        for (int i = 0; i < 3; i++)
        {
            Testing test = new Testing();
            test.Title = "Testing";
            test.Items = observableCollection;

            list.Add(test);
        }

        listThemes.ItemsSource = list;

Answer 1

首先，它崩溃是因为您在三个不同的项目上绑定了相同的元素。 一个框架元素不能附加在两个不同的控制之下。 因此，应将ObservableCollection放置在List<Testing>创建过程中。

其次，应该将DataContext设置到listThemes控件，以便其项可以找到要绑定的正确数据路径，然后可以删除ElementName 。

试试这些代码。

List<Testing> list = new List<Testing>();
for (int i = 0; i < 3; i++)
{
    Testing test = new Testing();
    test.Title = "Testing";

    var observableCollection = new ObservableCollection<FrameworkElement>();

    for (int j = 0; i < 3; i++)
    {
        observableCollection.Add(new Button { Content = j.ToString() });
        observableCollection.Add(new Canvas
        {
            Background = new ImageBrush()
            {
                ImageSource = new BitmapImage(new Uri(@"Assets/ApplicationIcon.png", UriKind.Relative)),
                Stretch = System.Windows.Media.Stretch.Fill
            },
            Height = 100,
            Width = 100
        });
    }

    test.Items = observableCollection;

    list.Add(test);
}

listThemes.DataContext = list;
listThemes.ItemsSource = list;

第三，我认为将FrameworkElement直接绑定到ItemsControl并不是一个好方法。 看起来很奇怪。

更新：

如果要生成不同类型的项目，可以使用DataTemplateSelector 。 由于您已经将论坛数据解析为不同的类型，因此请查看以下文章：

如何在Windows Store应用程序中控制DataTemplateSelector

它说明了如何使用DataTemplateSelector显示不同类型的数据。

Answer 2

为什么您的内部集合类型为FrameworkElement ？ 为此创建一个自定义类型，并为内部ItemsControl设置一个ItemTemplate。

<DataTemplate x:Key=NestedItemsTemplate>
    ....
</DataTemplate>


<ListBox x:Name="listThemes"
         ItemsSource="{Binding TestItems}">
        <ListBox.ItemTemplate>
            <DataTemplate>
                <Grid Margin="5">
                    <Grid Grid.Column="1">
                        <Grid.RowDefinitions>
                            <RowDefinition Height="Auto" />
                            <RowDefinition Height="Auto" />
                        </Grid.RowDefinitions>
                        <TextBlock Text="{Binding Title}" FontWeight="Bold" />
                        <StackPanel Grid.Row="1" >
                            <ItemsControl 
                                Width="Auto" Height="Auto"
                                ItemsSource="{Binding ElementName=listThemes, Path=Items}"
                                ItemTemplate="{StaticResource NestedItemsTemplate}">
                            </ItemsControl>
                        </StackPanel>
                    </Grid>
                </Grid>
            </DataTemplate>
        </ListBox.ItemTemplate>