Slick2d / LWJGL Adjusting alpha channel in OpenGL layer ( Java ) - java

I apologize for some of my ignorance as I am fairly new to Slick2D and LWJGL. Essentially what I'm trying to do is make a scene look like night time by covering it with a GL_QUADS rectangle that is tinted blue and is translucent.
That part is easy enough. What I want to do from there is draw triangles into this layer that vary the alpha channel so. The reason I want to do this is so I can simulate a light source by decreasing the opacity of the blue tinted rectangle as it gets closer to the light source.
I drew an example of what the expected result should be with the green being the background, the blue being the nighttime effect created by a blue tinted rectangle, and the increasingly dim light source in the center.
I need to find a way to do this with triangles because I created a raycasting algorithm that generates the result as a series of gradient triangles.
I apologize if this is explained poorly. I will answer any questions you might have.
Here is the chunk of code used to create the blue tinted rectangle:
glColor4f (0.0f,0.0f,1.0f,0.4f);
glBegin(GL_QUADS);
glVertex2f(0,0);
glVertex2f(screenWidth,0);
glVertex2f(screenWidth,screenHeight);
glVertex2f(0,screenHeight);
glEnd();
I would like to write a modified version of the following code to adjusted the alpha channel of that rectangle.
glBegin(GL_TRIANGLES);
setAlphaOfPriorLayer(0.0f);
glVertex2f(x1,y1);
setAlphaOfPriorLayer(0.4f);
glVertex2f(x2,y2);
setAlphaOfPriorLayer(0.4f);
glVertex2f(x3,y3);
glEnd();
Again, I'm using triangles to approximate a circle and allow for proper raycasting.

To achieve this, the use of a Frame Buffer Object is super useful. A FBO allows you to essentially render to a texture which can then be displayed on the screen. In my particular case, I rendered the elements to a FBO then used a shader while drawing it to the screen to get the desired opacities.

Related

LibGDX - Basic 2D lighting, don't know what to do

It's my first time attempting to create a basic light system that uses a black texture with a white circle on top. I read various threads about the issue but I just don't know what I am doing wrong.
What I want is the ambient to be dark and the light to be well white but changing the spritebatch color to something darker will cause the light to be darker to EVEN if I reset the color when drawing the light texture
So this is what I want (did this by forcing the light texture draw 5 times but that isn't a solution, it's an hack):
This is what I get (only 1 light texture is drawn but isn't very visible):
This is what I get without darkening the spritebatch:
Main code:
Game.sb.begin();
//Make stuff darker
Game.sb.setColor(0.1f, 0.1f, 0.1f,1f);
sb.setBlendFunction(GL20.GL_SRC_ALPHA, GL20.GL_ONE_MINUS_SRC_ALPHA);
lvl.render();
//Reset color
Game.sb.setColor(1f, 1f, 1f,1f);
sb.setBlendFunction(GL20.GL_DST_COLOR, GL20.GL_SRC_ALPHA);
//This draws all lights by drawing a texture with the above blending function
lightM.render();
Game.sb.end();
Light object draw method:
Game.sb.setColor(c.r,c.b,c.g, 1f);
Utils.drawTexture(Assets.get("sprites/lightcircle2.png", Texture.class), pos, size, true);
Game.sb.setColor(1,1,1,1);
Am I making some kind of error with the setcolor? I been considering using a FrameBuffer but I am not sure if it will give me the light effect I want
By the way this is my light texture (it's CC0):
You can achieve your requirement by these ways :
By using Shaders. Here is a small video and article on that video.
By use FBO and Blending, Here is one of my answer on this topic.
You can use box2dlight, even without using box2dbody(if you don't want any shadows)
World world = new World(new Vector2(0,0),false);
RayHandler rayHandler = new RayHandler(world);
rayHandler.setCombinedMatrix(stage.getCamera().combined); //<-- pass your camera combined matrix
new PointLight(rayHandler,1000, Color.WHITE,radius,x_position,y_position);
And at last call rayHandler.updateAndRender(); after all your rendering in your render() method.

How to create a gaussian blur effect in libGDX without shaders

How do you create a gaussian blur effect without any shaders? I tried many shader tutorials but I never got it to work. I also tried this link. https://github.com/mattdesl/lwjgl-basics/wiki/OpenGL-ES-Blurs
But, I couldn't get the screen to be transformed into a pixmap. Can you guys point me in the right direction on where to go to get the right answer?
Thanks in advance!
To draw blur without shaders you would need to draw the original scene to some texture. Then draw this texture NxN times on your main buffer with some blending. Alpha must correspond to the factor that depends on the offset in the NxN matrix. Just as pseudo:
for(int heightDiff=-N; heightDiff<=N; heightDiff++) {
for(int widthDiff=-N; widthDiff<=N; widthDiff++) {
float alpha = 1.0/max(width, height); // Not a correct equation
glColor(1.0, 1.0, 1.0, alpha):
drawFullscreenWithOffset(widthDiff, heightDiff);
}
}
It might be an optimization to separate vertical and horizontal blur though. That would mean you need to choose one of them and draw it to a new texture and then use that one to draw the other blur on the main buffer. You gain an extra texture but you reduce NxN draws to 2*N.

With Java's graphics shape drawing operations, is there an easy way to give the shapes transparency gradients and blurry edges?

What I would like is to give circles a fill color with a gradient that starts from the middle and then as it moves out to the edges becomes progressively more transparent, giving a blur effect. What is the simplest way of doing this?
Try setting an appropiately defined java.awt.RadialGradientPaint (using Colors with alpha), then render your circles using that. You may need to translate the graphics coordinate system to get the gradient centered in the circle. (http://docs.oracle.com/javase/7/docs/api/java/awt/RadialGradientPaint.html)
Or just make an image in a graphics program and simply draw the image.

Rendering lighting

I have a small block engine similar to a very early version of Minecraft using LWJGL. I now want to actually implement lighting. I understand how it works I'm just confused as to how I'm supposed to render lighting. Am I supposed to change the "brightness" of the texture to simulate bright terrain? I'm asking how to actually change the light value of a quad, maybe there are some tutorials out there? I want it to be block by block, no smooth lighting. I have figured out that blocks need to have a light value, and for every block next to it, you decrease that light value by a little bit until its "black".
(At least) two options, assuming a fixed-function renderer:
Use a single texture (your basic texture atlas, with the default GL_MODULATE texenv.) and set a per-vertex gray-scale color to darken the texture in proportion to the light level. With GL_MODULATE the texture RGB channels are multiplied by the vertex color RGB channels. So a vertex color of RGB(255,255,255) would be fully lit, RGB(0,0,0) would be pure black, and RGB(128,128,128) would be somewhere in the middle.
Use two textures (appearance atlas and lightmap atlas) and multitexture. The light level is set for a given face by supplying texture coordinates that select the appropriate lightmap square. If you animate the lightmap you can get a day/night cycle "for free" without having to iterate over the entire volume fixing up vertex colors like in #1.

Unexpected results implementing simple motion blur in Libgdx

In the two attached pictures, the desktop screenshot of libgdx functions as expected. The screenshot from my Galaxy Nexus is unfortunately not as expected. I am attempting to create a simple motion blur or trail effect.
Rendering as I expected on my desktop.
Not rendering as I expected on my Galaxy nexus.
The circle textures are drawn in a for loop during rendering and the effect is achieved with a pixmap using the RGBA of 0, 0, 0, 0.1f that is drawn before the circles.
screenClearSprite creation
Pixmap screenClearPixmap = new Pixmap(256, 256, Format.RGBA8888);
screenClearPixmap.setColor(Color.rgba8888(0, 0, 0, 0.1f));
screenClearPixmap.fillRectangle(0, 0, 256, 256);
screenClearTexture = new Texture(screenClearPixmap);
screenClearSprite = new Sprite(screenClearTexture);
screenClearSprite.setSize(screenWidth, screenHeight);
screenClearPixmap.dispose();
Render
batch.begin();
font.draw(batch, "fps:" + Gdx.graphics.getFramesPerSecond(), 0, 20);
screenClearSprite.draw(batch);
for (int i = 0; i < circleBodies.size(); i++) {
tempPos = circleBodies.get(i).getPosition();
batch.draw(circleTexture, (tempPos.x * SCALE) + screenWidthHalf
- circleSizeHalf, (tempPos.y * SCALE) + screenHeightHalf
- circleSizeHalf);
}
batch.end();
So, what did I do wrong? Perhaps there is a better way to get the 'motion blur' effect of movement?
Here is a different approach, where you clear your screen each time with solid color and no alpha.
This means that you will have to modify your code some. The good thing about this, is that the way you are doing it has some flaws: It will blur everything in motion, not just the balls. And can quickly produce ugly results/artefacts unless you are careful.
Do the same as you are doing now, but instead of drawing the balls to the batch, draw them onto a texture/bitmap/whatever. Then each frame add an alpha-blended image over the balls-image, and then draw the balls in their current position on top of that. Then add that image to your screen. Very much like you are doing now, except you draw to something else and keep it. This way you don't have to rely on the viewport you are drawing onto, and can keep everything separated.
This method is similar to drawing to an accumulation buffer.
Instead of doing it the way you are doing, you can keep track of the n latest positions of each ball. And then draw all of them each frame, with different alpha. This is very easy to implement. Can result in many drawing calls if you have many balls or a large n, but if it's not too much it shouldn't limit your fps and gives nice control.
Perhaps there is a better way to get the 'motion blur' effect of
movement?
in order to make motion blur in my game i use another approch "The particle effect" it works realy fine with me and i didn't have Android/Desktop problems or with different android devices
all you have to do is to use "Particle Effect Editor" of Libgdx and make your effect then load it in your project finally draw it at the same position you draw your object (and alos draw your object)
Tips to make the right effect file with Paticle Editor :
set (use) the same image of the object that you want to blur it motion in the particle effect
try to limit the count : the max number of particle allowed
Disable the "velocity" and "Angle"
parameter
Particle effect help to do motion effect
Hope this will help someone !

Categories

Resources