在Silverlight中我们可以使用IValueConverter 实现绑定数据的格式化。在本文我们将示例如何进行操作:
一、案例描述:
我们有一个数据源People,是一个Person类的列表,Person类有两个属性,一个是姓名,一个是年龄。我们需要把People在界面上展示出来。但是在展示时我们需要按不同的年龄段来提示不同的背景。
下面我们就来具体实现:
二、案例实现
打开VS2008,新建项目Silverlight应用程序,名为MyIValueConverter。确定后,系统为我们自动创建了两个项目,一个MyIValueConverter,一个MyIValueConverter.Web。
1、在MyIValueConverter项目中新建两个类Person和People.代码如下:
Person代码


using System;
using System.Net;
using System.Windows;
using System.Windows.Controls;
using System.Windows.Documents;
using System.Windows.Ink;
using System.Windows.Input;
using System.Windows.Media;
using System.Windows.Media.Animation;
using System.Windows.Shapes;
namespace MyIValueConverter
{
public class Person
{
private string _name;
private int _age;
public string Name
{
get{return _name;}
set{_name=value;}
}
public int Age
{
get { return _age; }
set { _age = value; }
}
public Person()
{
}
public Person(string NameStr, int AgeInt)
{
Name = NameStr;
Age = AgeInt;
}
}
}


using System;
using System.Net;
using System.Windows;
using System.Windows.Controls;
using System.Windows.Documents;
using System.Windows.Ink;
using System.Windows.Input;
using System.Windows.Media;
using System.Windows.Media.Animation;
using System.Windows.Shapes;
using System.Collections.Generic;
namespace MyIValueConverter
{
public class People
{
private List<Person> _personList;
public List<Person> PersonList
{
get{return _personList;}
set { _personList = value; }
}
public People(List<Person> personLists)
{
PersonList=personLists;
}
}
}
2、在MyIValueConverter项目中进行Page.xaml界面设计,Page.xaml代码如下:
<
UserControl x:Class
=
"
MyIValueConverter.Page
"
xmlns = " http://schemas.microsoft.com/winfx/2006/xaml/presentation "
xmlns:x = " http://schemas.microsoft.com/winfx/2006/xaml "
xmlns:customer = " clr-namespace:MyIValueConverter "
Width = " 400 " Height = " 300 " >
< Grid x:Name = " LayoutRoot " Background = " White " >
< ListBox x:Name = " peopleList " >
< ListBox.ItemTemplate >
< DataTemplate >
< StackPanel x:Name = " peopleItem " Orientation = " Horizontal " >
< TextBlock x:Name = " peopleName " Width = " 80 " Height = " 30 " Text = " {Binding Name} " > </ TextBlock >
< TextBlock x:Name = " peopleAge " Width = " 80 " Height = " 30 " Text = " {Binding Age} " ></ TextBlock >
</ StackPanel >
</ DataTemplate >
</ ListBox.ItemTemplate >
</ ListBox >
</ Grid >
</ UserControl >
3、编辑Page.xaml的后台代码,Page.xaml.cs的代码为
xmlns = " http://schemas.microsoft.com/winfx/2006/xaml/presentation "
xmlns:x = " http://schemas.microsoft.com/winfx/2006/xaml "
xmlns:customer = " clr-namespace:MyIValueConverter "
Width = " 400 " Height = " 300 " >
< Grid x:Name = " LayoutRoot " Background = " White " >
< ListBox x:Name = " peopleList " >
< ListBox.ItemTemplate >
< DataTemplate >
< StackPanel x:Name = " peopleItem " Orientation = " Horizontal " >
< TextBlock x:Name = " peopleName " Width = " 80 " Height = " 30 " Text = " {Binding Name} " > </ TextBlock >
< TextBlock x:Name = " peopleAge " Width = " 80 " Height = " 30 " Text = " {Binding Age} " ></ TextBlock >
</ StackPanel >
</ DataTemplate >
</ ListBox.ItemTemplate >
</ ListBox >
</ Grid >
</ UserControl >


using System;
using System.Collections.Generic;
using System.Linq;
using System.Net;
using System.Windows;
using System.Windows.Controls;
using System.Windows.Documents;
using System.Windows.Input;
using System.Windows.Media;
using System.Windows.Media.Animation;
using System.Windows.Shapes;
namespace MyIValueConverter
{
public partial class Page : UserControl
{
public Page()
{
InitializeComponent();
Person psz = new Person("张三",18);
Person psl =new Person("李四",28);
Person psw = new Person("王五", 38);
Person psq = new Person("钱六", 48);
List<Person> ppl = new List<Person> {psz,psl,psw };
People pl = new People(ppl);
this.peopleList.ItemsSource = pl.PersonList;
}
}
}
4、在MyIValueConverter项目中添加新类AgeConverter,此类继承自IValueConverter,在此类我们需要对Age进行分段判断,
然后根据不同的年龄段返回不同的SolidColorBrush对象。AgeConverter类代码如下:


using System;
using System.Net;
using System.Windows;
using System.Windows.Controls;
using System.Windows.Documents;
using System.Windows.Ink;
using System.Windows.Input;
using System.Windows.Media;
using System.Windows.Media.Animation;
using System.Windows.Shapes;
using System.Windows.Data; //要使用IValueConverter就要引用此命名空间
using System.Globalization;
namespace MyIValueConverter
{
public class AgeConverter:IValueConverter
{
#region IValueConverter 成员
public object Convert(object value,
Type targetType,
object parameter,
CultureInfo culture)
{
DateTime date = (DateTime)value;
return date.ToShortDateString();
}
object IValueConverter.Convert(object value, Type targetType, object parameter, System.Globalization.CultureInfo culture)
{
int ageInt= (Int32)value;
SolidColorBrush scb=new SolidColorBrush(Colors.Orange); //默认的SolidColorBrush对象
//进行年龄段判断并返回不同的SolidColorBrush对象
if ((0 <= ageInt) && (ageInt <= 20)) { scb = new SolidColorBrush(Colors.Blue); }
if((20<ageInt)&&(ageInt<=30)){scb=new SolidColorBrush(Colors.Green);}
if ((30 < ageInt) && (ageInt <= 40)) { scb = new SolidColorBrush(Colors.Red); }
return scb;
}
object IValueConverter.ConvertBack(object value, Type targetType, object parameter, System.Globalization.CultureInfo culture)
{
string strValue = value.ToString();
Int16 resultAge;
if (Int16.TryParse(strValue, out resultAge))
{
return resultAge;
}
return value;
}
#endregion
}
}
<
UserControl.Resources
>
< customer:AgeConverter x:Key = " AgeConvertColor " />
</ UserControl.Resources >
修改StackPanel的属性
< customer:AgeConverter x:Key = " AgeConvertColor " />
</ UserControl.Resources >
<
StackPanel x:Name
=
"
peopleItem
"
Orientation
=
"
Horizontal
"
Background
=
"
{Binding Age, Converter={StaticResource AgeConvertColor}}
"
>
把它的Background属性和我们的Person对象的Age值进行了关联,根据不同的年龄段来设置不同的背景色。
Page.xaml代码如下:


<UserControl x:Class="MyIValueConverter.Page"
xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
xmlns:customer="clr-namespace:MyIValueConverter"
Width="400" Height="300">
<UserControl.Resources>
<customer:AgeConverter x:Key="AgeConvertColor"/>
</UserControl.Resources>
<Grid x:Name="LayoutRoot" Background="White">
<ListBox x:Name="peopleList" >
<ListBox.ItemTemplate>
<DataTemplate>
<StackPanel x:Name="peopleItem" Orientation="Horizontal" Background="{Binding Age, Converter={StaticResource AgeConvertColor}}">
<TextBlock x:Name="peopleName" Width="80" Height="30" Text="{Binding Name}"> </TextBlock>
<TextBlock x:Name="peopleAge" Width="80" Height="30" Text="{Binding Age}"></TextBlock>
</StackPanel>
</DataTemplate>
</ListBox.ItemTemplate>
</ListBox>
</Grid>
</UserControl>
按F5运行可看到不同年龄段的记录在ListBox中显示时具有不同的显示背景。
前往:Silverlight学习笔记清单 本文参照了部分网络资料,希望能够抛砖引玉,大家共同学习。
(转载本文请注明出处)