locked
How do you save a transformed image?

    Question

  • Windows Store App 8.1.

    I have an image that the user has rotated, scaled and clipped etc.  How do you save the transformed image?

    There are solutions of the forums but these use the System.Media.Imaging library that isn't available, classes like the TransformedBitmap etc. are not available. 

    I'm playing around with this approach but the decoder throws a "The image format is unknown";  imageManipulation is UIElement.Image.

    Any ideas on how to achieve the saving of a Transformed image in a 4.5.1 8.1 store app?

    RenderTargetBitmap rtb = new RenderTargetBitmap();
    await rtb.RenderAsync(imageManipulation, (int)imageManipulation.ActualWidth, (int)imageManipulation.ActualHeight);
    IBuffer buffer = await rtb.GetPixelsAsync();
    
    using (InMemoryRandomAccessStream ras = new InMemoryRandomAccessStream())
    {
       await ras.WriteAsync(buffer);
       await ras.FlushAsync();
       BitmapDecoder dec = await BitmapDecoder.CreateAsync(BitmapDecoder.BmpDecoderId, ras);
    }


    Rob


    • Edited by RobC00 Friday, January 30, 2015 12:58 AM
    • Moved by Marvin_Guo Friday, January 30, 2015 5:44 AM Windows Store App Releated
    Friday, January 30, 2015 12:58 AM

Answers

  • OK I got it, I sat and played with the encoders etc.. this is how you save a transformed image to file

    // render the image content and obtain the pixel data
    RenderTargetBitmap rtb = new RenderTargetBitmap();
    Size imageSize = new Size(panelImageManipulation.ActualWidth, panelImageManipulation.ActualHeight);
    await rtb.RenderAsync(scrollImageManipulation, (int)imageSize.Width, (int)imageSize.Height);
    IBuffer buffer = await rtb.GetPixelsAsync();
    
    // write the image to file
    StorageFile transformedFile = await ApplicationData.Current.LocalFolder.CreateFileAsync("TransformedImage.jpg", CreationCollisionOption.ReplaceExisting);
    
    using (var transformedStream = await transformedFile.OpenAsync(FileAccessMode.ReadWrite))
    {
       BitmapEncoder encoder = await BitmapEncoder.CreateAsync(BitmapEncoder.JpegEncoderId, transformedStream);
       encoder.SetPixelData(BitmapPixelFormat.Bgra8, BitmapAlphaMode.Premultiplied, (uint)imageSize.Width, (uint)imageSize.Height, 96, 96, buffer.ToArray());
       await encoder.FlushAsync();
    }


    Rob

    • Marked as answer by RobC00 Friday, January 30, 2015 2:21 PM
    Friday, January 30, 2015 2:20 PM

All replies

  • Hello Rob,

    Since this issue is related with windowss store app, i move it to the window store app forum there store app exeprts will help you.

    Regards.


    We are trying to better understand customer views on social support experience, so your participation in this interview project would be greatly appreciated if you have time. Thanks for helping make community forums a great place.
    Click HERE to participate the survey.

    Friday, January 30, 2015 5:43 AM
  • Hi,

    You can use BitmapEncoder to apply transforms such as scaling and cropping, set metadata and properties, and edit pixels while preserving any unedited data. After transform the data, you can copy the contents from the in-memory stream to the original file’s stream and close all of the streams. That make you can save the encoded image to the file:

     memStream.Seek(0);
        fileStream.Seek(0);
        fileStream.Size = 0;
        await RandomAccessStream.CopyAsync(memStream, fileStream);
    
        fileStream.Dispose();
        memStream.Dispose();
    

    You can see the link to get more information:

    https://msdn.microsoft.com/en-us/library/windows/apps/xaml/jj709937.aspx

    Best Wishes!


    We are trying to better understand customer views on social support experience, so your participation in this interview project would be greatly appreciated if you have time. Thanks for helping make community forums a great place. <br/> Click <a href="http://support.microsoft.com/common/survey.aspx?showpage=1&scid=sw%3Ben%3B3559&theme=tech"> HERE</a> to participate the survey.

    Friday, January 30, 2015 9:26 AM
  • OK I got it, I sat and played with the encoders etc.. this is how you save a transformed image to file

    // render the image content and obtain the pixel data
    RenderTargetBitmap rtb = new RenderTargetBitmap();
    Size imageSize = new Size(panelImageManipulation.ActualWidth, panelImageManipulation.ActualHeight);
    await rtb.RenderAsync(scrollImageManipulation, (int)imageSize.Width, (int)imageSize.Height);
    IBuffer buffer = await rtb.GetPixelsAsync();
    
    // write the image to file
    StorageFile transformedFile = await ApplicationData.Current.LocalFolder.CreateFileAsync("TransformedImage.jpg", CreationCollisionOption.ReplaceExisting);
    
    using (var transformedStream = await transformedFile.OpenAsync(FileAccessMode.ReadWrite))
    {
       BitmapEncoder encoder = await BitmapEncoder.CreateAsync(BitmapEncoder.JpegEncoderId, transformedStream);
       encoder.SetPixelData(BitmapPixelFormat.Bgra8, BitmapAlphaMode.Premultiplied, (uint)imageSize.Width, (uint)imageSize.Height, 96, 96, buffer.ToArray());
       await encoder.FlushAsync();
    }


    Rob

    • Marked as answer by RobC00 Friday, January 30, 2015 2:21 PM
    Friday, January 30, 2015 2:20 PM