在Silverlight中，我们的数据列表显示控件有ListBox、DataGrid等。对于显示出来的数据条目样式外观的管理是通过DataTemplate（数据模板）来完成的。本节将从DataTemplate基础说起如何使用DataTemplate。
首先我们准备数据源如下:
/// <summary> /// 文章Model /// </summary> public class ArticleModel { public string ArtName { get; set; } public string ArtContent { get; set; } public string ArtAuthor { get; set; } public string ArtUpdateTime { get; set; } } /// <summary> /// 文章列表 /// </summary> public class ArtList { public ArtList() { ArticleList = new List<ArticleModel>(); ArticleList.Add(new ArticleModel() { ArtName = "成都", ArtContent = "天府之国", ArtAuthor = "leung", ArtUpdateTime = "2012-04-05 11:12:36" }); ArticleList.Add(new ArticleModel() { ArtName = "上海", ArtContent = "翡翠明珠", ArtAuthor = "aiLen", ArtUpdateTime = "2012-05-16 21:32:10" }); ArticleList.Add(new ArticleModel() { ArtName = "广州", ArtContent = "沿海城市", ArtAuthor = "minghe", ArtUpdateTime = "2012-01-17 05:01:45" }); ArticleList.Add(new ArticleModel() { ArtName = "西藏", ArtContent = "高原城市", ArtAuthor = "weifeng", ArtUpdateTime = "2012-03-22 09:30:14" }); } /// <summary> /// 文章列表属性 /// </summary> public List<ArticleModel> ArticleList { get; set; } }
如何在前台控件中绑定数据源呢？如同上一节所述，设置一个静态资源
//引用域名空间
xmlns:local="clr-namespace:SLDataTemplate" //初始化为静态资源
<UserControl.Resources> <local:ArtList x:Key="SourceList"></local:ArtList> </UserControl.Resources> //设置为数据上下文
<Grid x:Name="LayoutRoot" Background="White" DataContext="{StaticResource SourceList}"> //设置数据源绑定
<ListBox x:Name="lbArt" ItemsSource="{Binding ArticleList}" /> </Grid>
其次以ListBox为例，在本文中有三种方式：
一、在ListBox.ItemTemplate中直接添加DataTemplate。
<ListBox x:Name="lbArt" ItemsSource="{Binding ArticleList}" Width="350" Height="300" HorizontalAlignment="Left" VerticalAlignment="Top" > <ListBox.ItemTemplate> <DataTemplate> <StackPanel Orientation="Horizontal"> <TextBlock Text="{Binding ArtName}"></TextBlock> <TextBox Text="{Binding ArtContent}"></TextBox> <TextBox Text="{Binding ArtAuthor}"></TextBox> <TextBlock Text="{Binding ArtUpdateTime}"></TextBlock> </StackPanel> </DataTemplate> </ListBox.ItemTemplate> </ListBox>
二、将DataTemplate作为Resources，ListBox中属性 ItemTemplate="{StaticResource lbTmp}"引用。
<UserControl.Resources>
<DataTemplate x:Key="lbTmp">
<StackPanel Orientation="Horizontal">
<TextBlock Text="{Binding ArtName}"></TextBlock>
<TextBox Text="{Binding ArtContent}"></TextBox>
<TextBox Text="{Binding ArtAuthor}"></TextBox>
<TextBlock Text="{Binding ArtUpdateTime}"></TextBlock>
</StackPanel>
</DataTemplate>
</UserControl.Resources>
<ListBox x:Name="lbRes" ItemsSource="{Binding ArticleList}" ItemTemplate="{StaticResource lbTmp}" Margin="370 0 0 0 " HorizontalAlignment="Left" VerticalAlignment="Top" Width="350" Height="300" > </ListBox>三、将DataTemplate在后台代码编写，然后在后台代码中指定。
//前台代码
<ListBox x:Name="lbCsRet" Margin="0 370 0 0 " HorizontalAlignment="Left" VerticalAlignment="Top" Width="350" Height="300" > </ListBox>
//后台代码
public MainPage() { InitializeComponent(); DataTemplate dtemp = GetTemplate(); this.lbCsRet.ItemTemplate = dtemp; this.lbCsRet.ItemsSource = new ArtList().ArticleList; } private DataTemplate GetTemplate() { string xamlString = @"<DataTemplate xmlns=""http://schemas.microsoft.com/winfx/2006/xaml/presentation"" xmlns:x=""http://schemas.microsoft.com/winfx/2006/xaml""> <StackPanel Orientation=""Horizontal""> <TextBlock Text=""{Binding ArtName}""></TextBlock> <TextBox Text=""{Binding ArtContent}""></TextBox> <TextBox Text=""{Binding ArtAuthor}""></TextBox> <TextBlock Text=""{Binding ArtUpdateTime}""></TextBlock> </StackPanel> </DataTemplate>"; return (DataTemplate)XamlReader.Load(xamlString); }
最后我们可以看看同样在DataGrid中使用DataTemplate。
<sdk:DataGrid ItemsSource="{Binding ArticleList}" Margin="370 370 0 0 " HorizontalAlignment="Left" VerticalAlignment="Top" Width="350" Height="300" AutoGenerateColumns="False" > <sdk:DataGrid.Columns> <sdk:DataGridTemplateColumn Header="列表" CellTemplate="{StaticResource lbTmp}"> </sdk:DataGridTemplateColumn> </sdk:DataGrid.Columns> </sdk:DataGrid>
下面我们来看看运行效果，如需源码请点击 SLDataTemplate.zip 下载。
本文转自程兴亮 51CTO博客，原文链接:http://blog.51cto.com/chengxingliang/855588
