Alphing a part of a texture with a shader

I have just started learning shaders, so bear with me… :slight_smile:



First I explain the situation: I have a textured quad linked to the gui node, so it acts like a picture. The dimensions of the quad match the dimensions of the picture, so if the pic is 400x300 then the quad is 400x300 on the screen too, displaying the image pixels 1-to1. Now I want to be able to move that texture image so that its parts that move away from the quad are cropped, and the area that is now free of the picture becomes 100% alpha. Here is a picture to get you the full idea:



My current problem is this: I have been able to make the texture move using the “MovingTexture” shader from the pack. Now the place which has to be alphed is filled with some binary garbage. And I do not know how to make it transperent… Looking at glsl doc I have not found something that could help me…

For some reason there are no buttons for picture insertion on topic creation, so I post the image now:



I don’t know about that shader but in theory:



Put the clamp mode on the image to repeat the last line of pixels. Put a row of transparent pixels around the edges of the image. Mark the material as transparent and put the object in the transparent bucket.



Or do this by modifying the mesh instead (which will be faster anyway). If you take the texture co-ordinates of the bottom left corner, move it to the place in the texture where you want the bottom left corner to be and then move the other 4 vertices of the mesh in by the same amount…



Or last option would be to wait for my ImagePainter stuff to be available and do it by modifying the Image.

1 Like

noncom, you can do it with shaders. GUI node is like rootNode, but it is different in frustrum and others.



and about transparent pixels, you make “discard”(if i good remember).



it should work for GUI elements same as for normal spatials.



if you will see wezrule shader tutorials, you will know how to make this.

1 Like

I don’t know the specifics if your shader, but you can send the image’s width and height and use those to discard what is outside those bounds.

1 Like

If you set the texture to not repeat/use no clamping and add an offset to the coords… it moves the picture (I’m sure you knew this already) if the coords being rendered < 0.0f or > 1.0f then set alpha to 1.0 ermmm… or 0.0. It’s late. This should do what you want… and, no… I haven’t tested it.

1 Like

I guess I should mention the clamping thing again… NO CLAMPING lol… That binary garbage you are seeing is the last color used being stretch to the border.

1 Like

I usually think of alpha as opacity. 1.0 would be full opacity. Easier to remember that way. Although, I’ve seen rare occasion where it’s the contrary… Yeah… So… lol

1 Like

Thanks, guys, I will try what you have adviced and see if it will do what I need!



@zarch a very impressive work on the ImagePainter class!!! I will be very much glad when it is added to the core since this is an essential thing to have. I have looked at the video, and as far as I understand, it bring a full-featured painting feature to jME textures! Do you know Processing? I am using it for my 2D apps. If the same functionality is supported in jME textures, I can almost entirely switch to jME! So, a really nice feature to have! I see it is all computed with CPU, don’t you know, is it possible to shaderize it?

Was able to make it with the “discard” statement, calculating if the pixel should be invisible. Shader way is the preferable way for me since I am learning shaders, so I am very happy now. Can’t wait for when I can play with zarch’s ImagePainter though, since it is very suitable for one of my upcoming projects.

@noncom said:
Thanks, guys, I will try what you have adviced and see if it will do what I need!

@zarch a very impressive work on the ImagePainter class!!! I will be very much glad when it is added to the core since this is an essential thing to have. I have looked at the video, and as far as I understand, it bring a full-featured painting feature to jME textures! Do you know Processing? I am using it for my 2D apps. If the same functionality is supported in jME textures, I can almost entirely switch to jME! So, a really nice feature to have! I see it is all computed with CPU, don't you know, is it possible to shaderize it?


Well I'm not sure @momoko_fan agrees so we will have to see.

Some of the stuff done in ImagePainter could be done with shaders but I think you would lose as much shunting the data back and forth to the graphics card all the time as you gain accelerating the performance. The speed as it stands is plenty fast enough for pre-generating and modifying textures (for example if you had images with writing on them you could automatically translate them in code, you could generate procedural textures, etc). Limited animation would be possible but you are probably better off just going directly to a shader for that and animating in the shader as otherwise you are going to clog up all the bandwidth to/from the graphics card with the modified images.

I'm not familiar with the library you mentioned. There has been some talk of adding filters (i.e. blur/etc) to ImagePainter but other than that I'm not planning to extend it further. The aim is to allow image composition, generation, etc but I'm not going to try and replace photoshop :D

Yeah, the only bit that needs to be in core is get/set pixel. I think there is enough demand & general use for the ImagePainter stuff to join it but I can also see how it might be seen as outside the core focus of JME3. Really I don’t mind where ImagePainter goes so long as it makes sense and people who need it can find it :slight_smile:

2 Likes

jME3 is a game engine, not an image processing framework or a GPGPU library. If you want image processing, get a Java library to do that. I am sure you can use Processing together with jME3 to produce compatible textures.



We could provide ImagePainter as an SDK contribution library, but I don’t think its going to go to core.

@zarch well, ok, no core - no core… but please tell me, where can I find the contribution library so that I can use ImagePainter? I was looking everywhere and just can’t find it…

At the moment it’s only available as the code contribution in the linked thread, you would need to build your own JME3 with the patch applied.



I hope someone can get it sorted soon as I know quite a few people want to use it but it’s out of my hands now. That’s down to the core developers to make a decision and implement it.

1 Like