Windows Phone實用開發技巧（38）：圖片拼接

圖片拼接是拼圖中一種，即將若干圖片拼接成一張大圖。本文將講述如何在windows phone中實現圖片的拼接。

首先，我們準備一些拼圖的原始圖片，這些圖片的長度、寬度各不一樣，並且也不是等比例。

private int width = 480;private int totalHeight = 0;string[] array = new string[] { "1.jpg", "2.jpg", "3.jpg", "4.jpg" };WriteableBitmap[] imagearray;int[] heightarray;

一些常量的定義，array數組儲存的是待拼接的圖片列表

imagearray儲存的是圖片對應的WriteableBitamp對象

heightarray儲存的是圖片按比例縮放後的高度（寬度都為480）

totalHeight表示圖片拼接後的總高度

我們在頁面中方式一個ScrollViewer，然後將圖片都放置在一個Canvas中，設定圖片的距離頂部距離，最後將Canvas方式到ScrollViewer中：

private void Join(){    //images container    Canvas canvas = new Canvas();    //init array    imagearray = new WriteableBitmap[array.Length];    heightarray = new int[array.Length];    for (int i = 0; i < array.Length; i++)    {        WriteableBitmap bitmap = FromContent(string.Format("Images/{0}", array[i]));        double wr = width / (double)bitmap.PixelWidth;        int height = (int)(bitmap.PixelHeight * wr);        Image img = new Image() { Source = bitmap, Stretch = Stretch.Fill, Width = width, Height = height };        Canvas.SetLeft(img, 0);        Canvas.SetTop(img, totalHeight);        canvas.Children.Add(img);        totalHeight += height;        imagearray[i] = bitmap;        heightarray[i] = height;    }    canvas.Height = totalHeight;    scrollviewer.Content = canvas;}

其中需要注意的就是將圖片按比例縮放，為了防止儲存圖片時候重新計算一遍高度，我們將高度和圖片儲存到資料中。

下面來看一下儲存的方法，我們需要得到一個ScrollViewer的WriteableBitmap，那麼能不能使用直接對UI元素的截屏呢？答案是否定的，因為截屏我們只能得到螢幕大小的圖片，不能得到整個長圖。

那麼我們應該怎麼做呢，其實思路跟上面的展示方式一樣，我們將圖片拼接起來，具體的代碼如下：

//遍曆，將每張圖copy至大圖的相應位置WriteableBitmap output = new WriteableBitmap(width, totalHeight);int toTop = 0;for (int i = 0; i < imagearray.Length; i++){    var wb = imagearray[i].Resize(width, heightarray[i], WriteableBitmapExtensions.Interpolation.NearestNeighbor);    Rect dest = new Rect(0, toTop, width, heightarray[i]);    Rect source = new Rect(0, 0, width, heightarray[i]);    output.Blit(dest, wb, source);    toTop += heightarray[i];}SaveImage(output);

遍曆圖片，將圖片copy至一張大圖的某些部分

儲存方法是將圖片儲存到相簿中，當然我們也可以儲存到隔離儲存區 (Isolated Storage)空間中：

private void SaveImage(WriteableBitmap bit){    string msg = "";    try    {        byte[] imageBuffer;        using (MemoryStream memoryStream = new MemoryStream())        {            bit.SaveJpeg(memoryStream, bit.PixelWidth, bit.PixelHeight, 0, 100);            imageBuffer = memoryStream.ToArray();        }        using (MediaLibrary library = new MediaLibrary())        {            library.SavePicture(string.Format("{0}.jpg", DateTime.Now.ToFileTime().ToString()), imageBuffer);        }        msg = "儲存成功";    }    catch (Exception ex)    {        msg = "儲存失敗";    }    finally    {        MessageBox.Show(msg);    }}

原始碼你可以在這裡找到.