与我们常用的一些WPF 控件相同,ScatterView 控件也支持数据绑定功能。本篇将演示如何利用ScatterView 绑定Win7 系统中的样例图片,并且每张图片会以独立的ScatterViewItem 形式展现出来。
首先,新建一个Surface Application(WPF) 项目,在Grid 中添加ScatterView 控件,并命名为mainScatterView。
<Grid>
<s:ScatterView x:Name="mainScatterView">
</s:ScatterView>
</Grid>
在C# 代码中将“Sample Pictures”目录下的图片全部添加到ScatterView 的ItemsSource。
string imagesPath = @"C:\Users\Public\Pictures\Sample Pictures\";
try
{
mainScatterView.ItemsSource = System.IO.Directory.GetFiles(imagesPath, "*.jpg");
}
catch (System.IO.DirectoryNotFoundException)
{
// Write Error info here.
}
按下 F5 运行程序,ScatterView 会为每张图片创建一个ScatterViewItem 控件。但是由于XAML 代码中没有编写任何样式模板,所以ScatterViewItem 只显示出图片路径及名称而不是图片本身(如下图)。
NoBinding
为了将图片在ScatterViewItem 显示出来,我们需要定义一个ItemTemplate,它可以使Image 对象与ScatterViewItem 控件绑定在一起。如下代码所示,DataTemplate 设置好数据源是Image 对象即可。
<Grid>
<s:ScatterView x:Name="mainScatterView">
<s:ScatterView.ItemTemplate>
<DataTemplate>
<Image Source="{Binding}"/>
</DataTemplate>
</s:ScatterView.ItemTemplate>
</s:ScatterView>
</Grid>
再次运行程序,ScatterViewItem 控件会依照ItemTemplate 属性重新创建,同时图片也会在ScatterView 控件中正常的显示。至此我们便完成了ScatterView 的绑定功能,便可以随意的对图片进行Manipulating 操作。
本文转自Gnie博客园博客,原文链接:http://www.cnblogs.com/gnielee/archive/2011/07/18/wpf-surface2sdk-binding.html,如需转载请自行联系原作者