Question

我有TabControl多个DataTemplate。第一个DataTemplate将用于搜索原因，第二个将用于显示从该搜索获得的项目。我的XAML代码如下：

 <UserControl.Resources>
    <!--First template-->
    <DataTemplate>
        <!-- I will have a DataGrid here-->
    </DataTemplate>

    <!--Second template-->
    <DataTemplate >
         <!-- I will have details of one item of the DataGrid-->
    </DataTemplate>
</UserControl.Resources>


<TabControl ItemsSource="{Binding }"/>

我想要完成的是，在TabControl中，第一个标签将包含第一个DataTemplate（搜索模板），当我双击DataGrid的一行时，将添加一个选项卡，其中包含该行的详细信息（换言之，带有第二个模板的选项卡）。

由于我使用MVVM，我想创建两个UserControl，每个模板一个然后捕获双击事件，但在此之后我不知道如何添加现在，我的搜索模板是UserControl与包含TabControl的搜索模板分开的选项卡。

那我该怎么做？

更新：

当我读到答案时，我认为我在陈述问题方面并不是很清楚。我的问题是如何通过从第一个模板中捕获双击事件来添加第二个模板的选项卡。在单独添加两个模板时，我没有任何问题。

Answer 1

可以创建两个UserControl，您可以创建并使用DataTemplateSelector来切换不同的DataTemplate。

基本上，创建一个来自DataTemplateSelector的新类，并覆盖SelecteTemplate方法。然后在XAML中声明它的一个实例（很像值转换器），然后将其应用于ContentTemplateSelector的{{1}}属性。

More info can be found here

Answer 2

如果您要使用MVVM执行此操作，则应将选项卡控件绑定到VM中的某些ObservableCollection，并根据需要添加和删除VM。

虚拟机可以是您喜欢的任何类型，您的DataTemplates将在选项卡中显示正确的视图，就像任何其他视图一样，所以是的，为两个视图创建两个UserControl。

public class MainVM
{
    public ObservableCollection<object> Views { get; private set; }

    public MainVM()
    {
        this.Views = new ObservableCollection<object>();
        this.Views.Add(new SearchVM(GotResults));
    }

    private void GotResults(Results results)
    {
        this.Views.Add(new ResultVM(results));
    }
}

Answer 3

有两个选项：使用datatemplate选择器，或为每个tabitem使用隐式datatemplates和不同类型。

<强> 1。 DataTemplateSelector：

select distinct  od.work_center_no, 
  case
    when od.work_center_no not in ('HPKG','SHRK') then so.revised_qty_due
    when od.work_center_no in ('HPKG','SHRK') then od.allowed_hours
  end units_discs, 
  case
    when od.work_center_no not in ('HPKG','SHRK') then 'units'
    when od.work_center_no in ('HPKG','SHRK') then 'hrs'
  end qty_hrs,
  trunc(so.revised_due_date), so.plant, so.order_type
from gps_beweg gb,
     TABLE(leos_flatbom_pkg.GetFlatBOM(gb.part_no)) bom, 
     leos_item li,
     shop_order so,
     operations_detail od,
     (select trunc(sysdate) + level - 1 a_date from dual
        connect by level <= 90) dates
where trunc(so.revised_due_date(+)) = dates.a_date
  and nvl(gb.cunr,'W30001') = 'W30001'
  and bom.av_part_no = li.av_part_no(+)
  and nvl(li.item_type,'FP') in ('FP','MD')
  and bom.av_part_no(+) = so.part_no
  and nvl(so.status_code,'2') between '2' and '8'
  and so.order_no = od.order_no(+)
  and nvl(od.work_center_no not,'AVDX') in ('AVDX','DPRN','FYIE','BVDB','ABDX','BBDS')
  and nvl(od.work_center_no,'HPKG') = 'HPKG'
  and nvl(so.plant,'W') = 'W'
order by dates.a_date

public ObservableCollection<TabItemVM> Tabs { get; private set; }

public MainVM()
{
    Tabs = ObservableCollection<TabItemVM>
    {
        new TabItemVM { Name="Tab 1" },
    };
}

void AddTab(){
   var newTab = new TabItemVM { Name="Tab 2" };
   Tabs.Add(newTab);
   //SelectedTab = newTab; //you may bind TabControl.SelectedItemProperty to viewmodel in order to be able to activate the tab from viewmodel
}

public class TabItemTemplateSelector : DataTemplateSelector
{
    public DataTemplate Tab1Template { get; set; }
    public DataTemplate Tab2Template { get; set; }
    public override DataTemplate SelectTemplate(object item, DependencyObject container)
    {
        var tabItem = item as TabItemVM;
        if (tabItem.Name == "Tab 1") return Tab1Template;
        if (tabItem.Name == "Tab 2") return Tab2Template;
        return base.SelectTemplate(item, container);
    }
}

<强> 2。隐式数据模板：

<local:TabItemTemplateSelector
     x:Key="TabItemTemplateSelector"
     Tab1Template="{StaticResource Tab1Template}" 
     Tab2Template="{StaticResource Tab2Template}" />

public class MainVM : ViewModelBase
{
    public ObservableCollection<TabItemVM> Tabs { get; private set; }

    public MainVM()
    {
        Tabs = new ObservableCollection<TabItemVM>
        {
            new Tab1VM(),
        };
    }

    void AddTab()
    {
        var newTab = new Tab2VM()
        Tabs.Add(newTab);
       //SelectedTab = newTab; 
    }
}

public class TabItemBase
{
    public string Name { get; protected set; }
}

public class Tab1VM : TabItemBase
{
    public Tab1VM()
    {
        Name = "Tab 1";
    }
}

public class Tab2VM : TabItemBase
{
    public Tab2VM()
    {
        Name = "Tab 2";
    }
}

WPF：带有多个DataTemplates的TabControl

3 个答案: