Silverlight MVVM：根据 Silverlight 中的绑定值更改 DataGrid 中的单元格边框颜色

Question

我是 Silverlight 的新手，正在从事一个使用 MVVM 模式的项目。这意味着我不想编写代码隐藏来完成这项任务（解决方案架构师对此要求非常清楚），而是我正在寻找一种完全在 XAML 中完成它的方法。

我有两个如下所示的类：

using System.Collections.ObjectModel;

namespace SilverlightApplication2.ViewModels
{
    public class ClassA
    {    
        public long ClassAValueOne { get; set; }

        public ObservableCollection<ClassB> ClassBs { get; set; }
    }

}


namespace SilverlightApplication2.ViewModels
{
    public class ClassB
    {
        public long? ClassBValueOne { get; set; }

        public long? ClassBValueTwo { get; set; }

        public long? ClassBValueThree { get; set; }

        public long? ClassBValueFour { get; set; }
    }
}

一个看起来像这样的视图模型类：

using System.Collections.ObjectModel;

namespace SilverlightApplication2.ViewModels
{
    public class EditorViewModel
    {    
        public EditorViewModel()
        {
            this.ClassAs = new ObservableCollection<ClassA>
            {
                new ClassA
                {
                    ClassAValueOne = 1,
                    ClassBs = new ObservableCollection<ClassB>
                    {
                        new ClassB { ClassBValueOne = 1, ClassBValueTwo = 2, ClassBValueThree = 3, ClassBValueFour = 4 },
                        new ClassB { ClassBValueOne = 5, ClassBValueTwo = 6, ClassBValueThree = 7, ClassBValueFour = 8 },
                        new ClassB { ClassBValueOne = 9, ClassBValueTwo = 10, ClassBValueThree = 11, ClassBValueFour = 12 }
                    }
                },
                new ClassA
                {
                    ClassAValueOne = 3,
                    ClassBs = new ObservableCollection<ClassB>
                    {
                        new ClassB (),
                        new ClassB (),
                        new ClassB ()
                    }
                }
            };
        }

        public ObservableCollection<ClassA> ClassAs { get; set; }
    }
}

还有一个看起来像这样的视图：

<controls:ChildWindow x:Class="SilverlightApplication2.Views.ExemptionEditor"
           xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation" 
           xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml" 
           xmlns:controls="clr-namespace:System.Windows.Controls;assembly=System.Windows.Controls"
           xmlns:viewmodels="clr-namespace:SilverlightApplication2.ViewModels"
           xmlns:i="http://schemas.microsoft.com/expression/2010/interactivity"
           xmlns:ei="http://schemas.microsoft.com/expression/2010/interactions"
           xmlns:toolkit="http://schemas.microsoft.com/winfx/2006/xaml/presentation/toolkit"
           xmlns:sdk="http://schemas.microsoft.com/winfx/2006/xaml/presentation/sdk"
           Width="470" Height="700"
           Title="Exemption Editor">

    <controls:ChildWindow.DataContext>
        <viewmodels:EditorViewModel/>
    </controls:ChildWindow.DataContext>

    <i:Interaction.Triggers>
        <ei:PropertyChangedTrigger Binding="{Binding DialogResult}">
            <ei:ChangePropertyAction TargetObject="{Binding ElementName=ExemptionEditorChildWindow}" PropertyName="DialogResult" Value="{Binding DialogResult}"/>
        </ei:PropertyChangedTrigger>
    </i:Interaction.Triggers>

    <controls:ChildWindow.Resources>
    </controls:ChildWindow.Resources>

    <Grid x:Name="LayoutRoot" Margin="2">
        <Grid.Resources>
            <Style x:Key="DataGridTextColumnReadOnlyBackgroundColor" TargetType="sdk:DataGridCell">
                <Setter Property="Background" Value="#C6DEFE" />
            </Style>
        </Grid.Resources>

        <Grid.RowDefinitions>
            <RowDefinition />
            <RowDefinition Height="Auto" />
        </Grid.RowDefinitions>

        <ListBox ItemsSource="{Binding ClassAs}">
            <ListBox.ItemTemplate>
                <DataTemplate>
                    <toolkit:Expander IsExpanded="True">
                        <toolkit:Expander.Header>
                            <Border Background="#FF99CC00">
                                <TextBlock Text="{Binding Path=ClassAValueOne}" FontWeight="Bold" Foreground="Black"></TextBlock>
                            </Border>
                        </toolkit:Expander.Header>
                        <StackPanel Orientation="Vertical">
                            <TextBlock Text="{Binding Path=ClassAValueOne, StringFormat='Enter data for item {0}'}" Margin="5,10,0,10" Foreground="Black" FontWeight="Bold"/>
                            <sdk:DataGrid ItemsSource="{Binding ClassBs}" AutoGenerateColumns="False" HorizontalAlignment="Center" VerticalAlignment="Center" RowHeight="20" Margin="0, 0, 0, 10">
                                <sdk:DataGrid.Columns>
                                    <sdk:DataGridTextColumn Binding="{Binding ClassBValueOne}" Header="ValueOne" FontWeight="Bold" Width="100" IsReadOnly="True" CellStyle="{StaticResource DataGridTextColumnReadOnlyBackgroundColor}"/>
                                    <sdk:DataGridTextColumn Binding="{Binding ClassBValueTwo, Mode=TwoWay}" Header="ValueTwo" FontWeight="Bold" Width="100"/>
                                    <sdk:DataGridTextColumn Binding="{Binding ClassBValueThree, Mode=TwoWay}" Header="ValueThree" FontWeight="Bold" Width="100"/>
                                    <sdk:DataGridTextColumn Binding="{Binding ClassBValueFour, Mode=TwoWay}" Header="ValueFour" FontWeight="Bold" Width="100"/>
                                 </sdk:DataGrid.Columns>
                             </sdk:DataGrid>
                        </StackPanel>
                    </toolkit:Expander>
                </DataTemplate>
            </ListBox.ItemTemplate>
        </ListBox>
    </Grid>

</controls:ChildWindow>

我有两个 UI 要求：

1. 如果 ClassB 中的任何值属性为 null，则表示该 null 值的数据网格单元格周围应该有一个红色边框，以提醒用户他们需要在该单元格中输入一个值。
2. 如果用户尝试在单元格中为 ClassB 的 value 属性键入字符串（键入为可为 null 的 long），则单元格背景应变为红色，以提醒用户他们无法输入字符串值到单元格中。

我已经搜索了实现此目的的可能方法，但我发现的所有内容都是针对 WPF 的，并且是指使用 Silverlight 中不存在的 DataTemplateSelector。

有什么帮助吗？

Answer 1

这比你想象的要容易！ 你只需要使用一些验证属性。

查看这些链接：

http://msdn.microsoft.com/en-us/library/dd901590%28v=vs.95%29.aspx

http://www.asp.net/mvc/tutorials/older-versions/models-%28data%29/validation-with-the-data-annotation-validators-cs

ps：aspx 中有一些示例，但您也可以将其应用于 silverlight。

祝你好运！