在 openGL 中渲染一个 Photoshop 风格的画笔

Question

我的程序以编程方式定义了行。我想要做的是沿着它们渲染一个笔触。

我认为我想要的画笔类型的工作方式是，它只是有一个纹理，大部分是透明的，你要做的是，以路径中的每个像素为中心渲染这个纹理，然后它们混合在一起以创建笔触.

现在假设这甚至可行，我打赌它会太贵（针对 ipad 和其他移动芯片，它们讨厌填充率和 alpha 混合）

那么，还有哪些其他选择？

如果它可以实时完成（即，路径样条更新每一帧）那将是理想的。但如果不是，那么在 ipad 上的几分之一秒内也会很好（样条线连接节点，用户可以拖动节点从而改变样条线，但是在样条线恢复为更简单的填充时它是可以接受的正在四处移动，然后在释放笔刷后重新计算笔刷）

对于那些想知道的人，我正在努力让粗线看起来像是用铅笔画的。它应该看起来尽可能真实。

我考虑只将刷过的样条线渲染为纹理，但由于样条线可以在任何方向上为任何长度，专用于整个矩形纹理来包含整个样条线将是昂贵的方式......

样条线不可避免地被分解成四边形进行渲染，所以我想最初将画笔渲染为纹理，然后生成一个优化的纹理，将每个四边形分开并尽可能整齐地打包到纹理中。

但是对纹理进行了两次渲染...创建优化纹理的算法，使四边形仍然可以无缝地相互融合...听起来就像一场噩梦，甚至都不是实时的。

是的，关于如何在 openGL 中的 ipad 上实时绘制像铅笔一样的粗线条，有什么想法吗？

Answer 1

在我看来，你想要的是渲染一条线：

• 有纹理
• 边缘消失（即没有锐利边缘）
• 遵循样条线

为了实现这些目标，我首先将样条分解为一系列与曲线非常接近的线段（您可以根据您希望它的精确度与速度的多少来使其或多或少细化你希望它渲染）。

一旦你有了这些，你需要将每个线段分成 3 个四边形，一个线段的中间作为线的完全不透明部分，一个线段的每个边缘都会褪色完全透明。

您需要使用一点数学方法来确保沿将 2 个线段平分的向量拉伸四边形（即，使每个线段与拉伸向量之间的角度相等）。这将确保您在连接的钝角部分没有间隙，在锐角部分没有重叠。

在所有这些之后，您只需要使用顶点位置作为 UV 坐标（虽然可能已缩放）并允许纹理环绕。

使用此方法，您最终应该得到一个网格，该网格有一条穿过样条线中间的实心粗线，并带有逐渐变细成完全透明的“鳍”。这应该非常接近您想要的效果，同时仅渲染到相关像素（即没有完全透明像素的巨大区域）并且内存开销非常小。

---

我在这里有点含糊，因为它很难单独用文字来解释，而且不写深入的教程。如果您需要更多信息，只需评论您坚持的内容，我会进一步详细说明。