Tabcontrol MVVM光视图模型绑定

时间:2018-06-15 13:12:38

标签: c# wpf mvvm mvvm-light

我正在使用Galasoft MVVM Light Framework。

我想要达到的目的是: enter image description here

我目前得到的是: enter image description here

我的所有视图模型在我的MainViewModel.cs中被静态声明为实例字段,因此它们在窗口之间切换时保持状态:

    #region Viewmodels init.
    readonly static InputViewModel _inputViewModel = new InputViewModel();
    [...]
    readonly static LicensesViewModel _licensesViewModel = new LicensesViewModel();
    readonly static PricesViewModel _pricesViewModel = new PricesViewModel();
    #endregion

在我输入的用户控件中,我显示了tabcontrol。 在每个tabitem中,我将新的usercontrol绑定为视图

<UserControl>
        <DockPanel>
            <TabControl>
                <TabItem Header="Prices">
                    <local:PricesControl DataContext="{x:Type viewModels:PricesViewModel}" />
                </TabItem>
                <TabItem Header="Licenses">
                    <local:LicenseControl DataContext="{x:Type viewModels:LicensesViewModel}" />
                </TabItem>
            </TabControl>
        </DockPanel>
    </UserControl>

但我无法将视图模型绑定到视图。 tabcontrol始终位于inputviewmodel的datacontext中。

非常感谢任何建议!

1 个答案:

答案 0 :(得分:2)

请勿在{{1​​}}中使用static字段,这是一个糟糕的设计决定,并使您的代码无法测试。

相反,使用WPF强大的数据模板机制。

MainViewModel

使用视图模型的数据模板:

class MainViewModel : INotifyPropertyChanged
{
    // Note: this is just a sample.
    // You might want to inject the instances via DI
    public IEnumerable<INotifyPropertyChanged> TabItems { get; } =
        new[] { new PricesViewModel(), new LicensesViewModel() };
}

<TabControl ItemsSource="{Binding TabItems}" DisplayMemberPath="PropertyNameForTabHeader"> <TabControl.Resources> <DataTemplate DataType="{x:Type viewModels:PricesViewModel}"> <local:PricesControl/> </DataTemplate> <DataTemplate DataType="{x:Type viewModels:LicensesViewModel}"> <local:LicenseControl/> </DataTemplate> </TabControl.Resources> </TabControl> 属性指定标签项的视图模型属性的名称,以用作标签的标题。

通过这种方法,您的设计具有动态性和可扩展性。