从Catel WPF UserControl

时间:2015-07-18 05:42:07

标签: wpf mvvm catel

我正在将一些视图和我们的WPF应用程序的模型转换为Catel,作为概念验证。

其中一个用户控件似乎没有在运行时正确绑定到视图模型。我想我明白为什么会这样,但想得到一些关于最佳补救措施的反馈意见。

代码

我有一个简单的视图,其模型实际上是ObservableCollection

PersonTable.xaml

需要注意的关键事项:我使用CollectionViewSource来包装DataGrid绑定的主要集合。这样我就可以保持网格自动排序。

<catel:UserControl x:Class="MyApp.PersonTable"
             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:scm="clr-namespace:System.ComponentModel;assembly=WindowsBase"
             xmlns:catel="http://catel.codeplex.com"
             mc:Ignorable="d" 
             d:DesignHeight="300" d:DesignWidth="200" d:DataContext="{DynamicResource DesignTimeViewModel}">
    <UserControl.Resources>
        <ResourceDictionary>
            <CollectionViewSource Source="{Binding PersonItems}" x:Key="PersonItemsSource">
                <CollectionViewSource.SortDescriptions>
                    <scm:SortDescription PropertyName="DOB" Direction="Descending" />
                </CollectionViewSource.SortDescriptions>
            </CollectionViewSource>

            <ui:DesignPersonViewModel x:Key="DesignTimeViewModel" />
        </ResourceDictionary>
    </UserControl.Resources>

    <Grid>
        <DataGrid ItemsSource="{Binding Source={StaticResource PersonItemsSource}}" AutoGenerateColumns="False">
            <DataGrid.Columns>
                <DataGridTextColumn Binding="{Binding Name, Mode=TwoWay}" 
                                    Header="Name" Width="90"
                                    ElementStyle="{StaticResource CellRightAlign}" />
                <!-- etc..... -->
            </DataGrid.Columns>
        </DataGrid>
    </Grid>
</catel:UserControl>

PersonTableViewModel.cs

视图模型接受构造函数中的模型:

using Catel.MVVM;

public class PersonTableViewModel : ViewModelBase
{
    public PersonTableViewModel(ObservableCollection<Person> personItems)
    {
        this.PersonItems = personItems
    }

    public ObservableCollection<Person> PersonItems
    {
        get { return GetValue<ObservableCollection<Person>>(PersonItemsProperty); }
        set { SetValue(PersonItemsProperty, value); }
    }

    public static PropertyData PersonItemsProperty = 
        RegisterProperty("PersonItems", typeof(ObservableCollection<Person>), () => new ObservableCollection<PersonItems>());
}

问题

在运行时,网格中不会填充任何项目。虽然在设计时,设计视图模型可以在设计视图中正确填充网格。

我对问题的根源是否正确?我相信绑定到PersonItems属性的控件不是可视树的一部分,但是嵌入在控制级资源字典中?根据我对文档的阅读,特别是文章UserControl - Under the hood,似乎Catel UserControl类仅将视图模型注入可视树内的隐藏内部DataContext,但我的{资源字典项中的{1}}可能会被冷落。

假设我说对了,最好的补救措施是什么?

如果我对上述内容有所了解,那么我可以想到一些可能的补救措施,其中没有一个看起来很完美。我很想知道最佳做法是什么来弥补这种情况。

  • {Binding}移至后面的代码;将其公开为依赖属性。我不喜欢这个选项,因为我无法在XAML中配置它。
  • CollectionViewSource移至视图模型。我真的不喜欢这个;将WPF组件放在视图模型中会破坏MVVM。
  • CollectionViewSource绑定到原始CollectionViewSource(即模型)。那里的问题是设计时视图模型不能正确绑定。

    DataContext
  • 从绑定到视图模型的代码隐藏中公开依赖项属性。 UPDATE:这在运行时有效,但现在在设计时失败(因为网格不包含测试数据。)

    <CollectionViewSource Source="{Binding}" ..... >
    

1 个答案:

答案 0 :(得分:1)

您的假设都是正确的。但是有第四种补救措施。将资源放在Grid中,以便您在ViewModel数据上下文中:

<catel:UserControl x:Class="MyApp.PersonTable"
             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:scm="clr-namespace:System.ComponentModel;assembly=WindowsBase"
             xmlns:catel="http://catel.codeplex.com"
             mc:Ignorable="d" 
             d:DesignHeight="300" d:DesignWidth="200" d:DataContext="{DynamicResource DesignTimeViewModel}">

    <Grid>
        <Grid.Resources>
            <ResourceDictionary>
                <CollectionViewSource Source="{Binding PersonItems}" x:Key="PersonItemsSource">
                    <CollectionViewSource.SortDescriptions>
                        <scm:SortDescription PropertyName="DOB" Direction="Descending" />
                    </CollectionViewSource.SortDescriptions>
                </CollectionViewSource>

                <ui:DesignPersonViewModel x:Key="DesignTimeViewModel" />
            </ResourceDictionary>
        </Grid.Resources>

        <DataGrid ItemsSource="{Binding Source={StaticResource PersonItemsSource}}" AutoGenerateColumns="False">
            <DataGrid.Columns>
                <DataGridTextColumn Binding="{Binding Name, Mode=TwoWay}" 
                                    Header="Name" Width="90"
                                    ElementStyle="{StaticResource CellRightAlign}" />
                <!-- etc..... -->
            </DataGrid.Columns>
        </DataGrid>
    </Grid>
</catel:UserControl>