问题描述

我正在尝试完成这样的事情:

I am trying to accomplish something like this:

示例图片

整个屏幕会是黑色的，那么三角形的内部是只会出现的部分.

The whole screen will be black, then the insides of the triangle shape are the parts that will only appear.

我尝试使用 SCISSOR，但它的形状是矩形.

I tried using SCISSOR but it is rectangle in shape.

*原始图片来源:https://www.html5rocks.com/static/images/screenshots/casestudies/onslaught/controls_tutorial.png

推荐答案

有几种不同的方法可以渲染蒙版图像.一种可能的方法是使用深度缓冲区.我编写了一个小方法，该方法显示了使用 ShapeRenderer 设置缓冲区的过程，以定义图像的三角形区域以渲染和屏蔽其余部分.三角形遮罩可以替换为 ShapeRenderer 能够渲染的任何其他形状.

There are a few different ways that you can render a masked image. One possible way is to use the depth buffer. I've written a small method that shows the process of setting up the buffer using a ShapeRenderer to define a triangular region of the image to render and mask out the remainder. The triangle mask could be replaced by any other shape that the ShapeRenderer is capable of rendering.

// For a 2D image use an OrthographicCamera
OrthographicCamera cam = new OrthographicCamera();
ShapeRenderer shapes = new ShapeRenderer();
cam.setToOrtho(true, screenWidth, screenHeight);
shapes.setProjectionMatrix(cam.combined);

private void renderStencilImage(float runTime){
    // Clear the buffer
    Gdx.gl.glClearDepthf(1.0f);
    Gdx.gl.glClear(GL30.GL_DEPTH_BUFFER_BIT);
    // Disable writing to frame buffer and
    // Set up the depth test
    Gdx.gl.glColorMask(false, false, false, false);
    Gdx.gl.glDepthFunc(GL20.GL_LESS);
    Gdx.gl.glEnable(GL20.GL_DEPTH_TEST);
    Gdx.gl.glDepthMask(true);
    //Here add your mask shape rendering code i.e. rectangle
    //triangle, or other polygonal shape mask
    shapes.begin(ShapeRenderer.ShapeType.Filled);
    shapes.setColor(1f, 1f, 1f, 0.5f);
    shapes.triangle(x1,y1,x2,y2,x3,y3);
    shapes.end();
    // Enable writing to the FrameBuffer
    // and set up the texture to render with the mask
    // applied
    Gdx.gl.glColorMask(true, true, true, true);
    Gdx.gl.glDepthMask(true);
    Gdx.gl.glDepthFunc(GL20.GL_EQUAL);
    // Here add your texture rendering code
    batcher.begin();
    renderFrame(runTime);
    batcher.end();
    // Ensure depth test is disabled so that depth
    // testing is not run on other rendering code.
    Gdx.gl.glDisable(GL20.GL_DEPTH_TEST);
}

在调用该方法之前，必须先创建一个 ShapeRenderer 并设置投影矩阵.您还必须在 onCreate 方法的 android 配置中设置深度缓冲区选项，如下所示:

Before you call the method, you must first create a ShapeRenderer and set the projection matrix. You must also set the depth buffer option in the android config in the onCreate method like this:

protected void onCreate (Bundle savedInstanceState) {
    super.onCreate(savedInstanceState);
    AndroidApplicationConfiguration config = new AndroidApplicationConfiguration();
    config.depth = 15;
    initialize(new game(), config);
}

glDepthFunc 的选项定义蒙版如何应用于纹理.查看 OpenGL wiki 以查看可以传递给函数的参数.

The options for glDepthFunc define how the mask is applied to the texture. Check out the OpenGL wiki to see the arguments that can be passed to the function.

这篇关于Libgdx Stencil &形状渲染器的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持编程学习网！