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

时间:2014-01-13 05:50:19

标签: silverlight mvvm

我是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,则表示该空值的数据网格单元应该在其周围有一个红色边框,以引起用户注意他们需要在该单元格中输入值。
  2. 如果用户尝试在单元格中键入字符串以获取ClassB的值属性(键入为可空的长整数),则单元格背景应变为红色以引起用户注意他们无法输入字符串进入细胞的价值。
  3. 我已经搜索了实现此目的的可能方法,但我发现的所有内容都是针对WPF的,并且指的是使用Silverlight中不存在的DataTemplateSelector。

    任何帮助?

1 个答案:

答案 0 :(得分:0)

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

查看以下链接:

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。

祝你好运!