Windows Phone開發之路(14) 載入位元影像

　　除了文本之外，位元影像是Silverlight程式中最常見的對象之一，通常我們將其定義為與圖形顯示裝置的像素相對應的二維位元(bit)數組。
　　Windows原生的位元影像檔案的副檔名是bmp，但是近年它已不佔主導地位，而壓縮格式開始廣泛流行。目前，3種最主流的位元影像格式為：

• JPEG(Joint Photography Experts Group,JPEG 格式)
• PNG(Portable Network Graphics，攜帶型網狀圖像)
• GIF(Graphics Interchange File，圖形分頁檔)

　　Silverlight只支援JPEG和PNG格式。

載入本地位元影像

　　一，利用Silverlight中的Image元素載入本地位元影像

　　　　XAML代碼：

<Grid x:Name="ContentPanel" Grid.Row="1" Margin="12,0,12,0">
            <Image Source="images/photo.jpg"
                   Stretch="None"/>
</Grid>

　　　　註：Stretch="None"表示以原始大小顯示位元影像
　　　　效果

　　二，利用C#代碼載入本地位元影像

　　　　XAML代碼：

 <Grid x:Name="ContentPanel" Grid.Row="1" Margin="12,0,12,0">
            <Button Name="btnLoad" 
                    Content="利用C#代碼載入本地位元影像"
                    HorizontalAlignment="Center"
                    VerticalAlignment="Top"
                    Click="btnLoad_Click"/>
            <Image Name="img"
                   Stretch="None"/>
</Grid>

　　　　C#代碼：

public partial class MainPage : PhoneApplicationPage
    {
// 建構函式
        public MainPage()
        {
            InitializeComponent();
        }

private void btnLoad_Click(object sender, RoutedEventArgs e)//處理按鈕單擊事件
        {
//Uri uri = new Uri("/SilverlightTapToLoad;component/images/photo.jpg", UriKind.Relative);//建立Uri對象，此時位元影像的Build Action為Resource。
            Uri uri = new Uri("images/photo.jpg", UriKind.Relative);//此時位元影像的Build Action為Content

            StreamResourceInfo resourceinfo = Application.GetResourceStream(uri);//調用Application類的GetResourceStream方法訪問資源檔並返回StreamResourceInfo
            BitmapImage bmp = new BitmapImage();//建立一個BitmapImage對象作為資料來源
            bmp.SetSource(resourceinfo.Stream);//調用SetSource方法擷取資源中的流
            img.Source = bmp;//設定位元影像的資料來源
        }
    }

　　　　效果

操作手機圖片庫

　　下面的執行個體是利用PhotoChooserTask選取器查看手機圖片庫中的圖片。

　　XAML代碼：

<Grid x:Name="LayoutRoot" Background="Transparent">
        <Button Name="btnPhotoChooser"
                Content="圖片選取器"
                HorizontalAlignment="Center"
                VerticalAlignment="Top"
                Padding="0,34"
                Click="btnPhotoChooser_Click"/>
        <Image Name="imgChooser"/>
</Grid>

　　C#代碼：

public partial class MainPage : PhoneApplicationPage
    {
        PhotoChooserTask choosePhoto = new PhotoChooserTask();//建立一個PhotoChooserTask對象

// 建構函式
        public MainPage()
        {
            InitializeComponent();

this.choosePhoto.Completed += choosePhoto_Completed;//註冊事件處理常式，擷取選取器操作的結果
        }

private void btnPhotoChooser_Click(object sender, RoutedEventArgs e)//處理按鈕單擊事件
        {
            choosePhoto.Show();//啟動圖片選取器
        }

void choosePhoto_Completed(object sender, PhotoResult e)//事件處理常式,PhotoResult類表示通過調用PhotoChooserTask返回的圖片
        {
if (e.TaskResult == TaskResult.OK)//任務成功完成,TaskResult表示任務是否完成
            {
                CompleteChooserTask(e);//調用方法，顯示圖片
            }
        }

protected void CompleteChooserTask(PhotoResult e)
        {
var bmp = new BitmapImage();//建立一個BitmapImage對象作為Image元素的資料來源。等價於BitmapImage bmp=new BitmapImage()
            bmp.SetSource(e.ChosenPhoto);//調用SetSource方法擷取照片的資料流。
            this.imgChooser.Source = bmp;//設定Image元素的資料來源顯示圖片
        }
    }

　　效果