wpf - tabcontrol 内的列表视图

问题描述

我很难在 BindingListView TabControl 波纹管是我的视图模型

public ObservableCollection<TabItem> Tabs { get; set; }
public class TabItem
{
    public string Header { get; set; }
    public ObservableCollection<abc> Content { get; set; }
}
public class abc
{
    public string text { get; set; }
}

这就是我初始化它的方式

InitializeComponent();
Tabs = new ObservableCollection<TabItem>()
{
    new TabItem {
        Header = "Header1",Content = new ObservableCollection<abc>()
        {
            new abc{ text = "content1" },new abc{ text = "content2" },}
    },new TabItem {
        Header = "Header2",Content = new ObservableCollection<abc>()
        {
            new abc{ text = "content3" },new abc{ text = "content4" },}
    }
};
tabControl1.ItemsSource = Tabs;

这是我在视图中填充和Bind它的方式

<TabControl Name="tabControl1">
    <TabControl.ItemTemplate>
        <!-- this is the header template-->
        <DataTemplate>
            <TextBlock Width="500" Text="{Binding Header}" />
        </DataTemplate>
    </TabControl.ItemTemplate>
    <TabControl.ContentTemplate>
        <!-- this is the body of the TabItem template-->
        <DataTemplate>
            <ListView Margin="10" ItemsSource="{Binding Content}">
                <ListViewItem>
                    <StackPanel>
                        <TextBlock Text="{Binding text}" />
                    </StackPanel>
                </ListViewItem>
            </ListView>
        </DataTemplate>
    </TabControl.ContentTemplate>
</TabControl>

但后来我说错了

InvalidOperationException: Operation is not valid while ItemsSource is in use. Access and modify elements with ItemsControl.ItemsSource instead.

如何在 ListView 内绑定 TabControl? 每个 Tab 控件将具有相同的 ListView 格式。实际 ListView 将有 1 个以上的字段。不仅是 text 字段。

我哪里做错了?

解决方法

ListViewItems 由 ListView 为 ItemsSource 中的每个元素创建。要更改它们的外观,您需要 ItemTemplate:

<ListView Margin="10" ItemsSource="{Binding Content}">
    <ListView.ItemTemplate>
        <DataTemplate>
            <TextBlock Text="{Binding text}" />
        </DataTemplate>
    </ListView.ItemTemplate>
</ListView>

如果您有 1 个以上的字段,而不仅仅是文本字段,请使用 shown in this post 之类的列定义 GridView