I have an application that receives information from a database, and is used to visualize 2D bitmaps onto a GLSurfaceView. The information received will determine the x-position of the bitmap, and which bitmap image to use (there are 4 different bitmaps in my res folder to choose from).
Below are the three classes that are being used. The Activity sets the Shapes objects that need to be drawn by passing an ArrayList to the GLLayer class. This ArrayList is passed to the instance of ShapeStorage class via another setList method. This class is responsible for drawing when they are received.
The problem that I'm having is the following. Suppose I receive one object (let's say that it's a square at it's located at x=1). Some time goes by, and I receive another shape (this time, it's a triangle, and it's located at x=-1). However, when this new shape appears on the screen, the old bitmap's appearance changes to a triangle, and the new one becomes a square. In other words, the objects themselves are at the correct position that they are supposed to be at, but the bitmap being associated with them has changed. Does anyone know what the possible cause of this can be? I'm still a newbie to OpenGL-ES, and while this code looks very convoluted, it just involves setting a bunch of various properties for the View. Please help me, StackOverflow! You're my only hope.
public class GLLayer extends GLSurfaceView implements Renderer {
int onDrawFrameCounter=1;
int[] cameraTexture;
byte[] glCameraFrame=new byte[256*256]; //size of a texture must be a power of 2
private Context context;
FloatBuffer cubeBuff;
FloatBuffer texBuff;
ShapeStorage shapes;
ArrayList<Shapes> shapereceptionbuffer;
public GLLayer(Context c) {
super(c);
this.context=c;
//Initiate our stars class with the number of stars
shapes = new ShapeStorage();
shapereceptionbuffer=new ArrayList<Shapes>();
this.setEGLConfigChooser(5, 6, 5, 8, 16, 0);
this.setRenderer(this); //set the following class as a GLSurfaceView renderer
this.getHolder().setFormat(PixelFormat.TRANSPARENT); //makes the GLSurfaceView translucent
}
public void onSurfaceCreated(GL10 gl, EGLConfig config) {
try {
gl.glHint(GL10.GL_PERSPECTIVE_CORRECTION_HINT, GL10.GL_FASTEST);
gl.glShadeModel(GL10.GL_SMOOTH); //Enable Smooth Shading
gl.glEnable(GL10.GL_TEXTURE_2D); //Enable Texture Mapping
gl.glEnable(GL10.GL_BLEND); //Enable blending
gl.glClearColor(0.0f, 0.0f, 0.0f, 0.0f); //Black Background
gl.glClearDepthf(1.0f); //Depth Buffer Setup
gl.glDisable(GL10.GL_DEPTH_TEST); //Disable depth test
gl.glBlendFunc(GL10.GL_SRC_ALPHA, GL10.GL_ONE); //Set The Blending Function For Translucency
shapes.setTextures(gl,context);
} catch (Exception e) {
// TODO Auto-generated catch block
Log.d("Created",e.getMessage());
}
}//end of surfacecreated
public void setList(ArrayList<Shapes> receivedList){
synchronized(this.shapereceptionbuffer){
shapereceptionbuffer=receivedList;
}
}
public void onSurfaceChanged(GL10 gl, int width, int height) {
try {
if(height == 0) { //Prevent A Divide By Zero By
height = 1; //Making Height Equal One
}
gl.glViewport(0, 0, width, height);//specifies transformation from normalized device coordinates to window coordinates
float ratio = (float) width / height;
gl.glMatrixMode(GL11.GL_PROJECTION); //Select The Projection Matrix
gl.glLoadIdentity();//Reset The Projection Matrix
GLU.gluPerspective(gl, 45.0f, ratio, 0.1f, 100.0f);
gl.glMatrixMode(GL11.GL_MODELVIEW);//Select The Modelview Matrix
gl.glLoadIdentity();//Reset The Modelview Matrix
} catch (Exception e) {
// TODO Auto-generated catch block
Log.d("Changed",e.getMessage());
}
//GLU.gluLookAt(gl, 0, 0, 4.2f, 0, 0, 0, 0, 1, 0);//eye-point location, center of the scene and an UP vector
}//end of surfacechanged
public void onDrawFrame(GL10 gl) {
try {
gl.glClear(GL10.GL_COLOR_BUFFER_BIT | GL10.GL_DEPTH_BUFFER_BIT); //Clear Screen And Depth Buffer
Log.d("Buffer Size", String.valueOf(shapereceptionbuffer.size()));
synchronized(this.shapereceptionbuffer){
shapes.setShapes(shapereceptionbuffer);
shapes.draw(gl, this.context);
}
} catch (Exception e) {
Log.d("Draw",e.getMessage());
}
}//end of ondrawframe
}
This class is responsible for drawing each of the shapes that are received from the external database.
/**
* This class contains, loads, initiates textures and draws our Shapes
*/
public class ShapeStorage {
private ArrayList<Shapes> shapestoragebuffer;
private Random rand = new Random(); // Initiate Random for random values of
// stars
/** Our texture pointer */
private int[] textures = new int[4];
/**
* Constructor for our holder
*/
public ShapeStorage() {
shapestoragebuffer = new ArrayList<Shapes>();
}
public void setShapes(ArrayList<Shapes> receivedlist) {
shapestoragebuffer = receivedList;
}
public void setupTextures(GL10 gl, Context context) {
// Get the texture from the Android resource directory
InputStream is = null;
gl.glGenTextures(4, textures, 0);
for (int i = 2; i < 6; i++) {
switch (i) {
case 2:
is = context.getResources().openRawResource(R.drawable.square);
break;
case 3:
is = context.getResources().openRawResource(R.drawable.circle);
break;
case 4:
is = context.getResources().openRawResource(R.drawable.hexagon);
break;
case 5:
is = context.getResources()
.openRawResource(R.drawable.triangle);
break;
}
Bitmap bitmap = null;
try {
// BitmapFactory is an Android graphics utility for images
bitmap = BitmapFactory.decodeStream(is);
} finally {
// Always clear and close
try {
is.close();
is = null;
} catch (IOException e) {
}
}
// Generate the texture pointer
// Create Linear Filtered Texture and bind it to texture
GLUtils.texImage2D(GL11.GL_TEXTURE_2D, 0, bitmap, 0);
gl.glBindTexture(GL11.GL_TEXTURE_2D, textures[i - 2]);
gl.glTexParameterf(GL11.GL_TEXTURE_2D, GL11.GL_TEXTURE_MAG_FILTER,
GL11.GL_LINEAR);
gl.glTexParameterf(GL11.GL_TEXTURE_2D, GL11.GL_TEXTURE_MIN_FILTER,
GL11.GL_LINEAR);
// Clean up
bitmap.recycle();
}
}
/**
* The drawing function.
*
* #param gl
* - The GL Context
* #param twinkle
* - Twinkle on or off
*/
public void draw(GL10 gl, Context context) {
// Bind the icon texture for all Shapes
for (int loop = 0; loop < shapestoragebuffer.size(); loop++) {
// Recover the current star into an object
Shapes shape = shapestoragebuffer.get(loop);
gl.glLoadIdentity(); // Reset The Current Modelview Matrix
// gl.glRotatef(180.0f, -1.0f, 0.0f, 0.0f);
float x = shape.get_Offset_from_center();
gl.glTranslatef(x, 0.0f, -40.0f);
// Draw
switch (victim.getType()) {
// green
case 2:
shape.draw(gl, textures[0]);
break;
// red
case 3:
shape.draw(gl, textures[1]);
break;
// yellow
case 4:
shape.draw(gl, textures[2]);
break;
case 5:
shape.draw(gl, textures[3]);
break;
}
}
}
}
Here is the class that defines each of the objects that are being drawn to the GLSurfaceView; each of the shapes that are being drawn.
public class Shapes {
private int _Offset_from_center;
private int type;
Context c;
/** The buffer holding the vertices */
private FloatBuffer vertexBuffer;
/** The buffer holding the texture coordinates */
private FloatBuffer textureBuffer;
/** The initial vertex definition */
private float vertices[] = {
-1.0f, -1.0f, 0.0f, //Bottom Left
1.0f, -1.0f, 0.0f, //Bottom Right
-1.0f, 1.0f, 0.0f, //Top Left
1.0f, 1.0f, 0.0f //Top Right
};
/** The initial texture coordinates (u, v) */
private float texture[] = {
0.0f, 0.0f,
1.0f, 0.0f,
0.0f, 1.0f,
1.0f, 1.0f,
};
public Shapes() {
//
ByteBuffer byteBuf = ByteBuffer.allocateDirect(vertices.length * 4);
byteBuf.order(ByteOrder.nativeOrder());
vertexBuffer = byteBuf.asFloatBuffer();
vertexBuffer.put(vertices);
vertexBuffer.position(0);
//
byteBuf = ByteBuffer.allocateDirect(texture.length * 4);
byteBuf.order(ByteOrder.nativeOrder());
textureBuffer = byteBuf.asFloatBuffer();
textureBuffer.put(texture);
textureBuffer.position(0);
}
public int get_Offset_from_center() {
return _Offset_from_center;
}
public void set_Offset_from_center(int _Offset_from_center) {
this._Offset_from_center = _Offset_from_center;
}
public int getType() {
return type;
}
public void setType(int type) {
this.type = type;
}
/**
* The object own drawing function.
* Called from the renderer to redraw this instance
* with possible changes in values.
*
* #param gl - The GL Context
*/
public void draw(GL10 gl,int texture) {
gl.glBindTexture(GL11.GL_TEXTURE_2D, texture);
//Enable the vertex, texture and normal state
gl.glEnableClientState(GL11.GL_VERTEX_ARRAY);
gl.glEnableClientState(GL11.GL_TEXTURE_COORD_ARRAY);
//Point to our buffers
gl.glVertexPointer(3, GL11.GL_FLOAT, 0, vertexBuffer);
gl.glTexCoordPointer(2, GL11.GL_FLOAT, 0, textureBuffer);
//Draw the vertices as triangle strip
gl.glDrawArrays(GL11.GL_TRIANGLE_STRIP, 0, vertices.length / 3);
//Disable the client state before leaving
gl.glDisableClientState(GL11.GL_VERTEX_ARRAY);
gl.glDisableClientState(GL11.GL_TEXTURE_COORD_ARRAY);
}
}
You're doing something very strange with the textures. Why do you upload the texture image data for every shape on every frame, and why do you do it after you render the shape?
Here's how the usual flow of texture use in OpenGL works:
At app initialization time:
Generate a texture ID using glGenTextures.
Use glBindTexture to make that ID the current texture.
Set texture parameters.
Upload image data with texImage2D or similar.
Then, every time you need to render stuff with the texture:
Bind the texture with glBindTexture with the same ID you used above.
Render things, which will use the texture.
What I would recommend here is this:
When you activity starts up (called indirectly from onCreate or maybe onResume depending on how Android OpenGL works):
Make textures a 5-element array and pass 5 to glGenTextures
Loop through, and for each of your five resources, bind one of the four above, and upload your image with texImage2D just like you have.
Then, when you actually need to draw a shape:
Pass in an int for the texture, not an int[]; choose the right one based on the shape you want.
Call glBindTexture in your draw function, first, with that value.
Do not make any calls to texImage2D in your rendering pass.
Call glDrawArrays to draw the shape you chose with glBindTexture.
Note also that all your shapes can share the same vertex and texture buffers, since their contents are the same; that's just an efficiency thing though.
Related
While trying to set up a minimal reproducable example using LWJGL because my original question was closed, I ran into a problem I didn't have originally (Originally it was just not displaying), which is that the JVM now crashes with an EXCEPTION_ACCESS_VIOLATION error during the glDrawArrays() call.
I don't know what could be causing this, but I've tried for example initializing the vertex attribute pointers each frame. There is also no debug information or errors logged, while I did set up an error callback and I think a debug message callback.
All of the code:
import org.lwjgl.glfw.GLFW;
import org.lwjgl.glfw.GLFWErrorCallback;
import org.lwjgl.opengl.GL;
import org.lwjgl.opengl.GL30;
import org.lwjgl.opengl.GLUtil;
import java.io.InputStream;
import java.nio.ByteBuffer;
import java.nio.charset.StandardCharsets;
public class MinimalExample {
private static String readResource(String res) {
try {
InputStream is = MinimalExample.class.getResourceAsStream(res);
String s = new String(is.readAllBytes(), StandardCharsets.UTF_8);
is.close();
return s;
} catch (Exception e) {
throw new IllegalStateException(e);
}
}
// vertex data buffer
private static final ByteBuffer buf = ByteBuffer.allocateDirect(4096);
// shader program
static int program;
// render objects
static int vao;
static int vbo;
public static void main(String[] args) {
// set buffer limit
buf.limit(4096);
// init glfw and create window
GLFW.glfwInit();
long window = GLFW.glfwCreateWindow(500, 500, "Hello", 0, 0);
// create GL
GLFW.glfwMakeContextCurrent(window);
GL.createCapabilities();
GLUtil.setupDebugMessageCallback(System.out);
GLFW.glfwSetErrorCallback(GLFWErrorCallback.createPrint(System.out));
// create vertex objects
vao = GL30.glGenVertexArrays();
vbo = GL30.glGenBuffers();
GL30.glBindVertexArray(vao);
GL30.glVertexAttribPointer(0, 3, GL30.GL_FLOAT, false, 7 * 4, 0);
GL30.glVertexAttribPointer(1, 4, GL30.GL_FLOAT, false, 7 * 4, 0);
GL30.glEnableVertexAttribArray(0);
GL30.glEnableVertexAttribArray(1);
GL30.glBindVertexArray(0);
// compile and link shaders
int vertexShader = GL30.glCreateShader(GL30.GL_VERTEX_SHADER);
int fragmentShader = GL30.glCreateShader(GL30.GL_FRAGMENT_SHADER);
GL30.glShaderSource(vertexShader, readResource("/test.vsh"));
GL30.glShaderSource(fragmentShader, readResource("/test.fsh"));
GL30.glCompileShader(vertexShader);
GL30.glCompileShader(fragmentShader);
program = GL30.glCreateProgram();
GL30.glAttachShader(program, vertexShader);
GL30.glAttachShader(program, fragmentShader);
GL30.glLinkProgram(program);
// render loop
while (!GLFW.glfwWindowShouldClose(window)) {
// poll events
GLFW.glfwPollEvents();
// clear screen
GL30.glClearColor(1.0f, 1.0f, 1.0f, 1.0f);
GL30.glClear(GL30.GL_COLOR_BUFFER_BIT);
// render
render();
// swap buffers
GLFW.glfwSwapBuffers(window);
}
}
static void render() {
// put vertex data
// manual to simulate graphics library
putVec3(0.25f, 0.25f, 1f); putVec4(1.0f, 0.0f, 0.0f, 1.0f);
putVec3(0.75f, 0.25f, 1f); putVec4(0.0f, 1.0f, 0.0f, 1.0f);
putVec3(0.50f, 0.75f, 1f); putVec4(0.0f, 0.0f, 1.0f, 1.0f);
// bind program
GL30.glUseProgram(program);
// bind vertex array
GL30.glBindVertexArray(vao);
GL30.glEnableVertexAttribArray(0);
GL30.glEnableVertexAttribArray(1);
// upload graphics data and draw
GL30.glBindBuffer(GL30.GL_ARRAY_BUFFER, vbo);
GL30.glBufferData(GL30.GL_ARRAY_BUFFER, buf, GL30.GL_STATIC_DRAW);
GL30.glDrawArrays(GL30.GL_TRIANGLES, 0, 3);
GL30.glBindBuffer(GL30.GL_ARRAY_BUFFER, 0);
GL30.glBindVertexArray(0);
// reset vertex data buffer
buf.position(0);
}
//////////////////////////////////////////
static void putVec3(float x, float y, float z) {
buf.putFloat(x).putFloat(y).putFloat(z);
}
static void putVec4(float x, float y, float z, float w) {
buf.putFloat(x).putFloat(y).putFloat(z).putFloat(z);
}
}
The full JVM error log (hs_err_pidX.log): pastes.dev
For context, I'm running this with JDK 17 from IntelliJ directly. Here is the build.gradle file if you want to check the dependencies: build.gradle (GitHub)
I have managed to open a window and render a triangle on the screen in LWJGL. I have now created two external files for the vertex shader & fragment shader. However the triangle remains white.
This is the main file, where it calls the method to load the vertex shader and compile it, I have added a simple system.out line to see if this is being called, which it is.
import org.lwjgl.*;
import org.lwjgl.glfw.*;
import org.lwjgl.opengl.*;
import org.lwjgl.system.*;
import java.io.BufferedReader;
import java.io.FileReader;
import java.io.IOException;
import java.nio.*;
import static org.lwjgl.glfw.Callbacks.*;
import static org.lwjgl.glfw.GLFW.*;
import static org.lwjgl.opengl.GL11.*;
import static org.lwjgl.system.MemoryStack.*;
import static org.lwjgl.system.MemoryUtil.*;
public class Main {
String TITLE = "f";
// The window handle
private long window;
public void run() {
System.out.println("Hello LWJGL " + Version.getVersion() + "!");
init();
loop();
// Free the window callbacks and destroy the window
glfwFreeCallbacks(window);
glfwDestroyWindow(window);
// Terminate GLFW and free the error callback
glfwTerminate();
glfwSetErrorCallback(null).free();
}
private void init() {
// Setup an error callback. The default implementation
// will print the error message in System.err.
GLFWErrorCallback.createPrint(System.err).set();
// Initialize GLFW. Most GLFW functions will not work before doing this.
if ( !glfwInit() )
throw new IllegalStateException("Unable to initialize GLFW");
// Configure GLFW
glfwDefaultWindowHints(); // optional, the current window hints are already the default
glfwWindowHint(GLFW_VISIBLE, GLFW_FALSE); // the window will stay hidden after creation
glfwWindowHint(GLFW_RESIZABLE, GLFW_TRUE); // the window will be resizable
// Create the window
window = glfwCreateWindow(300, 300, TITLE, NULL, NULL);
if ( window == NULL )
throw new RuntimeException("Failed to create the GLFW window");
// Setup a key callback. It will be called every time a key is pressed, repeated or released.
glfwSetKeyCallback(window, (window, key, scancode, action, mods) -> {
if ( key == GLFW_KEY_ESCAPE && action == GLFW_RELEASE )
glfwSetWindowShouldClose(window, true); // We will detect this in the rendering loop
});
// Get the thread stack and push a new frame
try ( MemoryStack stack = stackPush() ) {
IntBuffer pWidth = stack.mallocInt(1); // int*
IntBuffer pHeight = stack.mallocInt(1); // int*
// Get the window size passed to glfwCreateWindow
glfwGetWindowSize(window, pWidth, pHeight);
// Get the resolution of the primary monitor
GLFWVidMode vidmode = glfwGetVideoMode(glfwGetPrimaryMonitor());
// Center the window
glfwSetWindowPos(
window,
(vidmode.width() - pWidth.get(0)) / 2,
(vidmode.height() - pHeight.get(0)) / 2
);
} // the stack frame is popped automatically
// Make the OpenGL context current
glfwMakeContextCurrent(window);
// Enable v-sync
glfwSwapInterval(1);
// Make the window visible
glfwShowWindow(window);
}
private void loop() {
// This line is critical for LWJGL's interoperation with GLFW's
// OpenGL context, or any context that is managed externally.
// LWJGL detects the context that is current in the current thread,
// creates the GLCapabilities instance and makes the OpenGL
// bindings available for use.
GL.createCapabilities();
drawTriangle();
loadShader("screenvertfilelocation", GL30.GL_VERTEX_SHADER);
loadShader("screenvertfilelocation", GL30.GL_FRAGMENT_SHADER);
// Set the clear color
glClearColor(1.0f, 0.0f, 0.0f, 0.0f);
// Run the rendering loop until the user has attempted to close
// the window or has pressed the ESCAPE key.
while ( !glfwWindowShouldClose(window) ) {
glClear(GL_COLOR_BUFFER_BIT | GL_DEPTH_BUFFER_BIT); // clear the framebuffer
processTriangle();
glfwSwapBuffers(window); // swap the color buffers
// Poll for window events. The key callback above will only be
// invoked during this call.
glfwPollEvents();
}
}
public static void main(String[] args) {
new Main().run();
}
int vertexCount = 0;
int VAO = 0;
int VBO = 0;
public void drawTriangle() {
float vertices[] = {
-0.5f, -0.5f, 0.0f,
0.5f, -0.5f, 0.0f,
0.0f, 0.5f, 0.0f
};
int VBO = GL30.glGenBuffers();
int VAO = GL30.glGenBuffers();
// Sending data to OpenGL requires the usage of (flipped) byte buffers
FloatBuffer verticesBuffer = BufferUtils.createFloatBuffer(vertices.length);
verticesBuffer.put(vertices);
verticesBuffer.flip();
vertexCount = 3;
GL30.glBindVertexArray(VAO);
GL30.glBindBuffer(GL30.GL_ARRAY_BUFFER, VBO);
GL30.glBufferData(GL30.GL_ARRAY_BUFFER, verticesBuffer, GL30.GL_STATIC_DRAW);
GL30.glVertexAttribPointer(0, 3, GL30.GL_FLOAT, false, 0, 0);
GL30.glEnableVertexAttribArray(0);
GL30.glBindBuffer(GL30.GL_ARRAY_BUFFER, 0);
GL30.glBindVertexArray(0);
}
public void processTriangle() {
GL30.glBindVertexArray(VAO);
GL30.glDrawArrays(GL_TRIANGLES, 0, 3);
}
//Deals with the Shaders
private static int loadShader(String file, int type){
StringBuilder shaderSource = new StringBuilder();
try{
BufferedReader reader = new BufferedReader(new FileReader(file));
String line;
while((line = reader.readLine())!=null){
shaderSource.append(line).append("//\n");
}
reader.close();
}catch(IOException e){
e.printStackTrace();
System.exit(-1);
}
int shaderID = GL20.glCreateShader(type);
GL20.glShaderSource(shaderID, shaderSource);
GL20.glCompileShader(shaderID);
int vertexShader;
vertexShader = GL30.glCreateShader(GL30.GL_VERTEX_SHADER);
int fragmentShader;
fragmentShader = GL30.glCreateShader(GL30.GL_FRAGMENT_SHADER);
int shaderProgram;
shaderProgram = GL30.glCreateProgram();
GL30.glAttachShader(shaderProgram, vertexShader);
GL30. glAttachShader(shaderProgram, fragmentShader);
GL30.glLinkProgram(shaderProgram);
GL30.glUseProgram(shaderProgram);
GL30.glDeleteShader(vertexShader);
GL30.glDeleteShader(fragmentShader);
System.out.println("Hello");
if(GL20.glGetShaderi(shaderID, GL20.GL_COMPILE_STATUS )== GL11.GL_FALSE){
System.out.println(GL20.glGetShaderInfoLog(shaderID, 500));
System.err.println("Could not compile shader!");
System.exit(-1);
}
return shaderID;
}
}
Here is the vertex shader file:
#version 330 core
layout (location = 0) in vec3 aPos;
out vec4 vertexColor;
void main()
{
gl_Position = vec4(aPos, 1.0);
vertexColor = vec4(0.5, 4.0, 0.0, 1.0);
}
and here is the fragment shader file:
#version 330 core
out vec4 FragColor;
in vec4 vertexColor;
void main()
{
FragColor = vertexColor;
}
There are both improvements and corrections to be made here
1. Improvements
This is in your shader. After linking your shader you also need to verify it. Although your shader works fine without it for more complex programs it can reveal hidden error's
Here is the modified code[Just an suggestion take it if you wish]
private void loadProgram()
{
int vertex,fragment;
int programID=GL20.glCreateProgram(); //Step 1 create program and attach source code to it
GL20.glAttachShader(programID,vertex=loadShader("screenvertfilelocation",GL20.GL_VERTEX_SHADER));
GL20.glAttachShader(programID,fragment=loadShader("screenvertfilelocation",GL20.GL_FRAGMENT_SHADER));
GL20.glLinkProgram(programID); //Step 2 link the program
if(GL20.glGetProgrami(programID,GL20.GL_LINK_STATUS)==GL11.GL_FALSE)
{
int infoLogSize=GL20.glGetProgrami(programID,GL20.GL_INFO_LOG_LENGTH); //Get's exact error size rather than using 500
System.err.println(GL20.glGetProgramInfoLog(programID,infoLogSize));
System.err.println("COULD NOT LINK SHADER");
System.exit(-1);
}
GL20.glValidateProgram(programID); //Step 3 Validate shader
if(GL20.glGetProgrami(programID,GL20.GL_VALIDATE_STATUS)==GL11.GL_FALSE)
{
int infoLogSize=GL20.glGetProgrami(programID,GL20.GL_INFO_LOG_LENGTH); //Get exact error size
System.err.println(GL20.glGetProgramInfoLog(programID,infoLogSize));
System.err.println("COULD NOT VALIDATE SHADER");
System.exit(-1);
}
GL20.glDeleteShader(vertex); //Step 4 clean up
GL20.glDeleteShader(fragment);
GL20.glUseProgram(programID);
}
private int loadShader(String fileName,int shaderType)
{
try(BufferedReader reader = new BufferedReader(new FileReader(fileName)))
{
StringBuilder source=new StringBuilder();
String line;
while((line=reader.readLine())!=null)
{
source.append(line)
.append(System.lineSeparator());
}
int shaderID=GL20.glCreateShader(shaderType);
GL20.glShaderSource(shaderID,source);
GL20.glCompileShader(shaderID);
if(GL20.glGetShaderi(shaderID,GL20.GL_COMPILE_STATUS)==GL11.GL_FALSE)
{
int infoLogSize=GL20.glGetShaderi(shaderID,GL20.GL_INFO_LOG_LENGTH);
throw new IOException("COULD NOT COMPILE SHADER "+GL20.glGetShaderInfoLog(shaderID,infoLogSize));
}
return shaderID;
}
catch(IOException ex)
{
ex.printStackTrace(System.err);
System.exit(-1);
return -1;
}
}
Call loadProgram() after drawTriangle()
2. Your Solution
This is just a follow up from #Rabbid76 post
As soon as i copy pasted your code in my IDE i get the warning
local variable hides a field
In this code
int vertexCount = 0;
int VAO = 0;
int VBO = 0;
public void drawTriangle() {
float vertices[] =
{
-0.5f, -0.5f, 0.0f,
0.5f, -0.5f, 0.0f,
0.0f, 0.5f, 0.0f
};
//The warning here. You are redeclaring VBO & VAO
int VBO = GL15.glGenBuffers();
int VAO = GL30.glGenVertexArrays(); // #Rabbid76 original fix
Just remove the declarations
VBO = GL15.glGenBuffers();
VAO = GL30.glGenVertexArrays();
I am using LWJGL 3.1.3 and most of the gl functions and constants i use belong to an diffrent gl version for example there is no
GL30.GL_FLOAT
but
GL11.GL_FLOAT
Just to name a few
Output:
The problem
When I move the Camera every texture that is getting rendered flickers about the screen on 2 different positions.
What I want
example: When I move the camera to the left, I want the all the textures to move 32 pixels to the right. camera moves 32 pixels per button press.
Current code
I added some extra explanation in comments.
MainProgramEntryPoint
/**
* DefaultCamera: Setting up OrthographicCamera
* CameraMovement: Using camera.translate on keypresses to move the screen.
* TestMoveable: Creating a texture for testing rendering.
*/
public class WorldSimGame extends ApplicationAdapter {
private DefaultCamera defaultCamera;
private CameraMovement cameraMovement;
private TestMoveable testMoveable;
// Setting up the camera and texture.
public void create () {
defaultCamera = new DefaultCamera();
cameraMovement = new CameraMovement(defaultCamera.getCamera());
testMoveable = new TestMoveable();
testMoveable.create(defaultCamera);
}
// The testMoveable.render(defaultCamera) should keep track of the testMoveable position
public void render () {
Gdx.gl.glClearColor(1, 0, 0, 1);
Gdx.gl.glClear(GL20.GL_COLOR_BUFFER_BIT);
defaultCamera.render();
testMoveable.render(defaultCamera);
}
}
TestMoveable
public class TestMoveable {
private Texture tex;
private SpriteBatch batch;
private Vector3 position;
public void create(DefaultCamera defaultCamera) {
tex = new Texture(("wall.png"));
batch = new SpriteBatch();
position = new Vector3(100, 100, 0);
defaultCamera.getCamera().unproject(position);
}
I cant imagine setting the x and y coordinates on the world coordinates wouldn't work.
public void render(DefaultCamera defaultCamera) {
batch.begin();
batch.draw(tex, position.x, position.y);
batch.end();
}
}
What am I doing wrong here? And is there a better way to implement position checking for the renderers?
You don't need to check the position of the renderer. All what you must do is to set the size and position of your camera. Then with batch.setProjectionMatrix(camera.combined) you say the batch to draw what the camera sees.
So when you create a camera with size = 50x50 and position = 100,100
and you now create a Texture with size = 50x50 and position = 75,75
The Texture will perfectly fit the hole screen.
The position of camera is in the center. So the position of Texture is 75,75 and not 100,100
When you now will move your camera, you can use the method: translate() of your camera.
Call: camera.translate(25,0) to move your camera 25 units to the right and now you only see the half of your Texture on the left side of the screen.
This is an easy example of a Moveable camera. You can use the arrow keys to move around:
public class WorldSimGame extends ApplicationAdapter {
private OrthographicCamera camera;
private SpriteBatch batch;
private Texture texture;
public WorldSimGame() { }
#Override
public void create(){
//Create texture, batch and camera
texture = new Texture(Gdx.files.internal("badlogic.jpg"));
batch = new SpriteBatch();
camera = new OrthographicCamera(60,60);
}
#Override
public void render(){
//clear screen
Gdx.gl.glClearColor(1, 0, 0, 1);
Gdx.gl.glClear(GL20.GL_COLOR_BUFFER_BIT);
moveCamera();
//update camera that he recalculate his position and Matrix
camera.update();
batch.setProjectionMatrix(camera.combined); //set batch to draw what the camera sees
batch.begin();
batch.draw(texture,0,0); //draw texture
batch.end();
}
private void moveCamera(){
//move camera
if(Gdx.input.isKeyPressed(Input.Keys.RIGHT)){
camera.translate(4,0);
}
if(Gdx.input.isKeyPressed(Input.Keys.LEFT)){
camera.translate(-4,0);
}
if(Gdx.input.isKeyPressed(Input.Keys.UP)){
camera.translate(0,4);
}
if(Gdx.input.isKeyPressed(Input.Keys.DOWN)){
camera.translate(0,-4);
}
}
}
Im working on my 3D Game with LibGdx.
After looking some other Threads and posts with some realy good tutorials I get the first shader working. My Problem now is to get a Cel/Outline/Toon Shader working.
Therefore I found also a tutorial and a project but they havnt worked.
After reading some posts how to solve this shading Problem (with rendering the Object twice,...) I tried this method but got some sideeffects.
Actually I got as result a darfred rendering Scene.
My Question is now, If my Models just need some other Material or why I get these results.
I wrote a cel shader based on the KBAL tutorial that results in renderings like the one above. I've been meaning to write up something on it since the library has changed a lot since then. It seems like you got stuck on the depth shader, which is one of the parts from the original tutorial that needed the most updating.
Besides compatibility updates, I removed one render pass by modifying the uber shader that comes with LibGDX to perform the discretization in the KBAL tutorial's toonify() function during the initial rendering of geometry rather than in a post pass. Aside from that it follows the same pattern.
The code below is a bare bones implementation of my cel shader code. The class is derived extends AbstractScreen which implements some base functionality for LibGDX's Screen interface. Read more about Screen's here and see the CelTutorialScreen source within a full project context here.
package com.hh.ghoststory.screen;
import com.badlogic.gdx.Gdx;
import com.badlogic.gdx.assets.AssetManager;
import com.badlogic.gdx.graphics.GL20;
import com.badlogic.gdx.graphics.PerspectiveCamera;
import com.badlogic.gdx.graphics.Pixmap;
import com.badlogic.gdx.graphics.g2d.SpriteBatch;
import com.badlogic.gdx.graphics.g2d.TextureRegion;
import com.badlogic.gdx.graphics.g3d.Environment;
import com.badlogic.gdx.graphics.g3d.Model;
import com.badlogic.gdx.graphics.g3d.ModelBatch;
import com.badlogic.gdx.graphics.g3d.ModelInstance;
import com.badlogic.gdx.graphics.g3d.environment.DirectionalLight;
import com.badlogic.gdx.graphics.glutils.FrameBuffer;
import com.badlogic.gdx.graphics.glutils.ShaderProgram;
import com.badlogic.gdx.math.Matrix4;
import com.badlogic.gdx.utils.Array;
import com.hh.ghoststory.GhostStory;
import com.hh.ghoststory.render.shaders.CelDepthShaderProvider;
import com.hh.ghoststory.render.shaders.CelLineShaderProgram;
public class CelTutorialScreen extends AbstractScreen {
private PerspectiveCamera camera = new PerspectiveCamera(67, Gdx.graphics.getWidth(), Gdx.graphics.getHeight());
private AssetManager assetManager = new AssetManager();
private Array<ModelInstance> instances = new Array<ModelInstance>();
private FrameBuffer fbo;
private TextureRegion textureRegion;
private ShaderProgram lineShader = new CelLineShaderProgram();
private SpriteBatch spriteBatch = new SpriteBatch();
private ModelBatch modelBatch = new ModelBatch(Gdx.files.classpath("com/badlogic/gdx/graphics/g3d/shaders/default.vertex.glsl").readString(), Gdx.files.internal("shaders/cel.main.fragment.glsl").readString());
private ModelBatch depthBatch = new ModelBatch(new CelDepthShaderProvider());
private Environment environment = new Environment();
public CelTutorialScreen(GhostStory game) {
super(game);
Gdx.gl.glClearColor(1.0f, 0.0f, 1.0f, 0.0f);
Gdx.gl.glClear(GL20.GL_DEPTH_BUFFER_BIT | GL20.GL_COLOR_BUFFER_BIT);
// setup camera
camera.position.set(5, 5, 5);
camera.lookAt(0, 0, 0);
camera.near = 1;
camera.far = 1000;
camera.update();
// add a light
environment.add(new DirectionalLight().set(0.8f, 0.8f, 1.8f, -1f, -0.8f, 0.2f));
// load our model
assetManager.load("models/spider.g3dj", Model.class);
loading = true;
}
#Override
public void render(float delta) {
if (loading && assetManager.update())
doneLoading();
camera.update();
Gdx.gl.glClearColor(1.0f, 0.0f, 0.0f, 0.0f);
Gdx.gl.glClear(GL20.GL_DEPTH_BUFFER_BIT | GL20.GL_COLOR_BUFFER_BIT);
// render depth map to fbo
captureDepth();
// draw the scene
renderScene();
// put fbo texture in a TextureRegion and flip it
prepTextureRegion();
// draw the cel outlines
drawOutlines();
}
/*
* Draws the cel outlines using the CelLineShaderProgram
*/
protected void drawOutlines() {
spriteBatch.setShader(lineShader);
lineShader.setUniformf("u_size", Gdx.graphics.getWidth(), Gdx.graphics.getHeight());
spriteBatch.begin();
spriteBatch.draw(textureRegion, 0, 0, Gdx.graphics.getWidth(), Gdx.graphics.getHeight());
spriteBatch.end();
spriteBatch.setShader(null);
}
/*
* Stores fbo texture in a TextureRegion and flips it vertically.
*/
protected void prepTextureRegion() {
textureRegion = new TextureRegion(fbo.getColorBufferTexture());
textureRegion.flip(false, true);
}
/*
* Draws the depth pass to an fbo, using a ModelBatch created with CelDepthShaderProvider()
*/
protected void captureDepth() {
fbo.begin();
Gdx.gl.glClearColor(1.0f, 1.0f, 1.0f, 0.0f);
Gdx.gl.glClear(GL20.GL_DEPTH_BUFFER_BIT | GL20.GL_COLOR_BUFFER_BIT);
depthBatch.begin(camera);
depthBatch.render(instances);
depthBatch.end();
fbo.end();
}
/*
* Renders the scene.
*/
protected void renderScene() {
Gdx.gl.glClear(GL20.GL_DEPTH_BUFFER_BIT | GL20.GL_COLOR_BUFFER_BIT);
modelBatch.begin(camera);
modelBatch.render(instances, environment);
modelBatch.end();
}
#Override
protected void doneLoading() {
loading = false;
instances.add(new ModelInstance(assetManager.get("models/spider.g3dj", Model.class)));
}
/*
* Set camera width and height, SpriteBatch projection matrix, and reinit the FBOs
*/
#Override
public void resize(int width, int height) {
camera.position.set(camera.position);
camera.viewportWidth = width;
camera.viewportHeight = height;
camera.update();
if (fbo != null) fbo.dispose();
fbo = new FrameBuffer(Pixmap.Format.RGBA8888, Gdx.graphics.getWidth(), Gdx.graphics.getHeight(), true);
spriteBatch.setProjectionMatrix(new Matrix4().setToOrtho2D(0, 0, width, height));
}
#Override
public void dispose() {
assetManager.dispose();
modelBatch.dispose();
depthBatch.dispose();
spriteBatch.dispose();
fbo.dispose();
lineShader.dispose();
}
}
The render performs 3 passes to create the end product.
The first is contained in the captureDepth() function.
protected void captureDepth() {
fbo.begin();
Gdx.gl.glClearColor(1.0f, 1.0f, 1.0f, 0.0f);
Gdx.gl.glClear(GL20.GL_DEPTH_BUFFER_BIT | GL20.GL_COLOR_BUFFER_BIT);
depthBatch.begin(camera);
depthBatch.render(instances);
depthBatch.end();
fbo.end();
}
A framebuffer is started, glClear is called and then the depthBatch ModelBatch() renders the model instances (only one in this case) before the framebuffer is ended.
The depthBatch is a ModelBatch that uses a CelDepthShaderProvider, which provides a CelDepthShader. CellDepthShaderProvider is a small class that extends BaseShaderProvider and overrides createShader to return an instance of CelDepthShader, which registers and sets u_near and u_far uniforms as well as sets up the use of the cel depth vertex and fragment GLSL shaders.
I'm guessing the GLSL files are where you're running into issues. The vertex shader I linked to is the same as the KBAL vertex shader with the exception of line 125, which removed some artifacts on the cel edges:
v_depth = (pos.z + u_near) / (u_far - u_near);
The fragment shader is very similar to the one in the KBAL tutorial, but is actually copied from LibGDX's built in depth fragment shader. It's quite possible that the current LigGDX DepthShader could be used instead of my CelDepthShader, but I haven't had time to look into this.
After the first pass, the packed depth map has been captured by the FBO. The second pass is ready to be run and will draw the scene with LibGDXs' default vertex shader and a slightly modified version of its fragment shader.
The changes from the default fragment shader are in lines 140-150 where the specular value is discretized before being added to gl_FragColor:
if (specIntensity > 0.6)
specFactor = 1.0;
else if (specIntensity > 0.3)
specFactor = 0.5;
else
specFactor = 0.1;
specular *= specFactor;
And 173-182 where the overall gl_FragColor is discretized:
float intensity = max(gl_FragColor.r, max(gl_FragColor.g, gl_FragColor.b));
float factor;
if (intensity > 0.8)
factor = 1.0;
else if (intensity > 0.5)
factor = 0.8;
else if (intensity > 0.25)
factor = 0.3;
else
factor = 0.1;
And that's it for the main cel pass.
Next in render() the prepTextureRegion() function is called. This just puts the depth texture captured to our fbo into a texture region and flips it vertically before using it to draw the cel outlines in the final pass.
The final pass is performed in drawOutlines() and makes use of a SpriteBatch since we're drawing a 2d texture instead of geometry. The call to spriteBatch.setShader(lineshader) sets the SpriteBatch to use an instance of CelLineShaderProgram, another class that extends ShaderProgram. It sets a u_size uniform and uses cel.line.vertex.glsl and cel.line.fragment.glsl.
This shader program runs the Laplace filter. The vertex shader is copied from the KBAL edge shader and updated to work with newer versions of LibGDX, it passes the sampled coordinate of the depth map as well as its top, bottom, left and right neighboring texels to the fragment shader as varyings.
The fragment shader uses an updated method of unpacking the depth values based on code from the getShadowness() function here as recommended by Xoppa.
There are some improvements to this process that could be made. For one, I haven't implemented the super sampling in the original tutorial.
Also, it's not really noticeable in this still image, but once you have a controllable camera in the scene, or geometry moving around, you'll notice the per pixel lighting looks a little weird, especially with limited polygons in your geometry. There is a per-pixel lighting fragment shader in the LibGDX shadow system tests that could be used as a base to implement this with cel shading. The shadow systems might even be a good base to create a multi-pass rendering system for cel shading. And there is undoubtedly code that could be removed from the modified base LibGDX shaders I've used, as well as other optimizations and cleanup.
Hope this helps you or anyone else looking for info on multipass cel shading.
If I run this code as it is, I see a line from the bottom left corner of the screen to the top right corner of the screen. However, afaik I set glOrthox and glViewport, so why it's using the default projection is a mystery to me... what's wrong? the lower left of the screen should be 0,0, and 1,1 should be basically 1 pixel over and up into the screen.. not the whole screen.
package com.opengl.hello;
import java.nio.ByteBuffer;
import java.nio.ByteOrder;
import java.nio.FloatBuffer;
import javax.microedition.khronos.egl.EGLConfig;
import javax.microedition.khronos.opengles.GL10;
import android.content.Context;
import android.opengl.GLSurfaceView.Renderer;
public class Renderer2d implements Renderer {
Context mContext;
public static ByteBuffer newByteBuffer(int size)
{ return ByteBuffer.allocateDirect(size).order(ByteOrder.nativeOrder()); }
public static FloatBuffer newFloatBuffer(int size)
{ return newByteBuffer(size * 4).asFloatBuffer(); }
public static ByteBuffer newByteBuffer(byte[] buf)
{ ByteBuffer out=newByteBuffer(buf.length); out.put(buf).position(0); return out; }
public static FloatBuffer newFloatBuffer(float[] buf)
{ FloatBuffer out=newFloatBuffer(buf.length); out.put(buf).position(0); return out; }
public Renderer2d(Context context)
{
mContext=context;
}
int mWidth;
int mHeight;
#Override
public void onDrawFrame(GL10 gl) {
gl.glViewport(0, 0, mWidth, mHeight);
// Reset projection
gl.glMatrixMode(GL10.GL_PROJECTION);
gl.glLoadIdentity();
// Set up our ortho view
gl.glOrthox(0, mWidth, 0, mHeight, 0, 0);
// Reset model view
gl.glMatrixMode(GL10.GL_MODELVIEW);
gl.glLoadIdentity();
gl.glClear(GL10.GL_COLOR_BUFFER_BIT);
// Build buffers sufficient to draw a single
ByteBuffer indicesBuffer=newByteBuffer(new byte[] { 0, 1 });
// PROBLEM: I expect this to draw a small line, from the bottom left to 1,1 (a single pixel over and up into the image)..
// as well as sticking off-screen down and to the left. Instead, this covers the entire screen, corner to corner!
FloatBuffer vertexBuffer=newFloatBuffer(new float[]{ -1.f, -1.f, 1.f, 1.f });
// Enable vertex arrays, as we're about to use them
gl.glEnableClientState(GL10.GL_VERTEX_ARRAY);
// Each point in the vertex buffer has two dimensions.
gl.glVertexPointer(2, GL10.GL_FLOAT, 0, vertexBuffer);
// Draw one point
gl.glDrawElements(GL10.GL_LINES, 2, GL10.GL_UNSIGNED_BYTE, indicesBuffer);
// No longer need vertex arrays
gl.glDisableClientState(GL10.GL_VERTEX_ARRAY);
}
/**
* If the surface changes, reset the view.
*/
#Override
public void onSurfaceChanged(GL10 gl, int width, int height)
{
mWidth=width;
mHeight=height;
// Moved code to onDrawFrame just to group everything together
}
/**
* The Surface is created/init()
*/
#Override
public void onSurfaceCreated(GL10 gl, EGLConfig config) {
// Yellow Background
gl.glClearColor(1.0f, 1.0f, 0.0f, 0.0f);
// Disable dithering for better performance
gl.glDisable(GL10.GL_DITHER);
// enable texture mapping
gl.glEnable(GL10.GL_TEXTURE_2D);
//enable transparency blending
gl.glEnable(GL10.GL_BLEND);
// use opaque texturing
gl.glBlendFunc(GL10.GL_ONE, GL10.GL_SRC_COLOR);
// Disable the depth buffer, we're drawing in 2D.
gl.glDisable(GL10.GL_DEPTH_TEST);
// Smooth shading
gl.glShadeModel(GL10.GL_SMOOTH);
// Really Nice Perspective Calculations
gl.glHint(GL10.GL_PERSPECTIVE_CORRECTION_HINT, GL10.GL_NICEST);
}
}
gl.glPointSize(150);
I suspect that 150 is far greater than the upper ends of GL_ALIASED_POINT_SIZE_RANGE and GL_SMOOTH_POINT_SIZE_RANGE. Try something smaller like 1 or 2.