在上次項目中寫過多篇關于拖拽的實現. 這些拖拽都是控件之間的效果. Silverlight 4 中我們甚至可以直接把文件系統中文件拖拽到Silverlight Application中承載. 這就是 silverlight 4中新特性Silverlight As Drop Target 支持這一點. 為了達到演示目的. 使用桌面圖片拖拽到Silverlight Application中ScrollViewer動態顯示. 先體驗一下[你可以嘗試從本地文件系統直接拖拽圖片到這個Silverlight Application中看一下效果]:
實現步驟:
<1>: 頁面布局
<StackPanel?x:Name="LayoutRoot"?Background="White"> ? ?????????<TextBlock?Text="??"></TextBlock> ? ?????????<TextBlock?Text="Silverlight?AS?Drop?target.-chenkai[10.6.28]"?VerticalAlignment="Center"?HorizontalAlignment="Left"?FontSize="16"?Foreground="Red"??FontFamily="Comic?Sans?MS"?FontWeight="BOld"?Height="25"?Width="655"?/> ? ?????????<ScrollViewer?x:Name="ImagesTarget"?Background="White"??Height="360"?BorderBrush="Red"? ???????????????????????VerticalScrollBarVisibility="Hidden"?HorizontalScrollBarVisibility="Auto"?AllowDrop="True"> ? ?????????????????<ItemsControl?x:Name="ImageList"?Height="353"> ? ?????????????????????<!? ?????????????????????<ItemsControl.ItemTemplate> ??????????????????????????<DataTemplate> ? ?????????????????????????????<Image?Source="{Binding}"?Margin="5"?Stretch="UniformToFill"?Height="240"?/> ? ?????????????????????????</DataTemplate> ??????????????????????</ItemsControl.ItemTemplate> ? ?????????????????????<!? ?????????????????????<ItemsControl.ItemsPanel> ??????????????????????????<ItemsPanelTemplate> ? ?????????????????????????????<StackPanel?Orientation="Horizontal"?VerticalAlignment="Center"?HorizontalAlignment="Center"/> ? ?????????????????????????</ItemsPanelTemplate> ??????????????????????</ItemsControl.ItemsPanel> ??????????????????</ItemsControl> ??????????????</ScrollViewer> ??????</StackPanel>?<2>:后臺實現代碼
//定義存儲Image集合. ??????????ObservableCollection<BitmapImage>?_images?=?new?ObservableCollection<BitmapImage>(); ?? ? ?????????public?MainPage() ? ?????????{ ??????????????InitializeComponent(); ??????????????this.Loaded?+=?new?RoutedEventHandler(MainPage_Loaded); ??????????} ?? ??????????void?MainPage_Loaded(object?sender,?RoutedEventArgs?e) ??????????{ ??????????????//如果Image數據則直接加載進來. ??????????????ImageList.ItemsSource?=?_images; ? ?????????????ImagesTarget.Drop?+=?new?DragEventHandler(ImagesTarget_Drop); ? ?????????} ??????????void?ImagesTarget_Drop(object?sender,?DragEventArgs?e) ??????????{ ??????????????//判斷拖拽數據是否存在 ? ?????????????if?(e.Data?==?null) ? ?????????????{ ? ?????????????????return; ? ?????????????} ? ?????????????else? ?????????????{ ??????????????????//利用Fileinfo?來初始化關于文件系統日常操作io對象?Fileinfo?【】數組?意味支持多張Image同時拖拽Silverlight?Application ? ?????????????????IDataObject?dataObject?=?e.Data?as?IDataObject; ? ?????????????????FileInfo[]?files?=dataObject.GetData(DataFormats.FileDrop)?as?FileInfo[]; ? ? ? ?????????????????foreach?(FileInfo?file?in?files) ? ?????????????????{ ??????????????????????try ??????????????????????{ ??????????????????????????using?(var?stream?=?file.OpenRead()) ??????????????????????????{ ??????????????????????????????//讀取拖拽中圖片源. ??????????????????????????????var?imageSource?=?new?BitmapImage(); ??????????????????????????????imageSource.SetSource(stream); ??????????????????????????????//添加到集合中. ? ?????????????????????????????_images.Add(imageSource); ? ?????????????????????????} ??????????????????????} ??????????????????????catch?(Exception) ??????????????????????{ ? ?????????????????????????MessageBox.Show("Not?a?suppoted?image."); ? ?????????????????????} ??????????????????} ??????????????} ??????????} ?因為前臺ScrollView中DataTemplate中定義格式是Image綁定. 后臺數據源用到ObservableCollection<BitmapImage>來封裝從拖拽中得到圖片數據. 另外一個就是FileInfo,提供創建、復制、刪除、移動和打開文件的實例方法,并且幫助創建?FileStream?對象, 既然通過Fileinfo得到FileStream對象 其他操作就是平常IO操作. 而Fileinfo[]數組則是用來支持同時拖拽多個對象.關于Fileinfo 更多詳細資料請參見MSDN.
本文轉自chenkaiunion 51CTO博客,原文鏈接:http://blog.51cto.com/chenkai/764886
總結
以上是生活随笔為你收集整理的Silverlight 4 新特性之Silverlight as Drop Target的全部內容,希望文章能夠幫你解決所遇到的問題。
如果覺得生活随笔網站內容還不錯,歡迎將生活随笔推薦給好友。