Is it possible to make some sort of alpha-masking texture?

Anything libgdx related goes here!

Re: Is it possible to make some sort of alpha-masking textur

Postby amost » Tue Jul 09, 2013 1:59 pm

t0neg0d wrote:Alpha masks are usually a second image passed into a shader and blended like:

Code: Select all
vec4 c = texture2D(colorTexture, texCoords0);
c.a *= texture2D(maskTexture, texCoords0).r;
gl_FragColor = c;


The mask image uses black (0.0... i.e. alphaValue * 0.0 = 0.0 or transparent) for complete transparency, white (1.0... i.e. alphaValue * 1.0 = the original alphaValue) for completely opaque (or original opacity anyways), and shades of gray for values in between.


Do you mind explaining to me how to use "texCoords0" and "gl_FragColor"? It seems that the problem with the implementation that I wanted to use is that opengl is really really picky about destination alpha values. I seem to not be able to make it recognize them (in the way I was trying before). I'd probably have to switch to doing something like this, but I've never used a "texCoords0", nor "gl_FragColor".

For example, If I look at some shader code examples online, they all declare those varibles with "attribute _________" or "varying texCoords0". Isn't that syntax c++? :S As you can tell, I'm very very new at shaders. What is the java equivalent of the setup for this?
amost
 
Posts: 23
Joined: Sun Aug 28, 2011 12:56 am

Re: Is it possible to make some sort of alpha-masking textur

Postby davedes » Tue Jul 09, 2013 2:51 pm

Here is a solution compatible with GLES10 and SpriteBatch:
https://gist.github.com/mattdesl/5957929

Notice the "batch.flush()" -- if you call glBlendFunction manually, you need to flush the batch before changing the blend function. In this demo, we use batch.setBlendFunction, which automatically flushes the batch for us. But I left the flush calls there for clarity.

As you can see, it leads to a lot of flushes. This is not performant -- each time you render a sprite, it leads to multiple render calls. A more performant solution would be to render in order: first, render all your background textures. Then, render all your mask sprites (i.e. feathered circles). Then, render all your sprites in the same spot as each mask. That way you (ideally) only have 3 render calls per frame.

If you plan on targeting mobile it's important to understand concepts like batching and so forth for performance:
https://github.com/mattdesl/lwjgl-basic ... e-Batching

At some point later I will post an example using shaders. It's a bit more advanced since SpriteBatch isn't (yet) very extendible, so you are forced to roll your own. In the mean time you might pick up some tricks here:
https://github.com/mattdesl/lwjgl-basics/wiki/Shaders
davedes
 
Posts: 434
Joined: Thu Oct 11, 2012 7:51 pm

Re: Is it possible to make some sort of alpha-masking textur

Postby amost » Tue Jul 09, 2013 11:55 pm

Wow, I have to take a break from trying this. Even when I implement that example exactly, the foreground texture does not obey the destination alpha. Something is completely wrong and I have no idea what it is... I'm going to go work on different aspects of this, and then maybe come back to this at a later date :( I appreciate your help very much! Thank you for taking the time to point me in the right direction!
amost
 
Posts: 23
Joined: Sun Aug 28, 2011 12:56 am

Re: Is it possible to make some sort of alpha-masking textur

Postby amost » Wed Jul 10, 2013 12:26 am

davedes wrote:Here is a solution compatible with GLES10 and SpriteBatch:
https://gist.github.com/mattdesl/5957929

Notice the "batch.flush()" -- if you call glBlendFunction manually, you need to flush the batch before changing the blend function. In this demo, we use batch.setBlendFunction, which automatically flushes the batch for us. But I left the flush calls there for clarity.

As you can see, it leads to a lot of flushes. This is not performant -- each time you render a sprite, it leads to multiple render calls. A more performant solution would be to render in order: first, render all your background textures. Then, render all your mask sprites (i.e. feathered circles). Then, render all your sprites in the same spot as each mask. That way you (ideally) only have 3 render calls per frame.

If you plan on targeting mobile it's important to understand concepts like batching and so forth for performance:
https://github.com/mattdesl/lwjgl-basic ... e-Batching

At some point later I will post an example using shaders. It's a bit more advanced since SpriteBatch isn't (yet) very extendible, so you are forced to roll your own. In the mean time you might pick up some tricks here:
https://github.com/mattdesl/lwjgl-basics/wiki/Shaders


OK I can confirm that I downloaded the BlendTest program, and it does not work properly on my phone (Nexus 4). So the problem is the video processor on my phone. I read somewhere that certain hardware does not support acknowledging destination alpha. This must be the case for my phone. That is disappointing. It looks like the only option I have is to learn shaders if I want to use this effect.
amost
 
Posts: 23
Joined: Sun Aug 28, 2011 12:56 am

Re: Is it possible to make some sort of alpha-masking textur

Postby davedes » Wed Jul 10, 2013 4:03 am

Did you change anything about my code? Were you testing with different images? Or with a different Activity that might have set some config? What Android version are you running on your Nexus?

I've never heard of this. It's pretty shocking that it does not implement blend modes correctly...
davedes
 
Posts: 434
Joined: Thu Oct 11, 2012 7:51 pm

Re: Is it possible to make some sort of alpha-masking textur

Postby amost » Wed Jul 10, 2013 7:27 pm

davedes wrote:Did you change anything about my code? Were you testing with different images? Or with a different Activity that might have set some config? What Android version are you running on your Nexus?

I've never heard of this. It's pretty shocking that it does not implement blend modes correctly...


I made a new project called BlendTest with the setup-gui.jar file, and then directly pasted your code in (with no modifications). I noticed that I didn't have that com.badlogic.gdx.backends.lwjgl.LwjglApplication library in my project, but I had the jar file in my nightly download directory, so I manually added that library as an external jar for my BlendTest as well as BlendTest-android, and everything compiled perfectly.

I used the image files/filenames specified as well. The result was that I could see the background, and then the grass sprite in the bottom left corner with no transparency effect.
Here is a screenshot of the result:
https://docs.google.com/file/d/0B-mT_2U ... sp=sharing

My Nexus 4 is stock android 4.2.2.
Kernel version 3.4.0-perf-g7ce11cd
Build JDQ39

(After I ran the program with the above result, I went back and made the mask's blend mode to visible to make sure that it was actually using the correct file, and I did see it show up.)
amost
 
Posts: 23
Joined: Sun Aug 28, 2011 12:56 am

Re: Is it possible to make some sort of alpha-masking textur

Postby davedes » Wed Jul 10, 2013 9:23 pm

Thanks, good to know. I will post a shader alternative at some point soon. :)
davedes
 
Posts: 434
Joined: Thu Oct 11, 2012 7:51 pm

Re: Is it possible to make some sort of alpha-masking textur

Postby amost » Wed Jul 10, 2013 11:02 pm

davedes wrote:Thanks, good to know. I will post a shader alternative at some point soon. :)


Thank you very much! I appreciate all the time you spent helping me! I'll be looking forward to that tutorial! :D
amost
 
Posts: 23
Joined: Sun Aug 28, 2011 12:56 am

Re: Is it possible to make some sort of alpha-masking textur

Postby peter23 » Fri Jul 19, 2013 2:16 am

Any news on the afore mentioned tutorial? Would be highly appreciated!
Regards,
Peter
peter23
 
Posts: 1
Joined: Fri Jul 19, 2013 2:14 am

Re: Is it possible to make some sort of alpha-masking textur

Postby davedes » Thu Aug 15, 2013 3:38 pm

Any news on the afore mentioned tutorial? Would be highly appreciated!
Regards,
Peter


I have a work-in-progress writeup here:
https://github.com/mattdesl/lwjgl-basic ... DX-Masking
davedes
 
Posts: 434
Joined: Thu Oct 11, 2012 7:51 pm

Previous

Return to Libgdx

Who is online

Users browsing this forum: Google [Bot], Yahoo [Bot] and 7 guests