如何在移动设备上高效绘制矢量曲线?



我正在开发一个基于矢量的移动应用程序。首先,我开始使用多边形来表示曲线。但是,我在手机上迅速达到了多边形限制。为了克服这个限制,我开始使用纹理并为像素着色。尽管这是一个非常简单的解决方案,但我受到纹理和操作的最大分辨率的限制。

我发现唯一有希望的东西是OpenVG,但它似乎不是很受欢迎。

那么如何在手机上创建矢量绘图应用程序呢?我对Adobe Illustrator移动感到震惊,它似乎能够在矢量图形中绘制无限的曲线/线条。

允许基于矢量的自由形式曲线绘制的一种可能方法是使用贝塞尔曲线。贝塞尔曲线是通过插值由起点、终点和任意数量的控制点定义的值来构建的。这导致能够从一组少至 3 个笛卡尔点构建自由形式曲线。

这样做的好处是,通过仅存储表示曲线的点数据,则可以以任何比例渲染相同的曲线,而无需将曲线存储在纹理中。因此,您无需存储数百个中间点来形成小线段来表示相同的曲线。

下面是一些示例代码片段,它们使用 Android 中的 Path 对象来构造自由形式的矢量曲线。

如果要渲染到画布的曲线数量非常多,则只需存储定义贝塞尔曲线的点数据。重要的是,只创建一次Path对象,并在每次要绘制新曲线时使用reset方法重定义点。可以在此处找到实现此目的的示例代码。

最新更新