如何设计一个TabPage的时候的TabControl的的ItemsSource被绑定到WPF列表?绑定、时候、列表、TabPage

2023-09-03 04:14:16 作者:拼死拼活只为结果。

这是我的职业:

   class mainViewModel
    {       
        public List<Foo> F { get; set; }
        public mainViewModel()
        {
        F=new List<Foo>()
              {
                  new Foo(new Animal(){Name = "Cat"}),
                  new Foo(new Animal(){Name = "Dog"}),
                  new Foo(new Animal(){Name = "Camel"})
              };
        }
     }

    public class Foo
    {
        public Animal Animal { get; set; }
        public Foo(Animal animal)
        {
            Animal = animal;
        }
    }

    public class Animal
    {
        public string Name { get; set; }
    }

这是我的主窗口的XAML code:

  <TabControl ItemsSource="{Binding Path=F}">
            <TabControl.ItemTemplate>
                <DataTemplate>
                    <TextBlock Text="{Binding Animal.Name}"/>
                </DataTemplate>
            </TabControl.ItemTemplate>
            <TabControl.ContentTemplate>
              <DataTemplate>
                    <TextBlock Text="Something 1"/>
              </DataTemplate>
            </TabControl.ContentTemplate>
  </TabControl>

现在很明显,我将有一个的TabControl 一个页面列表中的每个项目 F 和所有的的TabControl 页有一个的TextBlock 的的东西1 的,如下所示:

Now obviously I will have a TabControl with one page for each Item in the List F and all the TabControl pages have a TextBlock Something 1 as shown here:

我要的是设计只是一个网页。说增加新的按钮来命名的的东西3 的骆驼页。

what I want is to design just one of the pages. say add new button to the Camel page named Something 3.

推荐答案

根据上述意见:

为每个标签创建一个特定的ViewModel类:

Create a specific ViewModel class for each Tab:

public class Tab1: ViewModelBase
{
   //... functionality, properties, etc
}

public class Tab2: ViewModelBase
{
   //... functionality, properties, etc    
}

public class Tab3: ViewModelBase
{
   //... functionality, properties, etc    
}

然后创建一个特定视图(通常在用户控件的形式)对于每个

Then Create a specific View (usually in the form of UserControls) for each:

<UserControl x:Class"UserControl1" ...>
   <!-- UI Elements, etc -->
</UserControl>

<UserControl x:Class"UserControl2" ...>
   <!-- UI Elements, etc -->
</UserControl>

<UserControl x:Class"UserControl3" ...>
   <!-- UI Elements, etc -->
</UserControl>

然后创建的DataTemplates 每个视图模型类型,并把这些用户控件在他们里面:

Then create DataTemplates for each ViewModel Type and put these UserControls inside them:

编辑:在 Application.Resources 这些应该在的App.xaml 定义

<Application ....>
    <Application.Resources>
        <DataTemplate DataType="{x:Type local:ViewModel1}">
            <local:UserControl1/>
        </DataTemplate>

        <DataTemplate DataType="{x:Type local:ViewModel2}">
            <local:UserControl2/>
       </DataTemplate>

       <DataTemplate DataType="{x:Type local:ViewModel3}">
           <local:UserControl2/>
      </DataTemplate>
   </Application.Resources>
</Application>

最后,把一个的ObservableCollection&LT; ViewModelBase&GT; 在主视图模型并添加下列项目:

Finally, put an ObservableCollection<ViewModelBase> in your main ViewModel and add these Items:

public ObservableCollection<ViewModelBase> Tabs {get;set;} //Representing each Tab Item

public MainViewModel() //Constructor
{
    Tabs = new ObservableCollection<ViewModelBase>();
    Tabs.Add(new ViewModel1());
    Tabs.Add(new ViewModel2());
    Tabs.Add(new ViewModel2());
}