6

これらは私のクラスです:

   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; }
    }

そして、これは私の MainWindow Xaml コードです:

  <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、リスト内の各項目に対して 1 つのページがFあり、すべてのTabControlページに次のようにTextBlock 何か 1があります。

ここに画像の説明を入力

私が望むのは、ページの 1 つだけをデザインすることです。Something 3buttonという名前の Camel ページに new を追加するとします。

4

1 に答える 1

6

上記のコメントに従って:

タブごとに特定の ViewModel クラスを作成します。

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

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

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

次に、それぞれに特定のビュー (通常は UserControls の形式) を作成します。

<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、ViewModel タイプごとに作成し、これらをその中に入れUserControlsます。

編集:これらはApp.xaml以下で定義する必要がありますApplication.Resources:

<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<ViewModelBase>メインの ViewModel に を配置し、これらの項目を追加します。

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());
}
于 2013-07-30T18:10:50.607 に答える