Image gets mangled when saving InkCanvas to byte array to file

问题

I have a WPF application using InkCanvas. When I render the bitmap, save to a memory stream, write the resulting bytes to a file, and then open that file in paint, the image is mangled. Any idea what I may be doing wrong here? Tried several solutions found here on SO and also on codeproject. It's pretty clear that it's capturing part of the InkCanvas but the majority of it is black (I assume null bytes).

EDIT: also tried with/without margin. Here are the other links I've tried:

https://social.msdn.microsoft.com/Forums/vstudio/en-US/ef71237c-5dfb-4d6c-a402-e8cb02b74e99/how-to-convert-inkcanvas-strokes-to-a-bitmap-or-byte-array?forum=wpf

Converting InkCanvas Strokes to a Byte Array and back again

InkCanvas Load/Save operations

http://www.centrolutions.com/Blog/post/2008/12/09/Convert-WPF-InkCanvas-to-Bitmap.aspx

https://social.msdn.microsoft.com/Forums/vstudio/en-US/ba4dc89f-0169-43a9-8374-68e1fb34a222/saving-inkcanvas-as-image?forum=wpf

I need the resultant file to be a bitmap/PNG so it can be viewed on another machine.

private byte[] ConvertInkCanvasToByteArray()
{ 
    int margin = (int)this.icSignature.Margin.Left;
    int width = (int)this.icSignature.ActualWidth - margin;
    int height = (int)this.icSignature.ActualHeight - margin;

    RenderTargetBitmap rtb = new RenderTargetBitmap(width, height, 96d, 96d, PixelFormats.Default);
    rtb.Render(icSignature);

    BmpBitmapEncoder encoder = new BmpBitmapEncoder();
    encoder.Frames.Add(BitmapFrame.Create(rtb));
    byte[] bitmapBytes;
    using (MemoryStream ms = new MemoryStream())
    {
        encoder.Save(ms); 
        ms.Position = 0;
        bitmapBytes = ms.ToArray();
    }
    return bitmapBytes;
}

From the InkCanvas:

And then mangled:

回答1:

To avoid any problem with the InkCanvas' Margin, you could draw it into an intermediate DrawingVisual:

private byte[] ConvertInkCanvasToByteArray()
{
    var rect = new Rect(icSignature.RenderSize);
    var visual = new DrawingVisual();

    using (var dc = visual.RenderOpen())
    {
        dc.DrawRectangle(new VisualBrush(icSignature), null, rect);
    }

    var rtb = new RenderTargetBitmap(
        (int)rect.Width, (int)rect.Height, 96d, 96d, PixelFormats.Default);
    rtb.Render(visual);

    var encoder = new PngBitmapEncoder();
    encoder.Frames.Add(BitmapFrame.Create(rtb));

    using (var stream = new MemoryStream())
    {
        encoder.Save(stream);
        return stream.ToArray();
    }
}

来源：https://stackoverflow.com/questions/47465271/image-gets-mangled-when-saving-inkcanvas-to-byte-array-to-file

标签

wpf

drawing

inkcanvas