情報
要求されたトピックは次のとおりです。しかし、このトピックはこのライブラリには含まれていません。

方法: Windows Phone 用に JPEG をエンコードしてピクチャ ライブラリに保存する

2012/02/09

このトピックでは、WriteableBitmap オブジェクトを JPEG ストリームにエンコードし、それを Windows Phone のピクチャ ライブラリに追加する方法を示します。次のタスクを実行します。

  • 適切な名前空間を追加し、サンプル用のデザイン サーフェスを作成します。

  • WriteableBitmap オブジェクトを JPEG ファイルにエンコードします。

  • JPEG を Windows Phone のピクチャ ライブラリに追加します。

重要な注重要な注:

現在リリースされている Windows Phone のエミュレーターでは、Pictures Hub での写真の表示はサポートされていません。この演習で作成される写真は、物理デバイスでのみ表示できます。

最初に、新しいプロジェクトを作成して、必要な名前空間を追加する必要があります。

注注:

次の手順は、Visual Studio 2010 Express for Windows Phone 向けです。 Visual Studio 2010 Professional や Visual Studio 2010 Ultimate のアドインを使用している場合は、メニュー コマンドやウィンドウのレイアウトが多少異なる場合があります。

このトピックは、C# 開発を基にしていますが、Visual Basic のコードも提供しています。

新しいプロジェクトを作成して名前空間を追加するには

  1. Visual Studio 2010 Express for Windows Phone で、[ファイル] メニューの [新しいプロジェクト] をクリックして新しいプロジェクトを作成します。

  2. [新しいプロジェクト] ウィンドウが表示されます。Visual C# のテンプレートを展開してから、Silverlight for Windows Phone のテンプレートを選択します。

  3. Windows Phone アプリケーション テンプレートを選択します。[名前] ボックスに選択した名前を入力します。

  4. [OK] をクリックします。[新しい Windows Phone アプリケーション] ウィンドウが表示されます。

  5. [ターゲットの Windows Phone のバージョン] メニューで、Windows Phone 7.1 が選択されていることを確認します。

  6. [OK] をクリックします。新しいプロジェクトが作成され、Visual Studio のデザイナー ウィンドウに MainPage.xaml が表示されます。

  7. [プロジェクト] メニューの [参照の追加] をクリックします。[.NET] タブで、[Microsoft.Xna.Framework] を選択し、[OK] をクリックします。

  8. メイン ページの分離コード ファイル MainPage.xaml.cs を開き、ページの先頭に次のディレクティブを追加します。

    using System.IO;
    using System.IO.IsolatedStorage;
    using Microsoft.Phone;
    using Microsoft.Xna.Framework.Media;
    using System.Windows.Resources;
    using System.Windows.Media.Imaging;
    
    

デザイン サーフェイスを作成するには

  • MainPage.xaml で、次のコードを使用して LayoutRoot という名前の Grid を置き換えます。

        <!--LayoutRoot is the root grid where all page content is placed. -->
        <Grid x:Name="LayoutRoot" Background="Transparent">
            <Grid.RowDefinitions>
                <RowDefinition Height="Auto"/>
                <RowDefinition Height="*"/>
            </Grid.RowDefinitions>
    
            <!--TitlePanel contains the name of the application and page title. -->
            <StackPanel x:Name="TitlePanel" Grid.Row="0" Margin="12,17,0,28">
                <TextBlock 
                    x:Name="ApplicationTitle" Text="PHOTOS" 
                    Style="{StaticResource PhoneTextNormalStyle}"/>
                <TextBlock 
                    x:Name="PageTitle" Text="encode" Margin="9,-7,0,0" 
                    Style="{StaticResource PhoneTextTitle1Style}"/>
            </StackPanel>
    
            <!--ContentPanel - place additional content here. -->
            <Grid x:Name="ContentPanel" Grid.Row="1" Margin="12,0,12,0">
    
                <Image 
                    Height="395" 
                    HorizontalAlignment="Left" 
                    Margin="6,6,0,0" 
                    Name="image1" 
                    Stretch="Fill" 
                    VerticalAlignment="Top" 
                    Width="444"
                    Source="TestImage.jpg"/>
    
                <RadioButton Content="camera roll" 
                                Height="72" HorizontalAlignment="Center" 
                                Margin="96,407,90,0" Name="radioButtonCameraRoll" 
                                VerticalAlignment="Top" Width="270" 
                                GroupName="AlbumGroup"/>
    
                <RadioButton Content="saved pictures" 
                                Height="72" HorizontalAlignment="Right" 
                                Margin="0,453,90,0" Name="radioButtonSavedPictures" 
                                VerticalAlignment="Top" Width="270"
                                GroupName="AlbumGroup"/>
    
                <Button Content="Save" 
                        Height="70" 
                        HorizontalAlignment="Center" 
                        Margin="6,519,0,0" 
                        Name="btnSave" 
                        VerticalAlignment="Top" 
                        Width="269" Click="btnSave_Click" />
    
            </Grid>
        </Grid>
    
    
    注注:

    前に示したコードにより、ページの上部から中央にかけて表示されるイメージ コントロールと、btnSave という名前のボタン コントロールが作成されます。これらのコントロールの向きを、次の図に示します。

ここでは、WriteableBitmap オブジェクトを JPEG ストリームにエンコードして Windows Phone のピクチャ ライブラリに追加するコードを、btnSave クリック イベント ハンドラーに追加します。

JPEG ファイルをエンコードしてピクチャ ライブラリに追加するには

  1. ソリューション エクスプローラーを使用してプロジェクトに JPEG ファイルを追加します。単に、追加するプロジェクト名まで写真をドラッグします。この例では、TestImage.jpg ファイルを使用しました。プロジェクト内のパスの場所がわかっていることを確認します。MainPage.xaml ファイルで、次の属性と値を image1 という名前の Image コントロールに追加します。

    Source=”TestImage.jpg”
    
    注注:

    TestImage.jpg はあくまでも例です。TestImage.jpg の代わりに、プロジェクトに追加した JPEG ファイルの名前を指定してください。

    属性を追加した後の image1 コントロールは次のようになります。

    <Image 
        Height="395" 
        HorizontalAlignment="Left" 
        Margin="6,6,0,0" 
        Name="image1" 
        Stretch="Fill" 
        VerticalAlignment="Top" 
        Width="468"
        Source="TestImage.jpg"/>
    
    
  2. MainPage.xaml.cs ファイルで、MainPage コンストラクターの InitializeComponent メソッド呼び出しのすぐ下に、次のコードを追加します。これにより、イメージの既定の保存場所としてカメラ ロール アルバムが選択されます。

    // Save images to the camera roll album by default.
    radioButtonCameraRoll.IsChecked = true;
    
    
  3. MainPage.xamlbtnSave ボタンをダブルクリックして、クリック イベントのイベント ハンドラーを追加します。MainPage.xaml.cs ファイルが表示されます。

  4. MainPage.xaml.cs ファイルで、btnSave_Click メソッドを次のコードに置き換えます。このコードで、[Application Name] をプロジェクトの名前に置き換えます。たとえば、プロジェクトの名前が CameraEncode、イメージの名前が TestImage.jpg の場合、新しい Uri の最初のパラメーターは "CameraEncode;component/TestImage.jpg" となります。

            private void btnSave_Click(object sender, RoutedEventArgs e)
            {
                // Create a file name for the JPEG file in isolated storage.
                String tempJPEG = "TempJPEG";
    
                // Create a virtual store and file stream. Check for duplicate tempJPEG files.
                var myStore = IsolatedStorageFile.GetUserStoreForApplication();
                if (myStore.FileExists(tempJPEG))
                {
                    myStore.DeleteFile(tempJPEG);
                }
    
                IsolatedStorageFileStream myFileStream = myStore.CreateFile(tempJPEG);
    
    
                // Create a stream out of the sample JPEG file.
                // For [Application Name] in the URI, use the project name that you entered 
                // in the previous steps. Also, TestImage.jpg is an example;
                // you must enter your JPEG file name if it is different.
                StreamResourceInfo sri = null;
                Uri uri = new Uri("[Application Name];component/TestImage.jpg", UriKind.Relative);
                sri = Application.GetResourceStream(uri);
    
                // Create a new WriteableBitmap object and set it to the JPEG stream.
                BitmapImage bitmap = new BitmapImage();
                bitmap.CreateOptions = BitmapCreateOptions.None; 
                bitmap.SetSource(sri.Stream);
                WriteableBitmap wb = new WriteableBitmap(bitmap);
    
                // Encode the WriteableBitmap object to a JPEG stream.
                wb.SaveJpeg(myFileStream, wb.PixelWidth, wb.PixelHeight, 0, 85);
                myFileStream.Close();
    
                // Create a new stream from isolated storage, and save the JPEG file to the media library on Windows Phone.
                myFileStream = myStore.OpenFile(tempJPEG, FileMode.Open, FileAccess.Read);
    
                // Save the image to the camera roll or saved pictures album.
                MediaLibrary library = new MediaLibrary();
    
                if (radioButtonCameraRoll.IsChecked == true)
                {
                    // Save the image to the camera roll album.
                    Picture pic = library.SavePictureToCameraRoll("SavedPicture.jpg", myFileStream);
                    MessageBox.Show("Image saved to camera roll album");
                }
                else
                {
                    // Save the image to the saved pictures album.
                    Picture pic = library.SavePicture("SavedPicture.jpg", myFileStream);
                    MessageBox.Show("Image saved to saved pictures album");
                }
                
                myFileStream.Close();
            }
    
    
  5. [デバッグ]、[デバッグ開始] の順にメニュー コマンドを選択してアプリケーションを実行します。これによってエミュレーター ウィンドウが開き、アプリケーションが起動します。[Save] ボタンをタップすると、ラジオ ボタンの選択に応じて、JPEG ファイルは Pictures ハブの Camera Roll または Saved Pictures アルバムに保存されます。

    重要な注重要な注:

    保存されたピクチャを表示するには、物理デバイスを使用する必要があります。このリリースのエミュレーターでは、ピクチャの表示はサポートされていません。

    完全なアプリケーションの例を次に示します。

    AP_Con_EncodeSan

表示:
© 2014 Microsoft