• Announcements

    • khawk

      Download the Game Design and Indie Game Marketing Freebook   07/19/17

      GameDev.net and CRC Press have teamed up to bring a free ebook of content curated from top titles published by CRC Press. The freebook, Practices of Game Design & Indie Game Marketing, includes chapters from The Art of Game Design: A Book of Lenses, A Practical Guide to Indie Game Marketing, and An Architectural Approach to Level Design. The GameDev.net FreeBook is relevant to game designers, developers, and those interested in learning more about the challenges in game development. We know game development can be a tough discipline and business, so we picked several chapters from CRC Press titles that we thought would be of interest to you, the GameDev.net audience, in your journey to design, develop, and market your next game. The free ebook is available through CRC Press by clicking here. The Curated Books The Art of Game Design: A Book of Lenses, Second Edition, by Jesse Schell Presents 100+ sets of questions, or different lenses, for viewing a game’s design, encompassing diverse fields such as psychology, architecture, music, film, software engineering, theme park design, mathematics, anthropology, and more. Written by one of the world's top game designers, this book describes the deepest and most fundamental principles of game design, demonstrating how tactics used in board, card, and athletic games also work in video games. It provides practical instruction on creating world-class games that will be played again and again. View it here. A Practical Guide to Indie Game Marketing, by Joel Dreskin Marketing is an essential but too frequently overlooked or minimized component of the release plan for indie games. A Practical Guide to Indie Game Marketing provides you with the tools needed to build visibility and sell your indie games. With special focus on those developers with small budgets and limited staff and resources, this book is packed with tangible recommendations and techniques that you can put to use immediately. As a seasoned professional of the indie game arena, author Joel Dreskin gives you insight into practical, real-world experiences of marketing numerous successful games and also provides stories of the failures. View it here. An Architectural Approach to Level Design This is one of the first books to integrate architectural and spatial design theory with the field of level design. The book presents architectural techniques and theories for level designers to use in their own work. It connects architecture and level design in different ways that address the practical elements of how designers construct space and the experiential elements of how and why humans interact with this space. Throughout the text, readers learn skills for spatial layout, evoking emotion through gamespaces, and creating better levels through architectural theory. View it here. Learn more and download the ebook by clicking here. Did you know? GameDev.net and CRC Press also recently teamed up to bring GDNet+ Members up to a 20% discount on all CRC Press books. Learn more about this and other benefits here.
Sign in to follow this  
Followers 0
FuraProject

GL ES 2.0 Color, Transparency and my custom animations

9 posts in this topic

Good evening,

 

Recently i moved to GL ES 2.0 from "immediate mode" and things here, are rather different...

 

I can't find a fast way to access glColor4f

I used to do my custom animations, where i do it on "draw triangle" level. Now the problem is transparency and coloring, because i have to access it via shader, so i can't for example do fast fade in and fade outs with white screen.

 

Maybe someone has any tips for that, or i have to go into textures?

 

Thanks in advance

0

Share this post


Link to post
Share on other sites

Afternoon 

 

 

I finally got to the part where i want to polish my graphical aesthetics, but i am kind of struggling to understand these two functions you have posted. Mainly with "when i have to call it?".

 

I immediate mode what i used to do was simply

 

glColor4f(1, 1, 1, FadeControl.GetFadeTransparency()); each time i was rendering stuff out.

 

I use this code, to draw quad each time

        private void drawQuad()
	{
		mCubePositions.position(0);		
        GLES20.glVertexAttribPointer(mPositionHandle, mPositionDataSize, GLES20.GL_FLOAT, false,
        		0, mCubePositions); 
        
        GLES20.glEnableVertexAttribArray(mPositionHandle);
        
        mCubeColors.position(0);
        GLES20.glVertexAttribPointer(mColorHandle, mColorDataSize, GLES20.GL_FLOAT, false,
        		0, mCubeColors);
        
        GLES20.glEnableVertexAttribArray(mColorHandle);
        
        //GLES20.glVertexAttrib4f(mColorHandle, 0.1f, 0.1f, 0.1f, 0.1f); //glVertexAttrib4f(v):
        
        mCubeTextureCoordinates.position(0);
        GLES20.glVertexAttribPointer(mTextureCoordinateHandle, mTextureCoordinateDataSize, GLES20.GL_FLOAT, false, 
        		0, mCubeTextureCoordinates);
        
        GLES20.glEnableVertexAttribArray(mTextureCoordinateHandle);
        
        Matrix.multiplyMM(mMVPMatrix, 0, mViewMatrix, 0, MC.getMatrix(), 0);
        
        Matrix.multiplyMM(mMVPMatrix, 0, mProjectionMatrix, 0, mMVPMatrix, 0);
        
        GLES20.glUniformMatrix4fv(mMVPMatrixHandle, 1, false, mMVPMatrix, 0);
        
        GLES20.glDrawArrays(GLES20.GL_TRIANGLES, 0, 6);   
	}

Where 

mColorHandle is GLES20.glGetAttribLocation(programHandle, "a_Color")

 

And this to create quad itself

        private FloatBuffer mCubePositions;
	private FloatBuffer mCubeColors;
	private FloatBuffer mCubeTextureCoordinates;
	private void createQuad()
	{
		float[] cubePositionData =
			{
				0, 0, 0,
				1, 0, 0,
				1, 1, 0,
				0, 0, 0,
				0, 1, 0,
				1, 1, 0
			};
		
		float[] cubeTextureCoordinateData =
			{		
				0, 0,
				0, 1,
				1, 1,
				0, 0,
				1, 0,
				1, 1
			};
		
		float[] cubeColorData =
			{				
				1.0f, 1.0f, 1.0f, 1.0f,				
				1.0f, 1.0f, 1.0f, 1.0f,
				1.0f, 1.0f, 1.0f, 1.0f,
				1.0f, 1.0f, 1.0f, 1.0f,				
				1.0f, 1.0f, 1.0f, 1.0f,
				1.0f, 1.0f, 1.0f, 1.0f
			};
		
		mCubePositions = ByteBuffer.allocateDirect(cubePositionData.length * mBytesPerFloat)
			.order(ByteOrder.nativeOrder()).asFloatBuffer();							
			mCubePositions.put(cubePositionData).position(0);
		
		mCubeColors = ByteBuffer.allocateDirect(cubeColorData.length * mBytesPerFloat)
			.order(ByteOrder.nativeOrder()).asFloatBuffer();							
			mCubeColors.put(cubeColorData).position(0);
		
		mCubeTextureCoordinates = ByteBuffer.allocateDirect(cubeTextureCoordinateData.length * mBytesPerFloat)
			.order(ByteOrder.nativeOrder()).asFloatBuffer();
			mCubeTextureCoordinates.put(cubeTextureCoordinateData).position(0);
	}
Edited by Sollum
0

Share this post


Link to post
Share on other sites

This is how I do it. 

//----------------------------

 

//==================================================================================_GLOBAL_VARIABLES

GLfloat rubber_COLOR[] = { 1.0, 1.0, 1.0, 1.0};

GLuint   UNIFORM_rubber_COLOR; 

//==================================================================================_GLOBAL_VARIABLES

 

//==================================================================================_INIT

  rubber_SHADER_FRAGMENT = glCreateShader(GL_FRAGMENT_SHADER);  

  glShaderSource(rubber_SHADER_FRAGMENT, 1, &fragmentSource_rubber, NULL);     glCompileShader(rubber_SHADER_FRAGMENT);       //------------------------------------------------     glAttachShader(rubber_SHADER, rubber_SHADER_VERTEX);     glAttachShader(rubber_SHADER, rubber_SHADER_FRAGMENT);     //------------------------------------------------     glBindAttribLocation(rubber_SHADER,   0, "position");     glBindAttribLocation(rubber_SHADER,   1, "normal");       glBindAttribLocation(rubber_SHADER,   2, "texture");       //------------------------------------------------     glLinkProgram(rubber_SHADER);

 

  UNIFORM_rubber_COLOR = glGetUniformLocation(rubber_SHADER,   "color"); //This last part 'color' is how you access the variable in the shader

//==================================================================================_INIT_

 

//==================================================================================_FRAGMENT_SHADER

 uniform highp vec4  color;  

 

    void main()       {           gl_FragColor   =  color;         }

//===================================================================================_FRAGMENT_SHADER

 

//===================================================================================_RENDER

rubber_COLOR[3] -= fadeAlpha;

 

glUseProgram(rubber_SHADER);

 

 glUniform4f(UNIFORM_rubber_COLOR,  rubber_COLOR[0], rubber_COLOR[1], rubber_COLOR[2], rubber_COLOR[3]); 

 

//drawCall goes here

//====================================================================================_RENDER

1

Share this post


Link to post
Share on other sites

Could you please explain your code a little bit?

 

What is a "rubber_SHADER"? I am taking a guess it's a vertex shader.

 

In render part, why do you re add "rubber_SHADER" each draw?

By "draw call" you mean "GLES20.glDrawArrays(GLES20.GL_TRIANGLES, 0, 6);"?

 

My fragment shader looks like this

final String fragmentShader =
	"precision mediump float;\n"

	+ "uniform vec3 u_LightPos;\n"
	+ "uniform sampler2D u_Texture;\n"
	+ "uniform vec4 u_Color;\n"

	+ "varying vec4 v_Color;\n"
	+ "varying vec2 v_TexCoordinate;\n"

	+ "void main()\n"
	+ "{\n"
	+ "    gl_FragColor = u_Color * (v_Color * texture2D(u_Texture, v_TexCoordinate));\n"
	+ "}\n";

And if i try

int i_test = GLES20.glGetUniformLocation(fragmentShaderHandle, "u_Color");

i get -1

 

By the way, actual version does not use

+ " gl_FragColor = u_Color * (v_Color * texture2D(u_Texture, v_TexCoordinate));\n"

but

+ " gl_FragColor = (v_Color * texture2D(u_Texture, v_TexCoordinate));\n"

 

Otherwise screen will go black. since u_Color is all 0's, but i can't access it :(

Edited by Sollum
0

Share this post


Link to post
Share on other sites

rubber is this particular shader's name, you didn't say what your shader's name is, so I used rubber.  For instance, rubber_SHADER, iron_SHADER, velvet_SHADER.  It's both a vertex shader and a fragment shader.  The reason I put the "glUseProgram(rubber_SHADER); " in the render loop is because if you have more than one shader, you have to activate the shader that you currently want to use.

 

And 'yes' by draw call I mean -> "GLES20.glDrawArrays(GLES20.GL_TRIANGLES, 0, 6);"

//=================================================================================

This following part looks wrong to me. int i_test = GLES20.glGetUniformLocation(fragmentShaderHandle, "u_Color"); It looks like you are trying to make the u_Color a uniform specifically for the fragment shader. The way I set things up, all uniforms are available to both the vertex and fragment programs.  To my knowledge, GLSL doesn't make this distinction although Cg does and I assume HLSL does as well.  I suppose it's possible but I've never encountered this so far.  I would try int i_test = GLES20.glGetUniformLocation(ShaderHandle, "u_Color"); instead, but if the uniform is failing in the shader, this test will fail as well I suspect.  Without your full shader initialization code I can't even guess at where the error is coming from.  All I can say is that u_Color is not being initialized properly.

1

Share this post


Link to post
Share on other sites

Ahhh, yes, sorry, forgot to post shader code, my bad. I'll post entire shader code with initialization, some assigned handles are not working, because they do not exist, but they aint that critical. I'll admit that shader initialization code is glued from many sources, so i might not be entirely sure whats going on in there. In any case, ill try to fix it by myself tomorrow after work, because i am dead tired already >.>

	final String vertexShader =
		"uniform mat4 u_MVPMatrix;\n"
		+ "uniform mat4 u_MVMatrix;\n"
		+ "uniform vec4 u_Color;\n"
				 
		+ "attribute vec4 a_Position;\n"
		+ "attribute vec4 a_Color;\n"
		+ "attribute vec3 a_Normal;\n"
		+ "attribute vec2 a_TexCoordinate;\n"
				 
		+ "varying vec3 v_Position;\n"
		+ "varying vec4 v_Color;\n"
		+ "varying vec3 v_Normal;\n"
		+ "varying vec2 v_TexCoordinate;\n"
				 
		+ "void main()\n"
		+ "{\n"
		+ "    v_Position = vec3(u_MVMatrix * a_Position);\n"
		+ "    v_Color = a_Color;\n"
		+ "    v_TexCoordinate = a_TexCoordinate;\n"
		+ "    gl_Position = u_MVPMatrix * a_Position;\n"
		+ "}\n";
			
	final String fragmentShader =
		"precision mediump float;\n"
				
		+ "uniform vec3 u_LightPos;\n"
		+ "uniform sampler2D u_Texture;\n"
		//+ "uniform vec4 u_Color;\n"
				
		//+ "varying vec3 v_Position;\n"
		+ "varying vec4 v_Color;\n"
		//+ "varying vec3 v_Normal;\n"
		+ "varying vec2 v_TexCoordinate;\n"
				
		+ "void main()\n"
		+ "{\n"
		+ "    gl_FragColor = (v_Color * texture2D(u_Texture, v_TexCoordinate));\n"
		+ "}\n";
		
	vertexShaderHandle = GLES20.glCreateShader(GLES20.GL_VERTEX_SHADER);
		
	if (vertexShaderHandle != 0) 
	{
		// Pass in the shader source.
		GLES20.glShaderSource(vertexShaderHandle, vertexShader);

		// Compile the shader.
		GLES20.glCompileShader(vertexShaderHandle);

		// Get the compilation status.
		final int[] compileStatus = new int[1];
		GLES20.glGetShaderiv(vertexShaderHandle, GLES20.GL_COMPILE_STATUS, compileStatus, 0);

		// If the compilation failed, delete the shader.
		if (compileStatus[0] == 0) 
		{				
			GLES20.glDeleteShader(vertexShaderHandle);
			vertexShaderHandle = 0;
		}
	}

	if (vertexShaderHandle == 0)
	{
		throw new RuntimeException("Error creating vertex shader.");
	}
		
	// Load in the fragment shader shader.
	fragmentShaderHandle = GLES20.glCreateShader(GLES20.GL_FRAGMENT_SHADER);

	if (fragmentShaderHandle != 0) 
	{
		// Pass in the shader source.
		GLES20.glShaderSource(fragmentShaderHandle, fragmentShader);

		// Compile the shader.
		GLES20.glCompileShader(fragmentShaderHandle);

		// Get the compilation status.
		final int[] compileStatus = new int[1];
		GLES20.glGetShaderiv(fragmentShaderHandle, GLES20.GL_COMPILE_STATUS, compileStatus, 0);
			
		// If the compilation failed, delete the shader.
		if (compileStatus[0] == 0) 
		{				
			GLES20.glDeleteShader(fragmentShaderHandle);
			fragmentShaderHandle = 0;
		}
	}

	if (fragmentShaderHandle == 0)
	{
		throw new RuntimeException("Error creating fragment shader.");
	}
		
	// Create a program object and store the handle to it.
	programHandle = GLES20.glCreateProgram();
		
	if (programHandle != 0) 
	{
		// Bind the vertex shader to the program.
		GLES20.glAttachShader(programHandle, vertexShaderHandle);			

		// Bind the fragment shader to the program.
		GLES20.glAttachShader(programHandle, fragmentShaderHandle);
			
		// Bind attributes
		GLES20.glBindAttribLocation(programHandle, 0, "a_Position");
		GLES20.glBindAttribLocation(programHandle, 1, "a_Color");
		GLES20.glBindAttribLocation(programHandle, 2, "a_TexCoordinate");
		GLES20.glBindAttribLocation(programHandle, 3, "a_Normal");
			
		// Link the two shaders together into a program.
		GLES20.glLinkProgram(programHandle);

		// Get the link status.
		final int[] linkStatus = new int[1];
		GLES20.glGetProgramiv(programHandle, GLES20.GL_LINK_STATUS, linkStatus, 0);

		// If the link failed, delete the program.
		if (linkStatus[0] == 0) 
		{				
			GLES20.glDeleteProgram(programHandle);
			programHandle = 0;
		}
	}
		
	if (programHandle == 0)
	{
		throw new RuntimeException("Error creating program.");
	}
		
	GLES20.glUseProgram(programHandle);
		
	mMVPMatrixHandle = GLES20.glGetUniformLocation(programHandle, "u_MVPMatrix");
	mMVMatrixHandle = GLES20.glGetUniformLocation(programHandle, "u_MVMatrix"); 
	mLightPosHandle = GLES20.glGetUniformLocation(programHandle, "u_LightPos");
	mTextureUniformHandle = GLES20.glGetUniformLocation(programHandle, "u_Texture");
	mPositionHandle = GLES20.glGetAttribLocation(programHandle, "a_Position");
	mColorHandle = GLES20.glGetAttribLocation(programHandle, "a_Color");
	mNormalHandle = GLES20.glGetAttribLocation(programHandle, "a_Normal"); 
	mTextureCoordinateHandle = GLES20.glGetAttribLocation(programHandle, "a_TexCoordinate");      
        
	GLES20.glUseProgram(programHandle);
Edited by Sollum
0

Share this post


Link to post
Share on other sites

  Alright, let's see if we can get your color uniform up and running.  I'm only going to use code fragments so you can identify proper positioning without me making a big mess here.

 

//===========================================================================_GLOBALS

GLfloat AdjustColor[] = {1.0, 1.0, 1.0, 1.0}; //

 

GLint mMVPMatrixHandle; GLint mMVMatrixHandle; GLint mLightPosHandle;

GLint mAdjustColorUniformHandle;         //<--------Add the shader handle

 

//===========================================================================_SHADER

  final String fragmentShader = "precision mediump float;\n" + "uniform vec3 u_LightPos;\n" + "uniform sampler2D u_Texture;\n"   + "uniform vec4 u_Color ;\n"   //<----make sure to uncomment this again

//...................

 

  + "void main()\n" + "{\n" + " gl_FragColor = u_Color * (v_Color * texture2D(u_Texture, v_TexCoordinate));\n" //<----Then add it back into the formula + "}\n";

 

 

//===========================================================================

  mMVPMatrixHandle = GLES20.glGetUniformLocation(programHandle, "u_MVPMatrix"); mMVMatrixHandle = GLES20.glGetUniformLocation(programHandle, "u_MVMatrix"); mLightPosHandle = GLES20.glGetUniformLocation(programHandle, "u_LightPos"); mTextureUniformHandle = GLES20.glGetUniformLocation(programHandle, "u_Texture");

mAdjustColorUniformHandle = GLES20.glGetUniformLocation(programHandle, "u_Color"); //<----now initialize the color uniform here

mPositionHandle = GLES20.glGetAttribLocation(programHandle, "a_Position"); mColorHandle = GLES20.glGetAttribLocation(programHandle, "a_Color"); mNormalHandle = GLES20.glGetAttribLocation(programHandle, "a_Normal"); mTextureCoordinateHandle = GLES20.glGetAttribLocation(programHandle, "a_TexCoordinate");

 

//===========================================================================_RENDER  

private void drawQuad() {   AdjustColor[3] -= 0.01;  //<----fade transparency

//--------------------------------------------------------

mCubePositions.position(0);   //...   //...   GLES20.glUniformMatrix4fv(mMVPMatrixHandle, 1, false, mMVPMatrix, 0);

 

  GLES20.glUniform4f(mAdjustColorUniformHandleAdjustColor[0], AdjustColor[1], AdjustColor[2], AdjustColor[3]); //<----now update the shader

  GLES20.glDrawArrays(GLES20.GL_TRIANGLES, 0, 6); }

//===========================================================================

 

And also, check to make sure blending is enabled.

1

Share this post


Link to post
Share on other sites

Thanks a lot mate!

 

It finally works!

 

Funny thing, i tried to check first if handle is assigned, without changing gl_FragColor. Handle was always -1. Was stuck about half an hour, still couldn't find the problem, started googling, it appeared that GL SL optimized my code and removed uniform, since i wasnt using it.

0

Share this post


Link to post
Share on other sites

Create an account or sign in to comment

You need to be a member in order to leave a comment

Create an account

Sign up for a new account in our community. It's easy!


Register a new account

Sign in

Already have an account? Sign in here.


Sign In Now
Sign in to follow this  
Followers 0