Libgdx模具和ShapeRenderer [英] Libgdx Stencil & ShapeRenderer

问题描述

我正在尝试实现以下目标:

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模具和ShapeRenderer的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！