将包装的视图模型绑定到TabControl

时间:2018-02-22 08:17:04

标签: c# wpf xaml mvvm tabcontrol

我一直在尝试自动填充我的TabControl,并且一直在查看这个question,虽然它并没有完全涵盖包装的虚拟机,我无法弄明白。

我的MainViewModel

public class MainActionViewModel : ViewModelBase
{
    private readonly IDialogService dialogService;

    public ObservableCollection<ViewVM> Views { get; set; }

    public MainActionViewModel(IDialogService dialogService)
    {
        this.dialogService = dialogService;

        ObservableCollection<ViewVM> views = new ObservableCollection<ViewVM>
        {
            new ViewVM{ ViewDisplay="Inspections", ViewType = typeof(InspectionsView), ViewModelType = typeof(InspectionsViewModel)},
            new ViewVM{ ViewDisplay="Defects", ViewType = typeof(SecurityView), ViewModelType = typeof(SecurityViewModel)},
            new ViewVM{ ViewDisplay="Planned Works", ViewType = typeof(SecurityView), ViewModelType = typeof(SecurityViewModel)},
            new ViewVM{ ViewDisplay="Security", ViewType = typeof(SecurityView), ViewModelType = typeof(SecurityViewModel)}
        };
        Views = views;
        RaisePropertyChanged("Views");
    }
}

我的主视图

<Window x:Class="AptAction.MainAction"
      xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
      xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
      xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006" 
      xmlns:d="http://schemas.microsoft.com/expression/blend/2008" 
      xmlns:local="clr-namespace:AptAction"
      mc:Ignorable="d" 
      d:DesignHeight="500" d:DesignWidth="700"
      Title="AptAction">

    <Grid>
        <Grid.RowDefinitions>
            <RowDefinition Height="Auto"/>
            <RowDefinition Height="*"/>
            <RowDefinition Height="Auto"/>
        </Grid.RowDefinitions>
        <TabControl Grid.Row="1"  ItemsSource="{Binding Views}" SelectedIndex="0">
            <TabControl.Resources>
                <DataTemplate DataType="{x:Type local:InspectionsViewModel}">
                    <local:InspectionsView/>
                </DataTemplate>
                <DataTemplate DataType="{x:Type local:SecurityViewModel}">
                    <local:SecurityView/>
                </DataTemplate>
            </TabControl.Resources>
            <TabControl.ItemTemplate>
                <DataTemplate>
                    <TextBlock Text="{Binding ViewDisplay}" />
                </DataTemplate>
            </TabControl.ItemTemplate>
        </TabControl>
        <TextBlock x:Name="UIMessage" Text="" HorizontalAlignment="Right" VerticalAlignment="Top" Margin="0,0,8,0" Foreground="{StaticResource DarkBrightBrush}"/>
        <ContentControl x:Name="Holder" Grid.Row="2" />
    </Grid>
</Window>

TabItems的内容显示了LibsView.ViewVM的描述,我需要更改/添加什么才能让它正确显示实际视图?

enter image description here

1 个答案:

答案 0 :(得分:1)

您应该将InspectionsViewModelSecurityViewModel的实例添加到ObservableCollection,而不是向其添加ViewVM个对象。

创建InspectionsViewModelSecurityViewModel都继承的公共基类(或接口),并将集合的类型更改为ObservableCollection<BaseType>

public MainActionViewModel()
{
    ObservableCollection<BaseType> views = new ObservableCollection<BaseType>
            {
                new InspectionsViewModel(),
                new SecurityViewModel()
            };
    Views = views;
}

您也可以使用ObservableCollection<object>,因为您的两个类都已隐式继承自object