locked
inkcanvas to image black border on top RRS feed

  • Question

  • Hello,

    I'm playing around with the InkCanvas control and now i want to save it to a image file.
    I have this code:
                RenderTargetBitmap rtb = new RenderTargetBitmap((int)inkCanvas.ActualWidth, (int)inkCanvas.ActualHeight, 0, 0, PixelFormats.Pbgra32);
               
                rtb.Render(inkCanvas);
    
                JpegBitmapEncoder encoder = new JpegBitmapEncoder();
    
                encoder.Frames.Add(BitmapFrame.Create(rtb));
          
    
                FileStream file = new FileStream(@"D:\Users\Pictures\test2.jpg", FileMode.Create);
    
                encoder.Frames.Add(BitmapFrame.Create(rtb));
                encoder.Save(file);
    
                file.Close();
    it works, i get an image with what i have created in the inkCanvas, BUT i also have a black border on the top of the image.

    How can i get it away?

    thanks
    Saturday, March 6, 2010 12:07 AM

Answers

  • Hi,

    I tryied the ExportToPng method listed in the link below. But it works for me, I do not see a black border on the top of Image. So please try the method below.

    link: http://dvuyka.spaces.live.com/blog/cns!305B02907E9BE19A!240.entry
    Code snippet:
     
    public void ExportToPng(Uri path, InkCanvas  canvas)

            {

                if (path == null) return;

                // Save current canvas transform

                Transform transform = canvas.LayoutTransform;

                // reset current transform (in case it is scaled or rotated)

                canvas.LayoutTransform = null;

                // Get the size of canvas

                Size size = new Size(canvas.Width, canvas.Height);

                // Measure and arrange the canvas

                // VERY IMPORTANT

                canvas.Measure(size);

                canvas.Arrange(new Rect(size));

                // Create a render bitmap and push the canvas to it

                RenderTargetBitmap renderBitmap =

                  new RenderTargetBitmap(

                    (int)size.Width,

                    (int)size.Height,

                    96d,

                    96d,

                    PixelFormats.Pbgra32);

                renderBitmap.Render(canvas);

                // Create a file stream for saving image

                using (FileStream outStream = new FileStream(path.LocalPath, FileMode.Create))

                {

                    // Use png encoder for our data

                    PngBitmapEncoder encoder = new PngBitmapEncoder();

                    // push the rendered bitmap to it

                    encoder.Frames.Add(BitmapFrame.Create(renderBitmap));

                    // save the data to the stream

                    encoder.Save(outStream);

                }

                // Restore previously saved layout

                canvas.LayoutTransform = transform;

            }

    Thanks.
    Sincerely.


    Jim Zhou -MSFT
    Monday, March 8, 2010 9:48 AM

All replies

  • Hi,

    I tryied the ExportToPng method listed in the link below. But it works for me, I do not see a black border on the top of Image. So please try the method below.

    link: http://dvuyka.spaces.live.com/blog/cns!305B02907E9BE19A!240.entry
    Code snippet:
     
    public void ExportToPng(Uri path, InkCanvas  canvas)

            {

                if (path == null) return;

                // Save current canvas transform

                Transform transform = canvas.LayoutTransform;

                // reset current transform (in case it is scaled or rotated)

                canvas.LayoutTransform = null;

                // Get the size of canvas

                Size size = new Size(canvas.Width, canvas.Height);

                // Measure and arrange the canvas

                // VERY IMPORTANT

                canvas.Measure(size);

                canvas.Arrange(new Rect(size));

                // Create a render bitmap and push the canvas to it

                RenderTargetBitmap renderBitmap =

                  new RenderTargetBitmap(

                    (int)size.Width,

                    (int)size.Height,

                    96d,

                    96d,

                    PixelFormats.Pbgra32);

                renderBitmap.Render(canvas);

                // Create a file stream for saving image

                using (FileStream outStream = new FileStream(path.LocalPath, FileMode.Create))

                {

                    // Use png encoder for our data

                    PngBitmapEncoder encoder = new PngBitmapEncoder();

                    // push the rendered bitmap to it

                    encoder.Frames.Add(BitmapFrame.Create(renderBitmap));

                    // save the data to the stream

                    encoder.Save(outStream);

                }

                // Restore previously saved layout

                canvas.LayoutTransform = transform;

            }

    Thanks.
    Sincerely.


    Jim Zhou -MSFT
    Monday, March 8, 2010 9:48 AM
  •   var size = new Size(inkCanvas.ActualWidth, inkCanvas.ActualHeight);
                                inkCanvas.Margin = new Thickness(0, 0, 0, 0);
                                inkCanvas.Measure(size);
                                inkCanvas.Arrange(new Rect(size));
                                var encoder = new PngBitmapEncoder();
                                var bitmapTarget = new RenderTargetBitmap((int)size.Width, (int)size.Height, 96, 96, PixelFormats.Default);
                                bitmapTarget.Render(inkCanvas);
                                encoder.Frames.Add(BitmapFrame.Create(bitmapTarget));
                                encoder.Save(ms);
    Tuesday, October 14, 2014 6:33 AM