wpf 使用MVVM模式中的用户控件将列表绑定到TabControl

iovurdzv  于 2023-08-07  发布在  其他
关注(0)|答案(1)|浏览(176)

我有一个抽象类MyAbstractDataClass和几个子类,比如GeneralDataClassDetailedDataClassFooDataClass
对于每个子类,都有一个UserControl,它为相应的数据提供字段(TextBox)。(一般使用者控件、详细数据使用者控件、Foo使用者控件)。
My ViewModel包含一个ObservableCollection,其中添加了各个子类的各种示例。例如,1个一般数据类别、2个详细数据类别和2个FooDataClass。
我希望实现以下行为:视图应该由一个选项卡控件组成,该控件为ViewModel列表中的每个类显示一个选项卡。在选项卡中,应打开相应用户控件的示例。
当我在View.xaml中显式创建用户控件时,它可以正常工作,没有任何问题。然后,不同UserControl示例的数据绑定和管理工作。但是,我无法让TabControl动态地做出React,即这些选项卡被绑定到ObservableCollection。经过一番研究,我最终得到了这段代码,它至少可以识别和绑定集合,还为每个选项卡提供了一个相应的UserControl。不过,数据系结无法运作,而且不会建立UserControls的其他执行严修。

<TabControl Name="tabs" Grid.Row="1" TabStripPlacement="Left" ItemsSource="{Binding List}">
    <TabControl.ItemTemplate>
        <DataTemplate>
            <TextBlock Text="{Binding Title}"/>
        </DataTemplate>
    </TabControl.ItemTemplate>
    <TabControl.ContentTemplate>
        <DataTemplate>
            <ContentControl Content="{Binding}">
                <ContentControl.Resources>
                    <DataTemplate DataType="{x:Type local:GeneralData}">
                        <local:GeneralDataUserControl/>
                    </DataTemplate>
                    <DataTemplate DataType="{x:Type local:DetailedData}">
                        <local:DetailedDataUserControl/>
                    </DataTemplate>
                    <DataTemplate DataType="{x:Type local:FooData}">
                        <local:FooDataUserControl/>
                    </DataTemplate>
                </ContentControl.Resources>
            </ContentControl>
        </DataTemplate>
    </TabControl.ContentTemplate>
</TabControl>

字符串

pxiryf3j

pxiryf3j1#

不应为TabItems显式声明ContentTemplate。
当不同的DataTemplates被声明为TabControl(或其父元素之一)的资源时,这将自动完成。

<TabControl ItemsSource="{Binding List}" ...>
    <TabControl.Resources>
        <DataTemplate DataType="{x:Type local:GeneralData}">
            <local:GeneralDataUserControl/>
        </DataTemplate>
        <DataTemplate DataType="{x:Type local:DetailedData}">
            <local:DetailedDataUserControl/>
        </DataTemplate>
        <DataTemplate DataType="{x:Type local:FooData}">
            <local:FooDataUserControl/>
        </DataTemplate>
    </TabControl.Resources>
    <TabControl.ItemTemplate>
        <DataTemplate>
            <TextBlock Text="{Binding Title}"/>
        </DataTemplate>
    </TabControl.ItemTemplate>
</TabControl>

字符串
还必须确保UserControls没有显式设置它们自己的DataContext属性。这样的数据模板只有在DataTemplate中的控件获得其父元素的继承DataContext值时才有效,即这里的TabItem。

相关问题