流体2D形状平移/滚动

Question

假设您有一个应用程序绘制了一个复杂的流程图(在我的例子中是一个.NET流程图)。用户需要以可接受且一致的帧率导航流程图，比方说10 FPS。这意味着如果流程图很大，您将无法在不阻塞UI的情况下绘制所有内容。

此外，形状的复杂性变化很大，您希望绘制尽可能多的形状，以给用户一种在动态移动过程中不会丢失任何东西的印象。

我测试的第一种方法是计算我必须绘制一个帧(保持10FPS)的时间，并在达到该阈值后停止绘制，显然会跳过屏幕上的形状。

结果远远谈不上好。在没有任何逻辑的情况下，绘图可以停留在几个复杂的形状上，而跳过大多数简单的形状(给用户的印象是他/她丢失了图表)。此外，估计的帧率可能会有很大的变化，因此绘制的形状数量也会有很大变化。

你知道更好的方法吗？你知道关于这个主题的任何文章吗？

谢谢。

Answer 1

要尝试的第一个优化是从不太复杂的形状到更复杂的形状排序，然后根据您的时间进行绘制。这种方式通常会跳过较少的对象，这意味着屏幕上有更多的对象。当用户停止移动时，您可以运行完整的绘图。我想我已经注意到在PDF文件中的一些矢量图形中有类似的行为。

另一种方法是在可能的情况下重用已经绘制的图像。将二维矩形参数添加到图形代码中，并测试每个对象是否与用作图形边界框的矩形相撞。当用户移动您的流程图时，例如向左移动10个像素-您复制当前图像，将其移动10个像素，并在右侧仅绘制10个像素宽的竖线-这种方式您需要考虑的对象要少得多。这种方法是在Qt2D场景中实现的，有很多技巧和优化，使得它对编码器几乎是透明的。非常有趣的实现，但很难读懂:)。

您还可以探索线程以及它为您提供的所有可能性：

您可以在另一个线程中进行绘制，以避免阻塞GUI。如果线程结束绘制图像，您只需在窗口中显示它。

您可以将图表拆分为正方形/矩形，并将每个正方形分配给不同的线。当视图移动并且新的方块可见时，您可以为其执行绘图。在主线程中，您只需检查已经完成的内容，并将其复制到目标位置。移动Web浏览器以类似的方式呈现网页。

根据你在移动过程中的确切内容和偏好，你也可以将图表分成几个层--更重要和更不重要等等。然后在主线程中，你只需混合/混合准备好的图像，等待其他图像。