Windows Phone 上的 WriteableBitmap 高速绘图答案

【问题标题】：WritableBitmap high speed drawing on Windows PhoneWindows Phone 上的 WriteableBitmap 高速绘图
【发布时间】：2016-05-01 05:50:03
【问题描述】：

我正在 Windows Phone 上试验WritableBitmapEx。我创建了一个简单的例子，一个简单的上下移动的盒子。

有一个绘制函数可以在每一帧重绘矩形：

    int y = 0;
    int dy = 15;
    public void draw()
    {
        y += dy;

        if (y > 500 || y < 0)
            dy = -dy;

        writeableBmp.Clear(System.Windows.Media.Colors.Black);
        writeableBmp.FillRectangle(0, y, 100, y + 100, System.Windows.Media.Colors.Green);
    }

还有Loaded 事件，它创建可写位图并在每一帧上调用draw()。

    WriteableBitmap writeableBmp;
    private async void PhoneApplicationPage_Loaded(object sender, RoutedEventArgs e)
    {
        writeableBmp = BitmapFactory.New((int)ContentPanel.ActualWidth, (int)ContentPanel.ActualHeight);
        image.Source = writeableBmp;
        writeableBmp.GetBitmapContext();
        CompositionTarget.Rendering += CompositionTarget_Rendering;
    }

    private void CompositionTarget_Rendering(object sender, EventArgs e)
    {
        draw();
    }

但是这给我的最大~30FPS，所以动画不流畅。

我知道在xaml 中有一些创建此类动画的更好方法（例如，创建一个矩形对象并使用 xaml 动画制作动画），但是有一个游戏（用另一种语言）以这种方式重绘每一帧，我的最终目标是将该代码移植到 Windows Phone。因此，找到一种足够快的重绘方法可以让移植真的变得更容易。

那么，有没有办法提高它的性能？还是有更好的方法来手动绘制每一帧，但速度足够快（60fps）？

【问题讨论】：

投反对票的原因是什么？
我记得几年前 WP 被限制在 30 FPS 左右。我认为限制已经解除，但我怀疑像 520 这样的低端手机仍然无法达到更高的水平。也许现在仍然如此，但是如果您正在移植游戏，您是否尝试过 Microsoft 的 Win2D？
@ChubosaurusSoftware 好吧，我正在 Lumia 930 上进行测试，但我仍然获得了 ~30fps。你能解释更多关于 Win2D 的信息吗？用它绘图有多容易和多快？
它基本上只是 Direct2D 的一个包装器，所以除非你是原生的，否则可能会尽可能快。您可以使用 NuGet 或他们的 GitHub 获取它：github.com/Microsoft/Win2D，入门项目（恕我直言，这很容易）：github.com/Microsoft/Win2D-samples
@ChubosaurusSoftware 我正在玩它，它似乎是我正在寻找的东西。您可以将其发布在答案中以便我投票吗？ :)

标签： c# wpf xaml windows-phone-8 windows-phone

【解决方案1】：

试用 Microsoft Win2D。您可以在此处使用 NuGet 或他们的 GitHub 获取它：Microsoft Win2D GitHub。它基本上是 Direct2D 的包装器，使用起来非常简单。

功能（复制自：https://github.com/Microsoft/Win2D/wiki/Features）

易于使用的 Windows 运行时 API

•可从 .NET 和 C++ 获得

•支持 Windows 10、Windows 8.1 和 Windows Phone 8.1

使用 GPU 加速的即时模式 2D 图形渲染

•作为 Direct2D、DirectImage 和 DirectWrite 之上的层实现

•与底层类型互操作，因此您可以将 Win2D 与本机 D2D 混合和匹配

位图图形

•加载、保存和绘制位图图像

•渲染到纹理

•使用位图作为不透明蒙版

•用于高效绘制大量位图的 Sprite 批处理 API

•使用块压缩位图格式来节省内存

•加载、保存和绘制虚拟位图，可以大于最大 GPU 纹理大小，并自动分割成图块

矢量图形

•绘制原始形状（线、矩形、圆形等）或任意复杂的几何图形

•使用纯色、图像画笔或线性和径向渐变填充形状

•使用灵活的笔触样式（点线、虚线等）绘制任意宽度的线条

•高品质抗锯齿

•丰富的几何操作（联合、相交、计算路径上的点、镶嵌等）

•将绘图剪切到任意几何区域

•在命令列表中捕获绘图操作以供以后重播

•光栅化墨水笔触（来自触控笔）

强大的图像处理效果

•模糊

•混合

•颜色调整（亮度、对比度、曝光、高光和阴影等）

•过滤器（卷积、边缘检测、浮雕、锐化）

•照明

•自定义像素着色器

•还有更多...

文字

•完全国际化的 Unicode 文本呈现

•可以绘制、测量或命中测试文本布局

•将文本轮廓转换为几何图形

•枚举字体并查询其指标

•绘制或操作单个字形运行以创建自定义文本布局

界面集成

•XAML CanvasControl 可以轻松启动和运行

•还可以创建高级的东西，例如自绘 XAML 控件

•XAML CanvasAnimatedControl 提供 Update/Draw 游戏循环编程模型

•XAML CanvasVirtualControl 用于绘制到非常大的虚拟化表面

•在 Windows.UI.Composition 绘图表面和交换链上绘图

•也可以直接绘制到CoreWindow

•打印

【讨论】：

【解决方案2】：

感谢Chubosaurus Software 推荐了Microsoft Win2D。

我将进一步解释一下我在我的案例中所做的事情。

在Win2D中有一个叫CanvasAnimatedControl的控件，就是专门为此设计的。

从NuGet获取包并添加到页面后，可以使用Draw和Update这两个事件。

Update 用于逻辑，Draw 用于渲染帧。

所以，这是问题中描述的移动矩形的代码：

    private void Page_Loaded(object sender, RoutedEventArgs e)
    {
        cvs.Update += Cvs_Update;
        cvs.Draw += Cvs_Draw;
    }

    int y = 0;
    int dy = 15;
    private void Cvs_Draw(Microsoft.Graphics.Canvas.UI.Xaml.ICanvasAnimatedControl sender, Microsoft.Graphics.Canvas.UI.Xaml.CanvasAnimatedDrawEventArgs args)
    {
        args.DrawingSession.Clear(Windows.UI.Colors.Blue);
        args.DrawingSession.FillRectangle(new Rect(0, y, 100, 100), Windows.UI.Colors.Green);
    }

    private void Cvs_Update(Microsoft.Graphics.Canvas.UI.Xaml.ICanvasAnimatedControl sender, Microsoft.Graphics.Canvas.UI.Xaml.CanvasAnimatedUpdateEventArgs args)
    {
        y += dy;

        if (y > 500 || y < 0)
            dy = -dy;
    }

这段代码在我的手机上运行良好（~60fps）。

唯一的缺点是，Win2D 支持 Windows Phone 8.1 及更高版本。因此，使用此库，您将失去对 Windows Phone 8 的兼容性。

【讨论】：