c# - 在 OpenGL 中绘制剪辑的 UI 元素的最佳方法

Question

我有一个复杂的 UI 系统，它允许很多事情也可以用 WPF 完成，但支持多个平台(iOS、Android、Windows 等)。它尚未完成，现在我面临以下问题:

我的设计师想要旋转物体!旋转对象比简单的轴对齐对象复杂得多，这就是我不能使用的原因 glScissor .可能有助于理解问题的小图形:

你可以看到我需要通过“Parent Container”的边界来裁剪对象“Subcontainer”。据我所知，有几种选择:

• 使用模板缓冲区，在这种情况下，我遇到了一个问题，因为我有不可见的对象，并且还必须影响模板缓冲区，因为它们可能会掩盖子对象。此外，我必须为每个对象绘制两次，因为我需要在返回层次结构时减少模板缓冲区。
• 剪切用于绘制 UI 对象的平面(三角剖分；或任何其他 UI 模型)，这似乎很实惠，因为它们可能会在不同的点剪切(想象一个容器在一个旋转的容器中旋转的容器...)而且很难正确地剪裁它们，这可能是性能问题的根源

然而，两者似乎都会导致许多不同的问题，并且可能是性能泄漏的根源。有没有其他方法可以存档我想要的东西，或者有什么方法可以改进上述两种方法？

Answer 1

我最终使用了 Stencil-Buffer，这比深度方法产生更多的绘制调用，但更容易实现。

在我画之前我写了这段代码:

if (_Mask)
{
    if (Stage.StencilMaskDepth++ == 0)
        GL.Enable(EnableFlags.STENCIL_TEST);

    GL.ColorMask(false, false, false, false);
    GL.DepthMask(false);
    GL.StencilFunc(StencilFunction.ALWAYS, Stage.StencilMaskDepth, Stage.StencilMaskDepth);
    GL.StencilOp(StencilOp.INCR, StencilOp.INCR, StencilOp.INCR);

    // Draw rectangle
    DrawColor(Colors.Black);

    GL.ColorMask(true, true, true, true);
    GL.DepthMask(true);
    GL.StencilFunc(StencilFunction.EQUAL, Stage.StencilMaskDepth, Stage.StencilMaskDepth);
    GL.StencilOp(StencilOp.KEEP, StencilOp.KEEP, StencilOp.KEEP);
}

在绘制完所有 child 之后调用此代码:

if (_Mask)
{
    GL.ColorMask(false, false, false, false);
    GL.DepthMask(false);
    GL.StencilFunc(StencilFunction.ALWAYS, Stage.StencilMaskDepth, Stage.StencilMaskDepth);
    GL.StencilOp(StencilOp.DECR, StencilOp.DECR, StencilOp.DECR);
    // Draw rectangle
    DrawColor(Colors.Black);

    GL.ColorMask(true, true, true, true);
    GL.DepthMask(true);

    if (--Stage.StencilMaskDepth == 0)
        GL.Disable(EnableFlags.STENCIL_TEST);
}

也许我会在几个月内测试一些其他方法，但目前这是最容易实现的。