Logo Questions Linux Laravel Mysql Ubuntu Git Menu
 

Cut a translucent square in a texture

How to remove (cut-out) a transparent rectangle in a Texture, so that the hole will be translucent.

On Android I would use the Xfermodes approach:

How to use masks in android

But in libgdx I will have to use opengl. So far I almost achieved what I was looking for, by using the the glBlendFunc From this nice and very helpful page I learend that

glBlendFunc(GL_ZERO, GL_ONE_MINUS_SRC_ALPHA);

should solve my problem, but I tried it out, and it did not quite work as expected:

batch.end();
batch.begin();
//Draw the background
super.draw(batch, x, y, width, height);
batch.setBlendFunction(GL20.GL_ZERO,
        GL20.GL_ONE_MINUS_SRC_ALPHA);

//draw the mask
mask.draw(batch, x + innerButtonTable.getX(), y
        + innerButtonTable.getY(), innerButtonTable.getWidth(),
        innerButtonTable.getHeight());

batch.end();
batch.setBlendFunction(GL20.GL_SRC_ALPHA,
        GL20.GL_ONE_MINUS_SRC_ALPHA);
batch.begin();

It is just making the mask area plain black, whereas I was expecting transparency, any ideas.

This is what I get:

Mask will be drawn black

This is what I expected:

Mask area should be transparent

like image 414
joecks Avatar asked Nov 04 '22 03:11

joecks


1 Answers

I solved my problem by using the stencil buffer:

Gdx.gl.glClear(GL_STENCIL_BUFFER_BIT);
batch.end();
//disable color mask
Gdx.gl.glColorMask(false, false, false, false);
Gdx.gl.glDepthMask(false);
//enable the stencil
Gdx.gl.glEnable(GL20.GL_STENCIL_TEST);
Gdx.gl.glStencilFunc(GL20.GL_ALWAYS, 0x1, 0xffffffff);
Gdx.gl.glStencilOp(GL_REPLACE, GL_REPLACE, GL_REPLACE);

batch.begin();
//draw the mask
mask.draw(batch, x + innerButtonTable.getX(), y
        + innerButtonTable.getY(), innerButtonTable.getWidth(),
        innerButtonTable.getHeight());

batch.end();
batch.begin();

//enable color mask 
Gdx.gl.glColorMask(true, true, true, true);
Gdx.gl.glDepthMask(true);
//just draw where outside of the mask
Gdx.gl.glStencilFunc(GL_NOTEQUAL, 0x1, 0xffffffff);
Gdx.gl.glStencilOp(GL_KEEP, GL_KEEP, GL_KEEP);
//draw the destination texture
super.draw(batch, x, y, width, height);
batch.end();
//disable the stencil
Gdx.gl.glDisable(GL20.GL_STENCIL_TEST);
like image 196
joecks Avatar answered Nov 14 '22 22:11

joecks