WPF 與Surface 2.0 SDK 親密接觸 - ScatterView 資料綁定篇

     與我們常用的一些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 隻顯示出圖檔路徑及名稱而不是圖檔本身（如下圖）。

<Grid>      <s:ScatterView x:Name="mainScatterView">          <s:ScatterView.ItemTemplate>              <DataTemplate>                  <Image Source="{Binding}"/>              </DataTemplate>          </s:ScatterView.ItemTemplate>      </s:ScatterView>  </Grid>