此例子来自《深入浅出WPF》,刘铁猛。
VS2010
源码1:不使用Bingding
源码2:使用Binding
下面展示一些代码:
主窗体XAML代码:
<Window x:Class="WpfApplication1.MainWindow"
xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
xmlns:local="clr-namespace:WpfApplication1"
Title="MainWindow" Height="350" Width="623" ResizeMode="NoResize">
<Window.Resources>
<local:AutomakerToLogoPathConverter x:Key="a2l"></local:AutomakerToLogoPathConverter>
<local:NameToPhotoPathConverter x:Key="n2p"></local:NameToPhotoPathConverter> <DataTemplate x:Key="carDetailViewTemplate">
<Border BorderBrush="Black" BorderThickness="1" CornerRadius="6">
<StackPanel Margin="5">
<Image Width="400" Height="250" Source="{Binding Name,Converter={StaticResource n2p}}"></Image>
<StackPanel Orientation="Horizontal" Margin="5,0">
<TextBlock Text="Name:" FontWeight="Bold" FontSize="20"></TextBlock>
<TextBlock Text="{Binding Name}" FontSize="20" Margin="5,0"></TextBlock>
</StackPanel>
<StackPanel Orientation="Horizontal" Margin="5,0">
<TextBlock Text="Automaker:" FontWeight="Bold"></TextBlock>
<TextBlock Text="{Binding Automaker}" Margin="5,0"></TextBlock>
<TextBlock Text="Year:" FontWeight="Bold"></TextBlock>
<TextBlock Text="{Binding Year}" Margin="5,0"></TextBlock>
<TextBlock Text="Top Speed:" FontWeight="Bold"></TextBlock>
<TextBlock Text="{Binding TopSpeed}" Margin="5,0"></TextBlock>
</StackPanel>
</StackPanel>
</Border>
</DataTemplate>
<DataTemplate x:Key="carListItemViewTemplate">
<Grid Margin="2">
<StackPanel Orientation="Horizontal">
<Image Source="{Binding Automaker,Converter={StaticResource a2l}}" Grid.RowSpan="3" Width="64" Height="64"></Image>
<StackPanel Margin="5,10">
<TextBlock Text="{Binding Name}" FontSize="16" FontWeight="Bold"></TextBlock>
<TextBlock Text="{Binding Year}" FontSize="14"></TextBlock>
</StackPanel>
</StackPanel>
</Grid>
</DataTemplate>
</Window.Resources>
<StackPanel Orientation="Horizontal" Margin="5">
<UserControl ContentTemplate="{StaticResource carDetailViewTemplate}" Content="{Binding SelectedItem,ElementName=listBoxCars}"></UserControl>
<ListBox x:Name="listBoxCars" Width="180" Margin="5,0" ItemTemplate="{StaticResource carListItemViewTemplate}"></ListBox>
</StackPanel>
</Window>
XAML文件
主窗体XAML文件的后台:
using System;
using System.Collections.Generic;
using System.Linq;
using System.Text;
using System.Windows;
using System.Windows.Controls;
using System.Windows.Data;
using System.Windows.Documents;
using System.Windows.Input;
using System.Windows.Media;
using System.Windows.Media.Imaging;
using System.Windows.Navigation;
using System.Windows.Shapes;namespace WpfApplication1
{
/// <summary>
/// MainWindow.xaml 的交互逻辑
/// </summary>
public partial class MainWindow : Window
{
public MainWindow()
{
InitializeComponent();
InitialCarList();
} private void InitialCarList()
{
List<Car> carList = new List<Car>()
{
new Car(){Automaker="VolksWagen",Name="Beetle",Year="",TopSpeed=""},
new Car(){Automaker="VolksWagen",Name="Golf GTI",Year="",TopSpeed=""},
new Car(){Automaker="VolksWagen",Name="Jetta",Year="",TopSpeed=""},
new Car(){Automaker="VolksWagen",Name="Pheaton",Year="",TopSpeed=""}
};
listBoxCars.ItemsSource = carList;
}
}
}
后台代码
实体Car类:
using System;
using System.Collections.Generic;
using System.Linq;
using System.Text;
using System.Windows;
using System.Windows.Controls;
using System.Windows.Data;
using System.Windows.Documents;
using System.Windows.Input;
using System.Windows.Media;
using System.Windows.Media.Imaging;
using System.Windows.Navigation;
using System.Windows.Shapes;namespace WpfApplication1
{
/// <summary>
/// MainWindow.xaml 的交互逻辑
/// </summary>
public partial class MainWindow : Window
{
public MainWindow()
{
InitializeComponent();
InitialCarList();
} private void InitialCarList()
{
List<Car> carList = new List<Car>()
{
new Car(){Automaker="VolksWagen",Name="Beetle",Year="",TopSpeed=""},
new Car(){Automaker="VolksWagen",Name="Golf GTI",Year="",TopSpeed=""},
new Car(){Automaker="VolksWagen",Name="Jetta",Year="",TopSpeed=""},
new Car(){Automaker="VolksWagen",Name="Pheaton",Year="",TopSpeed=""}
};
listBoxCars.ItemsSource = carList;
}
}
}
Car类
下面是两个Converter:
using System;
using System.Collections.Generic;
using System.Linq;
using System.Text;
using System.Windows.Data;
using System.Windows.Media.Imaging;namespace WpfApplication1
{
class AutomakerToLogoPathConverter:IValueConverter
{
#region IValueConverter 成员 public object Convert(object value, Type targetType, object parameter, System.Globalization.CultureInfo culture)
{
string uriStr = string.Format(@"/Resources/Logos/{0}.jpg",(string)value);
return new BitmapImage(new Uri(uriStr, UriKind.Relative));
} public object ConvertBack(object value, Type targetType, object parameter, System.Globalization.CultureInfo culture)
{
throw new NotImplementedException();
} #endregion
}
}
AutomakerToLogoPathConverter
using System;
using System.Collections.Generic;
using System.Linq;
using System.Text;
using System.Windows.Data;
using System.Windows.Media.Imaging;namespace WpfApplication1
{
class NameToPhotoPathConverter:IValueConverter
{
#region IValueConverter 成员 public object Convert(object value, Type targetType, object parameter, System.Globalization.CultureInfo culture)
{
string uriStr = string.Format(@"/Resources/Images/{0}.jpg",(string)value);
return new BitmapImage(new Uri(uriStr, UriKind.Relative));
} public object ConvertBack(object value, Type targetType, object parameter, System.Globalization.CultureInfo culture)
{
throw new NotImplementedException();
} #endregion
}
}
NameToPhotoPathConverter
下面是文档结构: