Page 4 of 6

Re: Questions about ES2/GL3 shaders

Posted: Tue Jun 08, 2021 9:03 am
by Ats
Sorry, I didn't see that you uploaded the changes to GitHub. I'm on it!

Edit: All right, everything's fine on Android. I manually tried libGLESv1_CM.so and then libGLESv2.so

Here's the new libzgeandroid.so
Maybe I could directly make a PR on gihtub with the new lib next time?

Re: Questions about ES2/GL3 shaders

Posted: Tue Jun 08, 2021 9:36 am
by VilleK
Thanks. I now also committed a fix for the ANDROID constant.

Re: Questions about ES2/GL3 shaders

Posted: Tue Jun 08, 2021 3:18 pm
by Ats
All right, it's perfect now. Just one very little detail, here's the repro:
  • Put nothing (or libGLESv1_CM.so) in ZExternalLibrary.ModuleName and ZExternalLibrary.BeforeInitExp needs to have the automatic detection code:
    ModuleName01.png
    ModuleName01.png (8 KiB) Viewed 13803 times
  • Run the app in preview mode
  • ZExternalLibrary.ModuleName is now opengl32, but in the project tree, the name isn't updated:
    ModuleName02.png
    ModuleName02.png (7.72 KiB) Viewed 13803 times
It's not a breaking problem, but it's a bit weird when ZExternalLibrary isn't selected, and I was wondering how it was able to work since it wasn't updates to opengl32 :wink:

Re: Questions about ES2/GL3 shaders

Posted: Wed Jun 16, 2021 10:13 am
by Ats
I'm back at discovering shaders. I managed to make the vertex color one:

Code: Select all

#ifdef GL_ES
  precision mediump float;
#endif

uniform mat4 modelViewProjectionMatrix;
attribute vec3 position; // vertex position
attribute vec3 color;    // vertex color

varying vec4 v_Color;

void main()
{
  v_Color = vec4(color, 1.0);
  gl_Position = modelViewProjectionMatrix * vec4(position, 1.0);
}

Code: Select all

#ifdef GL_ES
  precision mediump float;
#endif

varying vec4 v_Color;

void main()
{
    gl_FragColor = v_Color;
}
By the way, is " #ifdef GL_ES precision mediump float; #endif " mandatory in both, or at all?

Edit:
I just realized that position and color are vec4 in the ZGameEditor Help... :roll: :?: :?: :?:
So maybe that is better?? But it's not working on Android, while the previous vec3 one is... ???

Code: Select all

#ifdef GL_ES
  precision mediump float;
#endif

uniform mat4 modelViewProjectionMatrix;
attribute vec4 position; // vertex position
attribute vec4 color;    // vertex color

varying vec4 v_Color;

void main()
{
  v_Color = color;
  gl_Position = modelViewProjectionMatrix * position;
}
Looks like I'm not the only one who is perplexed: https://stackoverflow.com/questions/189 ... c4-or-vec3
"I suppose this is why most tutorials never touch on this topic."


--

I'm also struggling to convert Kjell phong light shader to ES2/GL3. I made something that seems to work, but it's not taking account material colors, and gives different results on preview, build and android :lol:

Here's the Vertex Shader from compatible:

Code: Select all

varying vec3 N;
varying vec3 v;

void main(void)
{
   v = vec3(gl_ModelViewMatrix * gl_Vertex);
   N = normalize(gl_NormalMatrix * gl_Normal);
   gl_Position = gl_ModelViewProjectionMatrix * gl_Vertex;
   gl_FrontColor = gl_Color;
}
to ES2/GL3:

Code: Select all

#ifdef GL_ES
  precision mediump float;
#endif

uniform mat4 modelViewMatrix;
uniform mat4 modelViewProjectionMatrix;
uniform mat3 normalMatrix;

attribute vec3 position; // vertex position
attribute vec3 normal;   // vertex normal

varying vec3 N;
varying vec3 v;

void main(void)
{
  v = vec3(modelViewMatrix * vec4(position, 1.0));
  N = normalize(normalMatrix * normal);
  gl_Position = modelViewProjectionMatrix * vec4(position, 1.0);
  gl_FrontColor = gl_Color;
}
But I don't see what to change in the Fragment Shader:

Code: Select all

//

varying vec3 N;
varying vec3 v;

void main (void)
{
   vec3 L = normalize(gl_LightSource[0].position.xyz - v);
   vec3 E = normalize(-v); // we are in Eye Coordinates, so EyePos is (0,0,0)
   vec3 R = normalize(-reflect(L,N));

   //calculate Ambient Term:
   vec4 Iamb = gl_FrontLightProduct[0].ambient;

   //calculate Diffuse Term:
   vec4 Idiff = gl_Color * gl_FrontLightProduct[0].diffuse * max(dot(N,L), 0.0);
   Idiff = clamp(Idiff, 0.0, 1.0);

   // calculate Specular Term:
   vec4 Ispec = gl_FrontLightProduct[0].specular
                * pow(max(dot(R,E),0.0),0.3*gl_FrontMaterial.shininess);
   Ispec = clamp(Ispec, 0.0, 1.0);

   // write Total Color:
   gl_FragColor = gl_FrontLightModelProduct.sceneColor + Iamb + Idiff + Ispec;
}

Re: Questions about ES2/GL3 shaders

Posted: Wed Jun 16, 2021 1:24 pm
by Kjell
Hi Ats,
Ats wrote: Wed Jun 16, 2021 10:13 amBy the way, is " #ifdef GL_ES precision mediump float; #endif " mandatory in both, or at all?
It's not required, but by default floats are set to precision highp and not every mobile GPU supports that. And i guess if your shader doesn't define any floating-point variables, it's not needed either ( but that's probably pretty rare ).
Ats wrote: Wed Jun 16, 2021 10:13 amI just realized that position and color are vec4 in the ZGameEditor Help... :roll: :?: :?: :?:
So maybe that is better?? But it's not working on Android, while the previous vec3 one is... ???
It should work. Did you only change "attribute vec3 color" into vec4? Because then the "vec4(color, 1.0);" line is incorrect.
Ats wrote: Wed Jun 16, 2021 10:13 amLooks like I'm not the only one who is perplexed: https://stackoverflow.com/questions/189 ... c4-or-vec3
It's entirely up to the engine creator to decide that. It doesn't really matter though.
Ats wrote: Wed Jun 16, 2021 10:13 amI'm also struggling to convert Kjell phong light shader to ES2/GL3. I made something that seems to work, but it's not taking account material colors, and gives different results on preview, build and android :lol:
You can't use gl_FrontColor in ES2/GL3. Keep in mind that on desktop GL3 has backwards-compatibility, so if you accidentally use deprecated features they still work.
Ats wrote: Wed Jun 16, 2021 10:13 amBut I don't see what to change in the Fragment Shader:
You need to get rid of everything that uses a "gl_" prefix aside from gl_FragColor. Unfortunately ZGE doesn't pass any light values to your shader automatically, so you need to do that yourself using ShaderVariable components.

K

Re: Questions about ES2/GL3 shaders

Posted: Wed Jun 16, 2021 2:16 pm
by Ats
Thanks for the explanations :wink:
It should work. Did you only change "attribute vec3 color" into vec4? Because then the "vec4(color, 1.0);" line is incorrect.
I just verified again:

Code: Select all

uniform mat4 modelViewProjectionMatrix;
attribute vec3 position, color;
varying vec4 v_Color;

void main()
{
  v_Color = vec4(color, 1.0);
  gl_Position = modelViewProjectionMatrix * vec4(position, 1.0);
}
is working on PC and Android:
Screenshot_20210616-160451.png
Screenshot_20210616-160451.png (60.01 KiB) Viewed 13684 times

Code: Select all

//
uniform mat4 modelViewProjectionMatrix;
attribute vec4 position, color;
varying vec4 v_Color;

void main()
{
  v_Color = color;
  gl_Position = modelViewProjectionMatrix * position;
}
is working on PC but not on Android:
Screenshot_20210616-160348.png
Screenshot_20210616-160348.png (51.32 KiB) Viewed 13684 times


Edit:
Got it!!!
The problem was coming from meshes vertex color alpha not set to "C.A = 1;", again... :|
VilleK, since the results on Android are never the same as on computer because of this, why isn't it already set like this in the source code of ZGE instead of having to manually configure it every time in all projects?

Re: Questions about ES2/GL3 shaders

Posted: Wed Jun 16, 2021 3:44 pm
by Ats
Also, the updated beta with inheritance in classes broke the BitmapCell:
Capture d’écran (251).png
Capture d’écran (251).png (46.74 KiB) Viewed 13677 times
Unless the new beta is a fork from before the merge between Classes and the other fixes?

Re: Questions about ES2/GL3 shaders

Posted: Thu Jun 17, 2021 8:23 am
by VilleK
Ats wrote: Wed Jun 16, 2021 3:44 pm Unless the new beta is a fork from before the merge between Classes and the other fixes?
It is a fork but should still work. I found the problem with bitmapcells and will fix it.

About the missing alpha in vertex colors, I could initialize this to 1.0 but I also want to understand why this is not needed on desktop. @Kjell: Do you have any theory?

Re: Questions about ES2/GL3 shaders

Posted: Thu Jun 17, 2021 8:40 am
by Kjell
Hi Ville,
VilleK wrote: Thu Jun 17, 2021 8:23 amAbout the missing alpha in vertex colors, I could initialize this to 1.0 but I also want to understand why this is not needed on desktop.
I'm not entirely sure, but i suspect that a Android Activity has a white background by default and any pixel of your front-buffer that isn't fully opaque automatically gets "blended" with that background color ( just like WebGL ). On desktop this behavior doesn't happen by default. Could be something else though ..

K

Re: Questions about ES2/GL3 shaders

Posted: Thu Jun 17, 2021 9:57 pm
by Ats
So I'm discovering the shader UniformVariables to remove the gl_ things, and I have a little question, just to be sure:

gl_FrontLightModelProduct.sceneColor is the ambient colour of the scene, so App.AmbientLightColor

But what about those three?
gl_FrontLightProduct[0].ambient
gl_FrontLightProduct[0].diffuse
gl_FrontLightProduct[0].specular

Are they the material Color, SpecularColor and EmissionColor?

Re: Questions about ES2/GL3 shaders

Posted: Fri Jun 18, 2021 4:52 am
by Kjell
Hi Ats,

All of those built-in variables are actually pre-calculated using various parameters by the OpenGL driver.

gl_FrontLightModelProduct = Material.EmissionColor + Material.AmbientColor * App.AmbientLightColor
gl_FrontLightProduct[0].ambient = Material.AmbientColor * Light0.AmbientColor
gl_FrontLightProduct[0].diffuse = Material.Color * Light0.Color
gl_FrontLightProduct[0].specular = Material.SpecularColor * Light0.SpecularColor

However, the Material / Light components in ZGE don't have properties for all of these values ( i marked those red ) .. so unless you're using OpenGL calls to set them ( which you can't in ES2/GL3 because all of this has been removed ) these values are always their default.

K

Re: Questions about ES2/GL3 shaders

Posted: Fri Jun 18, 2021 9:34 am
by Ats
Ok... But how does compatible works then if those values doesn't exist in ZGE? If they have default values, then I shouldn't be worried not using them in the ES2/GL3 shader, right? (not sure)

Anyway, I'm already struggling to pass the App.AmbientLightColor to the shader in a simple test... It should be the color of the "sun" but everything is black instead. Am I doing something wrong?

Code: Select all

<Shader Name="LightAmbiantShader">
<VertexShaderSource>
<![CDATA[//
uniform mat4 modelViewProjectionMatrix;

attribute vec4 position, color; // vertex position

void main(void)
{
  gl_Position = modelViewProjectionMatrix * position;
}]]>
</VertexShaderSource>
<FragmentShaderSource>
<![CDATA[//
uniform vec4 lightAmbientColor;

void main (void)
{
   gl_FragColor = lightAmbientColor;
}]]>
</FragmentShaderSource>
<UniformVariables>
<ShaderVariable VariableName="lightAmbientColor" ValuePropRef="App.AmbientLightColor"/>
</UniformVariables>
</Shader>

Re: Questions about ES2/GL3 shaders

Posted: Fri Jun 18, 2021 10:55 am
by Kjell
Hi Ats,
Ats wrote: Fri Jun 18, 2021 9:34 amBut how does compatible works then if those values doesn't exist in ZGE?
Just because ZGE doesn't use certain OpenGL features that doesn't mean they don't exist. OpenGL is basically a state machine.
Ats wrote: Fri Jun 18, 2021 9:34 amIf they have default values, then I shouldn't be worried not using them in the ES2/GL3 shader, right?
Most of the built-in light & material features were removed in ES2/GL3 .. and non-existing variables can't have a default value obviously.
Ats wrote: Fri Jun 18, 2021 9:34 amAnyway, I'm already struggling to pass the App.AmbientLightColor to the shader in a simple test... It should be the color of the "sun" but everything is black instead. Am I doing something wrong?
The ShaderVariable component is pretty limited and a bit confusing. You can only use individual floats ( no vec2/3/4 or mat4 ) or arrays. For your specific situation / shader i'd just use a array of mat4 and transfer all the variables that way. For example:

Code: Select all

<?xml version="1.0" encoding="iso-8859-1" ?>
<ZApplication Name="App" Caption="ZGameEditor application" AmbientLightColor="1 0.5 0.25 1" FileVersion="2">
  <OnRender>
    <ZExpression>
      <Expression>
<![CDATA[//

DemoData[0][0,0] = App.AmbientLightColor.R;
DemoData[0][0,1] = App.AmbientLightColor.G;
DemoData[0][0,2] = App.AmbientLightColor.B;]]>
      </Expression>
    </ZExpression>
    <UseMaterial Material="DemoMaterial"/>
    <RenderNet/>
  </OnRender>
  <Content>
    <Array Name="DemoData" Type="5" SizeDim1="1"/>
    <Shader Name="DemoShader">
      <VertexShaderSource>
<![CDATA[//

void main()
{
  gl_Position = gl_Vertex;
}]]>
      </VertexShaderSource>
      <FragmentShaderSource>
<![CDATA[//

uniform mat4 data;

void main()
{
  gl_FragColor = vec4(data[0][0], data[0][1], data[0][2], 1.0);
}]]>
      </FragmentShaderSource>
      <UniformVariables>
        <ShaderVariable VariableName="data" ValueArrayRef="DemoData" ArrayKind="1"/>
      </UniformVariables>
    </Shader>
    <Material Name="DemoMaterial" Shading="1" Light="0" ZBuffer="0" Shader="DemoShader"/>
  </Content>
</ZApplication>
K

Re: Questions about ES2/GL3 shaders

Posted: Fri Jun 18, 2021 3:01 pm
by Ats
Hahaha each time you help me, everything is multiplied per 3 :lol:
So what if I render several materials at the same time. Would it be better to have an array per shader, or reuse the same array before rendering each material?

Re: Questions about ES2/GL3 shaders

Posted: Fri Jun 18, 2021 3:29 pm
by Kjell
Hi Ats,
Ats wrote: Fri Jun 18, 2021 3:01 pmSo what if I render several materials at the same time. Would it be better to have an array per shader, or reuse the same array before rendering each material?
That's difficult to answer. It really depends on a bunch of factors .. but in general it's probably most convenient to just reuse the same array.

K