一.前言
申明:WPF自定義控件與樣式是一個系列文章,前後是有些關聯的,但大多是按照由簡到繁的順序逐漸釋出的等,若有不明白的地方可以參考本系列前面的文章,文末附有部分文章連結。
本文主要針對WPF項目開發中圖檔的各種使用問題,經過總結,把一些經驗分享一下。内容包括: WPF常用圖像資料源ImageSource的建立; 自定義縮略圖控件ThumbnailImage,支援網絡圖檔、大圖檔、圖檔異步加載等特性; 動态圖檔gif播放控件; 圖檔清單樣式,支援大資料量的虛拟化;
二. WPF常用圖像資料源ImageSource的建立
這是一個普通Image控件的使用,Source的資料類型是ImageSource,在XAML中可以使用檔案絕對路徑或相對路徑,ImageSource是一個抽象類,我們一般使用BitmapSource、BitmapImage等。
但在實際項目中,有各種各樣的需求,比如:
從Bitmap建立ImageSource對象;
從資料流byte[]建立ImageSource對象;
從System.Drawing.Image建立ImageSource對象;
從一個大圖檔檔案建立一個指定大小的ImageSource對象;
2.1 從System.Drawing.Image建立指定大小ImageSource對象
2.2 從一個大圖檔檔案建立一個指定大小的ImageSource對象
2.3 從Bitmap建立指定大小的ImageSource對象
2.4 從資料流byte[]建立指定大小的ImageSource對象
三.自定義縮略圖控件ThumbnailImage
ThumbnailImage控件的主要解決的問題:

為了能擴充支援多種類型的縮略圖,設計了一個簡單的模式,用VS自帶的工具生成的代碼視圖:
3.1 多種類型的縮略圖擴充
首先定義一個圖檔類型枚舉:
然後定義了一個接口,生成圖檔資料源ImageSource
如上面的代碼視圖,有三個實作,視訊縮略圖VedioThumbnailProvider沒有實作完成,基本方法是利用一個第三方工具ffmpeg來擷取第一幀圖像然後建立ImageSource。
ImageThumbnailProvider:普通圖檔縮略圖實作(調用的2.2方法):
WebImageThumbnailProvider:網絡圖檔縮略圖實作(下載下傳圖檔資料後調用2.1方法):
簡單工廠ThumbnailProviderFactory實作:
3.2 縮略圖控件ThumbnailImage
先看看效果圖吧,下面三張圖檔,圖1是本地圖檔,圖2是網絡圖檔,圖3也是網絡圖檔,為什麼沒顯示呢,這張圖檔用的是國外的圖檔連結位址,異步加載(加載比較慢,還沒出來的!)
ThumbnailImage實際是繼承在微軟的圖檔控件Image,是以沒有樣式代碼,繼承之後,主要的目的就是重寫Imagesource的處理過程,詳細代碼:
View Code
其中異步用的線程池執行圖檔加載, Executer.TryRunByThreadPool是一個輔助方法,用于線上程池中執行一個委托方法。緩存的實作用的是另外一個輕量級記憶體緩存組建(使用微軟HttpRuntime.Cache的緩存機制),關于緩存的方案網上很多,這裡就不介紹了。
示例代碼:
四.動态圖檔gif播放控件
實作代碼:
五.圖檔清單樣式,支援大資料量的虛拟化
先看看效果圖(gif圖,有點大):
用的是ListView作為清單容器,因為Listview支援靈活的擴充,為了實作上面的效果,集合容器ItemsPanel隻能使用WrapPanel,樣式本身并不複雜:
主要難道在于 WrapPanel是不支援虛拟化的,網上找了一個開源的WrapPanel虛拟化實作=VirtualizingWrapPanel,它有點小bug(滑動條長度計算有時候不是很準确),不過完全不影響使用,代碼:
附錄:參考引用
<a href="http://www.cnblogs.com/anding/p/4961215.html" target="_blank">WPF自定義控件與樣式(1)-矢量字型圖示(iconfont)</a>
<a href="http://www.cnblogs.com/anding/p/4968050.html" target="_blank">WPF自定義控件與樣式(2)-自定義按鈕FButton</a>
<a href="http://www.cnblogs.com/anding/p/4970845.html" target="_blank">WPF自定義控件與樣式(3)-TextBox & RichTextBox & PasswordBox樣式、水印、Label标簽、功能擴充</a>
<a href="http://www.cnblogs.com/anding/p/4976559.html" target="_blank">WPF自定義控件與樣式(4)-CheckBox/RadioButton自定義樣式</a>
<a href="http://www.cnblogs.com/anding/p/4979764.html">WPF自定義控件與樣式(5)-Calendar/DatePicker日期控件自定義樣式及擴充</a>
<a href="http://www.cnblogs.com/anding/p/4987426.html">WPF自定義控件與樣式(6)-ScrollViewer與ListBox自定義樣式</a>
<a href="http://www.cnblogs.com/anding/p/4990492.html">WPF自定義控件與樣式(7)-清單控件DataGrid與ListView自定義樣式</a>
<a href="http://www.cnblogs.com/anding/p/4993655.html" target="_blank">WPF自定義控件與樣式(8)-ComboBox與自定義多選控件MultComboBox</a>
<a href="http://www.cnblogs.com/anding/p/4996614.html" target="_blank">WPF自定義控件與樣式(9)-樹控件TreeView與菜單Menu-ContextMenu</a>
<a href="http://www.cnblogs.com/anding/p/5006279.html">WPF自定義控件與樣式(11)-等待/忙/正在加載狀态-控件實作</a>
個人能力有限,本文内容僅供學習、探讨,歡迎指正、交流。