（UWP）图像绘制和重新保存为图像/字节数组 [英] (UWP) Drawing on image and saving as image/byte array again

问题描述

我已经尝试了很多不同的解决方案，在过去两天，但似乎无法找到的最好方式。

I've tried a lot of different solutions in the last two days, but can't seem to find the best way.

我要的是：

1. Show image
2. Enable drawing red lines on image
3. Save image with lines

我试过Win2D，WriteableBitmapEx，InkCanvas，正常的画布和的Lumia成像SDK，但在工作液还没有运气。有很大的机会，我做的都是错的，因为所有这些解决方案不为我工作。我似乎无法找到，虽然与UWP工作的很好的例子。任何人都知道一个很好的和简单的方法来做到这一点？

I've tried Win2D, WriteableBitmapEx, InkCanvas, normal Canvas and the Lumia Imaging SDK, but haven't had luck with at working solution. There is big chance that I'm doing it all wrong, since all those solutions don't work for me. I can't seem to find any good examples that work with UWP though. Anyone know a nice and easy way to do this?

编辑：我在C＃开发

推荐答案

1）第一个解决方案是使用DX。您可以渲染到使用Direct2D和DirectWrite的画面，然后使用WIC API渲染图像保存到磁盘。如果你正在写一个Windows商店应用，可以让用户选择使用Windows ::存储::拾荒者:: FileSavePicker目标文件。 这里你可以找到一个示例程序。

1) The first solution is using DX. You can render to the screen using Direct2D and DirectWrite and then save the rendered image to disk using the WIC API. If you are writing a Windows Store app, you can have the user select a destination file using Windows::Storage::Pickers::FileSavePicker. Here you can find a sample program.

有关在UWP使用DX渲染或保存图像更完整的样本，可以参考的此处。

For more complete samples about using DX in UWP to render or save images, you can refer here.

2）如果你想使用纯C＃，win2D是Direct2D的好包装，它可以用来绘制图像。随着RenderTargetBitmap的帮助下，可以渲染任意的UIElement为位图。随着对RenderTargetBitmap，这里是<一个href=\"https://msdn.microsoft.com/en-us/library/windows/apps/windows.ui.xaml.media.imaging.rendertargetbitmap.aspx\"相对=nofollow> MSDN 纸张，<一个href=\"http://social.technet.microsoft.com/wiki/contents/articles/20648.using-the-rendertargetbitmap-in-windows-store-apps-with-xaml-and-c.aspx\"相对=nofollow>这里是很好的样本。

2) If you want to use pure c#, win2D is good wrapper for direct2D, which can used to draw image. With the help of RenderTargetBitmap, you can render an arbitrary UIElement into a bitmap. As about RenderTargetBitmap, here is MSDN paper, and here is good sample.

有关你的情况下，code可能看起来像下面（可以保存以后文件）：

For your case, the code may look like below (You can save to file later):

XAML：

<StackPanel>
    <Button Content="Save as image source" Click="SaveImageSource_Click" />
    <Grid x:Name="RenderedGrid" Height="500"  Background="{ThemeResource ApplicationPageBackgroundThemeBrush}">
    <canvas:CanvasControl Draw="CanvasControl_Draw" ClearColor="CornflowerBlue"/>
    <Image x:Name="RenderedImage" Stretch="None" />
    </Grid>
</StackPanel>

C＃：

private  void CanvasControl_Draw(CanvasControl sender, CanvasDrawEventArgs args)
{
    args.DrawingSession.DrawEllipse(155, 155, 80, 30, Colors.Black, 3);
    args.DrawingSession.DrawLine(155, 155, 180, 180, Colors.Red);
}

private async void SaveImageSource_Click(object sender, Windows.UI.Xaml.RoutedEventArgs e)
{
    RenderTargetBitmap renderTargetBitmap = new RenderTargetBitmap();
    await renderTargetBitmap.RenderAsync(RenderedGrid, 500, 500);
    RenderedImage.Source = renderTargetBitmap;
}

请让我知道，如果有什么不清楚的。

Please let me know if anything unclear.

这篇关于（UWP）图像绘制和重新保存为图像/字节数组的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！