完美實作類別似QQ的自拍頭像、上傳頭像功能！（Demo 源碼）

標籤：解析度   title   dex   大小   解決   bar   target   圖片   設定   

現在很多下載用戶端程式都需要設定自己頭像的功能，而設定頭像一般有兩種方式：使用網路攝影機自拍頭像，或者選擇一個圖片的某部分地區作為自己的頭像。

一.相關技術

　　若要實現上述的自拍頭像和上傳頭像的功能，會碰到以下要解決的問題：

（1）調用網路攝影機，捕獲網路攝影機採集的視頻，並將採集的視頻繪製到UI上。

（2）從圖片檔案讀取Image，並顯示在控制項上（這個相當easy）。

（3）在顯示的視頻或圖片上，能夠拖動一個正方形，以選擇指定部分的地區作為自己的頭像。

（4）從視頻中截獲一幀儲存為圖片。

（5）從圖片中截取某個地區作為自己的頭像。

　　為瞭解決這些問題，就需要涉及到的技術有DirectX Show、GDI+、drawdib（位元影像繪製）、映像截取等。

二.Demo實現

　　當然這篇文章不是要告訴大家這些技術的詳細細節，相關的資料網上有很多，如果需要從頭到尾自己實現，可以從瞭解這些技術入手。在這裡，我將傲瑞通（OrayTalk）中的設定頭像的功能拆分出來做成一個demo，供大家參考和使用，避免大家浪費時間重複發明輪子。我們先看看demo的運行效果。

　　自拍頭像：

      

　　上傳頭像：

      

　　在demo中，點擊表單上的確定按鈕，就會自動將所選擇地區的映像儲存為自己的頭像了。這是怎麼做到的了？實際上，我們是使用了OMCS提供的兩個控制項：HeadImagePanel和ImagePartSelecter。

1.HeadImagePanel 控制項

　　先看看HeadImagePanel控制項的定義吧：

    public class HeadImagePanel : UserControl    {  
        // 當選擇的頭像地區發生改變時，會觸發此事件。參數為頭像位元影像。        public event CbGeneric<Bitmap> HeadImageSelected;
        // 擷取結果頭像。        public Bitmap GetHeadImage();
        // 初始化網路攝影機，並啟動它。             
　　　　 //   cameraDeviceIndex: 網路攝影機的索引        //   cameraSize: 網路攝影機採集解析度        //   outputImageLen: 輸出的正方形頭像的邊長        public void Start(int cameraDeviceIndex, Size cameraSize, int outputImageLen);

       // 停止網路攝影機。        public void Stop();    }

（1）將HeadImagePanel拖到表單上，然後調用其Start方法，它就會自動啟動網路攝影機，並將捕捉的視頻繪製帶該控制項的表面上，而且，同時會在視頻的上面繪製藍邊的正方形，我們可以通過拖動或改變這個正方形的大小，來指定選擇的地區。

（2）當地區指定好後，可以調用其GetHeadImage方法，其就會返回最終的結果映像（即指定地區內的視頻映像）。

（3）使用完畢後，調用HeadImagePanel的Stop方法以釋放網路攝影機及相關的其它資源。

（4）要特別注意的是，請將HeadImagePanel控制項的Size設定為與網路攝影機採集解析度一樣的大小。否則，結果映像將是有偏差的。

2.ImagePartSelecter 控制項

　　映像地區選取項目控制項ImagePartSelecter的定義如下： 

    public class ImagePartSelecter : UserControl    {       
　　     // 當選擇的地區發生改變時，會觸發此事件。事件參數為原始圖片的選擇地區。        public event CbGeneric<Bitmap> ImagePartSelected;        
　　
　　　　 // 擷取結果圖片（原始圖片的選擇地區）。        public Bitmap GetResultImage();
       // 初始化。             　　
       // outputImgLen: 最終要輸出的正方形圖片的邊長。        public void Initialize(int outputImgLen);
       // 指定要被選取的圖片。        public void SetSourceImage(Image image);    }

（1）將ImagePartSelecter控制項拖到表單上，調用Initialize方法初始化。

（2）調用SetSourceImage方法設定原始的頭像圖片，這樣，圖片會顯示在控制項的表面，而且ImagePartSelecter會在映像的上面繪製藍邊的正方形，我們可以通過拖動或改變這個正方形的大小，來指定選擇的地區。

（3）當地區指定好後，可以調用其GetResultImage方法，其就會返回最終的結果映像（即指定地區內的映像）。

（4）與HeadImagePanel控制項不一樣的是，不需要將ImagePartSelecter控制項的Size設定為與圖片一樣的大小，ImagePartSelecter內部會自動縮放並適應。 

三.源碼下載

　　 自拍頭像Demo（源碼）

 　　源碼就不貼出來了，大家下載自己看吧：）

　　

　　 如果覺得這篇文章對你有協助，請頂一下，並粉我啊，嘿嘿

完美實作類別似QQ的自拍頭像、上傳頭像功能！（Demo 源碼）