定义一个ImageConverter,该类继续于IValueConverter
这里使用ImageConverter把图片字符串的形式转成BitmapImage对象
代码如下:
[ValueConversion(typeof(string), typeof(BitmapImage))]
public class ImageConverter : IValueConverter
{
/// <summary>
/// 把对象转换为WPF程序中绑定目标(即控件的某个属性)可以使用的类型数据
/// </summary>
/// <param name="value">要转换的对象</param>
/// <param name="targetType">标示所需要的类型</param>
/// <param name="parameter">转换所需的参数</param>
/// <param name="culture"></param>
/// <returns></returns>
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;//返回BitmapImage对象
}
catch
{
return new BitmapImage();
}
}
/// <summary>
/// 与Convert相反,可以将控件的属性再转变成数据源类型的对象
/// </summary>
/// <param name="value"></param>
/// <param name="targetType"></param>
/// <param name="parameter"></param>
/// <param name="culture"></param>
/// <returns></returns>
public object ConvertBack(object value, Type targetType, object parameter, System.Globalization.CultureInfo culture)
{
//将图片类型转成数据
BitmapImage img = value as BitmapImage;
return img.UriSource.AbsoluteUri;
}
}
//添加数据源
public partial class MainWindow : Window
{
public MainWindow()
{
InitializeComponent();
List<Customer> listCustomer = new List<Customer>()
{
new Customer(){ ImageUrl = "1.jpg", Name="zhangjinshan1", Sex="男"},
new Customer(){ ImageUrl = "2.jpg", Name="zhangjinshan2", Sex="女"},
new Customer(){ ImageUrl = "3.jpg", Name="zhangjinshan3", Sex="男"},
new Customer(){ ImageUrl = "4.jpg", Name="zhangjinshan4", Sex="女"}
};
this.listbox1.DataContext = listCustomer;
}
public class Customer
{
public string Name { get; set; }
public string ImageUrl { get; set; }
public string Sex { get; set; }
}
XAML:
<Window x:Class="WpfApplication5.MainWindow"
xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
xmlns:my="clr-namespace:WpfApplication5"
Title="MainWindow" Height="350" Width="525">
<Window.Resources>
<my:ImageConverter x:Key="ImageCoverter"/>
<Style TargetType="{x:Type ListView}">
<Setter Property="BorderThickness" Value="1"/>
</Style>
<Style TargetType="{x:Type Image}" x:Key="image">
<Setter Property="Margin" Value="0,10,0,10"/>
</Style>
</Window.Resources>
<StackPanel>
<ListView Width="300" Height="300" x:Name="listbox1" ItemsSource="{Binding Path=.}">
<ListView.View>
<GridView>
<GridViewColumn Header="姓名" DisplayMemberBinding="{Binding Name}" Width="120"/>
<GridViewColumn Header="照片">
<GridViewColumn.CellTemplate>
<DataTemplate>
<Image Width="60" Style="{StaticResource ResourceKey=image}" x:Name="img" Height="60" Stretch="Fill"
Source="{Binding ImageUrl, Mode=TwoWay, Converter={StaticResource ResourceKey=ImageCoverter}}"/>
</DataTemplate>
</GridViewColumn.CellTemplate>
</GridViewColumn>
<GridViewColumn Header="性别" DisplayMemberBinding="{Binding Sex}" Width="70"/>
</GridView>
</ListView.View>
</ListView>
</StackPanel>
</Window>
图: