简要说明：
IValueConverter主要用于XAML绑定和数据源之间的转换
TypeConverter主要用于自定义类的属性类型之间的转换
本文主要讲解如何使用IValueConverter和TypeConverter。我们通过两个思考问题来引入如何使用IValueConverter和TypeConverter！
IValueConverter主要用于将数据源的数据转换为需要在界面上显示的数据，例如：将Url地址转换为图片显示到界面上、将float类型数据显示为货币类型、bool值和Visibility转换等等
TypeConverter主要用于在XAML代码中的字符串类型转换为其他类型的数值，比如将一段字符串转为Double类型以供Width属性使用
思考一：我的数据集合的其中一个集合中的属性为某个图片的URL，如何将这个URL地址转换为图片显示到DataGrid行中呢？
IValueConverter的使用方法：
一、首先编写一个ImageConverter类型，此类继承于IValueConverter接口，然后实现此接口的Convert和ConvertBack方法。注意Convert方法是将数据源的数据转为需要显示的数据，而ConvertBack方法用于将显示出来的数据在TwoWay模式下回传给数据源。如下面的代码以编制：
public class ImageConverter : IValueConverter { // 在载入数据的时候将数据转换为图片类型 public object Convert( object value, Type targetType, object parameter, System.Globalization.CultureInfo culture) { try { Uri uri = new Uri(( string )value, UriKind.RelativeOrAbsolute); BitmapImage img = new BitmapImage(uri); return img; } catch { return new BitmapImage(); } } // 在页面上操作的时候，将图片类型转换为数据，这里只有再TwoWay的时候才有用 public object ConvertBack( object value, Type targetType, object parameter, System.Globalization.CultureInfo culture) { BitmapImage img = value as BitmapImage; return img.UriSource.AbsoluteUri; } }
二、在UserControl的资源中申明ImageConverter以供DataGrid的数据源绑定时转换数据
< UserControl.Resources > < this :ImageConverter x:Key = " ImageCoverter " /> </ UserControl.Resources >
三、在DataGrid中使用Converter转换，代码如下：
< sdk:DataGrid HorizontalAlignment = " Left " AutoGenerateColumns = " False " Name = " ShowCityList " VerticalAlignment = " Top " > < sdk:DataGrid.Columns > < sdk:DataGridTextColumn Header = " 省会 " Binding = " {Binding AddrName} " IsReadOnly = " True " /> < sdk:DataGridTextColumn Header = " 城市 " Binding = " {Binding CityName} " IsReadOnly = " True " /> < sdk:DataGridTextColumn Header = " 电话区号 " Binding = " {Binding TelNum} " IsReadOnly = " True " /> < sdk:DataGridTemplateColumn Header = " 城市图片 " > < sdk:DataGridTemplateColumn.CellTemplate > < DataTemplate > < Image Source = " {Binding CityImageUrl, Mode=TwoWay, Converter={StaticResource ImageCoverter}} " ></ Image > </ DataTemplate > </ sdk:DataGridTemplateColumn.CellTemplate > </ sdk:DataGridTemplateColumn > </ sdk:DataGrid.Columns > </ sdk:DataGrid >
四、为这个DataGrid绑定数据源如下代码：
public partial class MainPage : UserControl { public MainPage() { InitializeComponent(); List < CityInformation > listCity = new List < CityInformation > () { new CityInformation(){ AddrName = " 四川 " , CityName = " 成都 " , TelNum = " 028-28884482 " , CityImageUrl = " http://sc.admin5.com/uploads/allimg/100211/105R34217-0.png " }, new CityInformation() { AddrName = " 广东 " , CityName = " 广州 " , TelNum = " 021-22332884 " , CityImageUrl = " http://sc.admin5.com/uploads/allimg/100211/105R333J-4.png " }, new CityInformation() { AddrName = " 上海 " , CityName = " 上海 " , TelNum = " 020-33245566 " , CityImageUrl = " http://sc.admin5.com/uploads/allimg/100211/105R31S6-9.png " }, new CityInformation() { AddrName = " 北京 " , CityName = " 北京 " , TelNum = " 010-77534222 " , CityImageUrl = " http://sc.admin5.com/uploads/allimg/100211/105R33342-7.png " } }; this .ShowCityList.ItemsSource = listCity; } } /// <summary> /// 城市信息的实体类 /// </summary> public class CityInformation { private string _AddrName; private string _CityName; private string _TelNum; private string _cityImageUrl; public string AddrName { get { return _AddrName; } set { _AddrName = value; } } public string CityName { get { return _CityName; } set { _CityName = value; } } public string TelNum { get { return _TelNum; } set { _TelNum = value; } } public string CityImageUrl { get { return _cityImageUrl; } set { _cityImageUrl = value; } } }
思考二：我需要做一个自定义控件，自定义控件是以厘米为单位来设置其宽度，而不是以像素为单位来设置，应该如何实现？
TypeConverter的使用方法：
一、编写一个SLConverter类型继承于TypeConverter类，重写了CanConvertFrom方法和ConvertFrom方法将XAML中的String类型的数据转换为Double类型赋值给自定义控件。
public class CustomLengthConverter : TypeConverter { // 返回一个值，该值指示类型转换器能否将指定类型的对象转换为此转换器的类型 public override bool CanConvertFrom(ITypeDescriptorContext context, Type sourceType) { if (sourceType == typeof ( string )) { return true ; } return base .CanConvertFrom(context, sourceType); } // 从指定值转换为此转换器的预期转换类型。 public override object ConvertFrom(ITypeDescriptorContext context, CultureInfo culture, object value) { if (value == null ) { return new Double(); } if (value is string ) { string s = ( string )value; if (s.Length == 0 ) { return new Double(); } // 将流入的字符串分割为两部分，使用第一部分2cm*40=80=设置的像素 string [] arguments = s.Split( ' ' ); if (arguments.Length != 2 ) { return new Double(); } else { // 假设1cm=40px return InternalParseInput(( double .Parse(arguments[ 0 ]) * 40 ).ToString()); } } return base .ConvertFrom(context, culture, value); } // 将String数据格式化为Double类型数据返回给属性 public Double InternalParseInput(String inputString) { Double doubleValue; try { doubleValue = Double.Parse(inputString); } catch (Exception) { doubleValue = new Double(); } return doubleValue; } }
二、编写一个自定义控件RichTextBlock，并且为这个自定义控件新增了两个自定义属性，其中一个是将cm转换为px以显示在屏幕上，这里使用TypeConverter的特性如下代码：
public partial class RichTextBlock : UserControl { public RichTextBlock() { InitializeComponent(); } [TypeConverter( typeof (CustomLengthConverter))] public Double txtWidth { get { return this .txtBlock.Width; } set { this .txtBlock.Width = value; } } public Double txtHeight { get { return this .txtBlock.Height; } set { this .txtBlock.Height = value; } } }
三、在引用这个自定义控件的时候可以设置其自定义属性如下代码所示：
< this :RichTextBlock VerticalAlignment = " Top " txtHeight = " 150 " txtWidth = " 2 cm " />
扫一扫
205
被折叠的 条评论
为什么被折叠?
到【灌水乐园】发言
