使用MVVM将笔划另存为图像 [英] Saving strokes as an image using MVVM

问题描述

我的代码后面有一个函数可以满足我的要求.无论用户如何将其绘图扩展到InkCanvas边界之外，我都喜欢这样做，保存后图像将被调整大小.

I have a function in my code behind that does what I want. What I like about this is no matter how the user expand his drawing out of the InkCanvas boundries, the image will be resized when saved.

private void exportCanvasToBitmap(object sender, EventArgs e) {

RenderTargetBitmap rtb = new 
RenderTargetBitmap((int)signatureCanvas.ActualWidth, 
(int)signatureCanvas.ActualHeight, 96, 96, PixelFormats.Default);
        rtb.Render(signatureCanvas);

        BmpBitmapEncoder encoder = new BmpBitmapEncoder();
        encoder.Frames.Add(BitmapFrame.Create(rtb));
        FileStream fs = File.Open(@".\images\"+ signatureFileName + ".jpg", FileMode.Create);
        encoder.Save(fs);
        fs.Close();
        (sourceWindow as MainWindow).updateSignatureImage(signatureType, signatureFileName);
    }

我想将其移到ViewModel上，但我不知道如何使其与以前的版本相同.我不想在ViewModel中使用 rtb.Render(inkCanvas).经过一些搜索后，我将StrokeCollection绑定到我的视图并使用了此功能.

I wanted to move this to the ViewModel and I didn't know how to make it does the same as the one I have before. I don't want to usertb.Render(inkCanvas) in the ViewModel. After some search I binded a StrokeCollection to my view and used this function.

  public void convertStrokestoImage() {

        StrokeCollection sc = strokes;

        byte[] inkData = null;

        using (MemoryStream inkMemStream = new MemoryStream())

        {

            sc.Save(inkMemStream);

            inkData = inkMemStream.ToArray();

        }

        byte[] gifData = null;


        using (Microsoft.Ink.Ink ink2 = new Microsoft.Ink.Ink())
          {

            ink2.Load(inkData);

            gifData = ink2.Save(Microsoft.Ink.PersistenceFormat.Gif); 

        }

        File.WriteAllBytes("./Src/strokes.png", gifData);

    }

此问题是，如果用户从InkCanvas的边界中划出，图像将缩放为我不想要的".我不太确定该怎么做，因为我在网上找到了这两个功能，可以作为其他问题的解决方案.

The problem with this is that if the user draws out of the InkCanvas' boundaries, the image scales " which I don't want". I am not really sure how to do that since both of the function I found online as solutions in other questions.

我最初的想法是，我必须做一个类似RenderTargetBitmap之前具有我的InkCanvas实际宽度和高度的操作.问题是我不知道如何在不使用InkCanvas对象本身的情况下获得它.

My initial thought is that I have to do something similar for what I had before where I had a RenderTargetBitmap that has the actual width and height of my InkCanvas. The issue is I don't know how to obtain this without using InkCanvas object itself.

有什么提示吗?

推荐答案

我解决了这样的问题.

首先，我将byte []转换为图像，然后使用辅助函数调整图像的大小.

First I converted the byte[] to an Image and then I used a helper function to resize the image.

 public void convertStrokestoImage()
    {

        StrokeCollection sc = strokes;

        byte[] inkData = null;

        using (MemoryStream inkMemStream = new MemoryStream())

        {

            sc.Save(inkMemStream);

            inkData = inkMemStream.ToArray();

        }

        byte[] gifData = null;


        using (Microsoft.Ink.Ink ink2 = new Microsoft.Ink.Ink())
        {

            ink2.Load(inkData);

            gifData = ink2.Save(Microsoft.Ink.PersistenceFormat.Gif);

        }

        MemoryStream ms = new MemoryStream(gifData);
        Image image = Image.FromStream(ms);
        image = resizeImage(image, 100, 150);
        image.Save("./Src/strokes.png");

    }

在以下问题中，您可以找到许多功能来调整图像大小.调整图像C#的大小

You can find alot of functions to resize images in the following question. Resize an Image C#

我对此不满意的是图像文件大小变大了！例如5kb变成30kb.

What I don't like about this is the image file size become bigger! For example what was 5kb became 30kb.

这篇关于使用MVVM将笔划另存为图像的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！