내보내기(0) 인쇄
모두 확장

방법: Windows Phone용 JPEG 인코딩 및 사진 라이브러리에 저장

2012-02-09

이 항목에서는 WriteableBitmap 개체를 JPEG 스트림으로 인코딩하고 이를 Windows Phone의 사진 라이브러리에 추가하는 방법에 대해 설명합니다. 이 항목에서 수행되는 작업은 다음과 같습니다.

  • 적절한 네임스페이스 추가 및 샘플용 디자인 화면 만들기

  • WriteableBitmap 개체를 JPEG 파일로 인코딩

  • JPEG를 Windows Phone 의 사진 라이브러리에 추가

중요중요:

Windows Phone의 현재 릴리스에서는 에뮬레이터가 사진 허브의 사진 보기를 지원하지 않습니다. 이 연습에서 만든 사진은 실제 단말기에서만 볼 수 있습니다.

먼저 새 프로젝트를 만들고 필요한 네임스페이스를 추가해야 합니다.

참고참고:

다음 절차의 단계는 Windows Phone용 Visual Studio 2010 Express에 적용됩니다. Visual Studio 2010 Professional 또는 Visual Studio 2010 Ultimate용 추가 기능을 사용하는 경우에는 메뉴 명령이나 창 레이아웃에서 일부 소규모 변형이 나타날 수 있습니다.  

이 항목은 C# 개발을 기준으로 하지만 Visual Basic 코드도 제공됩니다. 

새 프로젝트를 만들고 네임스페이스를 추가하려면

  1. Windows Phone용 Visual Studio 2010 Express 에서 파일 | 새 프로젝트 메뉴 명령을 선택하여 새 프로젝트를 만듭니다.

  2. 새 프로젝트 창이 표시됩니다. Visual C# 템플릿을 확장하고 Windows Phone용 Silverlight 템플릿을 선택합니다.

  3. Windows Phone 응용프로그램 템플릿을 선택합니다. 이름 상자에 선택한 이름을 입력합니다.

  4. 확인을 클릭합니다. 새 Windows Phone 응용프로그램 창이 표시됩니다.

  5. 대상 Windows Phone 버전 메뉴에서 Windows Phone 7.1 이 선택되었는지 확인합니다.

  6. 확인을 클릭합니다. 새 프로젝트가 생성되고 MainPage.xaml이 Visual Studio 디자이너 창에서 열립니다.

  7. 프로젝트 메뉴에서 참조 추가를 선택합니다. .NET 탭에서 Microsoft.Xna.Framework를 선택하고 확인을 클릭합니다.

  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>
    
    
    참고참고:

    앞의 코드는 페이지의 맨 위에서 중간 부분을 차지하는 Image 컨트롤과 btnSave라는 Button 컨트롤을 만듭니다. 이러한 컨트롤의 방향은 다음 그림에서 볼 수 있습니다.

이 섹션에서는 btnSave 클릭 이벤트 처리기에 코드를 추가하여 WriteableBitmap 개체를 JPEG 스트림으로 인코딩하고 이를 Windows Phone의 사진 라이브러리에 추가합니다.

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.xaml에서 btnSave 버튼을 두 번 클릭하여 클릭 이벤트에 대한 이벤트 처리기를 추가합니다. 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. 디버그 | 디버깅 시작 메뉴 명령을 선택하여 응용프로그램을 실행합니다. 에뮬레이터 창이 열리고 응용프로그램이 시작됩니다. 저장 버튼을 탭하면 라디오 버튼 선택에 따라 사진 허브의 JPEG 파일이 카메라 앨범 또는 저장된 사진 앨범에 저장됩니다.

    중요중요:

    저장된 사진을 보려면 실제 단말기에서 봐야 합니다. 에뮬레이터는 이 릴리스에서 사진 탐색을 지원하지 않습니다.

    다음 예제는 완성된 응용프로그램을 보여 줍니다.

    AP_Con_EncodeSan

표시:
© 2014 Microsoft