WPF TabControl与ContentControl

时间:2015-04-19 09:04:24

标签: c# wpf mvvm tabcontrol

我在SO上搜索了很多,并没有找到我的问题的答案。 我想将TabControl与MVVM一起使用。以下是我将TabControl添加到MainWindow.xaml的方法

<Window.Resources>
        <DataTemplate DataType="{x:Type models:PartnersViewModel}">
            <views:PartnersView />
        </DataTemplate>
        <DataTemplate DataType="{x:Type models:ProjectsViewModel}">
            <views:ProjectsView />
        </DataTemplate>
    </Window.Resources>

    <Window.DataContext>
        <models:ApplicationViewModel/>
    </Window.DataContext>

    <TabControl ItemsSource="{Binding PageViewModels}"  TabStripPlacement="Left">
        <TabControl.ItemTemplate>
            <DataTemplate>
                <TextBlock Text="{Binding Name}" />
            </DataTemplate>
        </TabControl.ItemTemplate>
        <TabControl.ContentTemplate>
            <DataTemplate>
                <ContentControl Content="{Binding}" />
            </DataTemplate>
        </TabControl.ContentTemplate>
    </TabControl>

PageViewModels是ObservableCollection<IPageViewModel>IPageViewModel是具有一个属性Name的简单接口。此接口PartnersViewModelProjectsViewModel有两种实现方式。

public class ProjectsViewModel : IPageViewModel
{
    public String Name
    {
        get { return "Projects"; }
    }
}

public class PartnersViewModel : IPageViewModel
{
    public String Name
    {
        get { return "Partners"; }
    }
}

我希望每个标签都显示为ContentControl。标题文本取自Name属性。我的ProjectsView和PartnersView看起来像这样:

<UserControl x:Class="WANIRPartners.Views.ProjectsView"
         xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
         xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml" 
         xmlns:d="http://schemas.microsoft.com/expression/blend/2008" >
  <Grid>
    <Label Content="Projects Content" />
  </Grid>
</UserControl>

使用此代码,TabControl中的标题和内容完全相同。 “项目内容”/“合作伙伴内容”显示在选项卡标题中,并且(在标签内容中也可以)。当我将<Label/>更改为<DataGrid/>时,标题标题包含datagrid(sic!)。 我怎样才能使这个工作正常。我的意思是如何将标题显示为属性Name的值,将标签内容显示为正确呈现<views:PartnersView /><views:ProjectsView />,具体取决于PageViewModels中的内容。

2 个答案:

答案 0 :(得分:1)

你的代码应该工作,没有IDE atm。您还可以使用Snoop在运行时检查绑定。我将ContentTemplate更改为:

    <TabControl.ContentTemplate>
        <DataTemplate>
            <ContentPresenter Content="{Binding .}" />
        </DataTemplate>
    </TabControl.ContentTemplate>

它有效。但即使你的代码也可以在我的testapp中运行。

答案 1 :(得分:0)

我发现了极乐世界的解决方案。在下面添加更多代码,一切正常。

 <TabControl.Resources>
     <Style TargetType="{x:Type TabItem}" BasedOn="{StaticResource {x:Type TabItem}}">
         <Setter Property="Header" Value="{Binding Name}"/>
     </Style>
 </TabControl.Resources>