写了一个opengles2.0的小效果,平台是安卓,给各位朋友们看一看,有兴趣想要源码的朋友可以email我 5358951@qq.com。
先看效果
前言
1、在安卓上实用opengles进行开发,大家可以参考android官网的例子,在例子里面大家可以通过github上下载,稍后我会把官网的例子放到github上;
2、这里特地说明下,完成这个效果需要对opengles2.0基础只有个简单的了解;
开干
1、算法,要想实现翻页的效果,必需对翻页建立一个数学模型,然后在shader里面去实现,那么最关键的就是模型什么。
如果一页纸,我们用收去翻它,其实这也纸,已经被粗略的分成了三个部分
(1)、未被翻起的部分A;
(2)、被翻起的部分C;
(3)、 翻起的部分和未被翻起的连接部分(即发生了弧形形变部分)B;
随着页面的翻转A先变化成B最后变换成C,那么手移动的距离就是影响这个这个效果进展到什么成都,因此我把手移动的相关的参数定义为S;
上面的模型实际上得出了一个依赖关系。也就是S的变化会改变A,B,C中各个三角形顶点的坐标。
2、如何生成3d模型参见 http://blog.csdn.net/yellow_beard/article/details/77721002
3、实现
(1)、主要针对shader进行编码,
直接上源码,
String vShaderStr = "uniform mat4 u_mvMatrix; \n"
+ "uniform mat4 u_pMatrix; \n"
+ "const mediump float r = 80.0; \n"
+ "uniform float f; \n"
+ "attribute vec4 a_position; \n"
+ "attribute vec2 a_texCoord; \n"
+ "varying vec2 v_texCoord; \n"
+ "void main() \n"
+ "{ \n"
+ " \n"
+ " \n"
+ " mediump vec4 v = u_mvMatrix * a_position ; \n"
+ " mediump vec2 pd = vec2(0.8660,-0.5000); \n"
+ " mediump vec2 vpmax = vec2(230.0,-400.0); \n"
+ " mediump float vpmaxf = dot(pd, vpmax); \n"
+ " mediump float vp = dot(pd, v.xy); \n"
+ " if (vp < f + vpmaxf) { \n"
+ " } else if (vp < f+ vpmaxf +r*3.1416) { \n"
+ " mediump float a = (vp-f-vpmaxf)/(r)-1.5708; \n"
+ " v.xyz += vec3((f+vpmaxf+r*cos(a)-vp)*pd, r+r*sin(a)); \n"
+ " } else { \n"
+ " v.xyz += vec3((2.0*(f+ vpmaxf -vp)+3.1416*(r))*pd, 2.0*r); \n"
+ " } \n"
+ " \n"
+ " gl_Position = u_pMatrix * v ; \n"
+ " v_texCoord = a_texCoord; \n"
+ " \n"
+ "} \n";
String fShaderStr = "precision mediump float; \n"
+ "varying vec2 v_texCoord; \n"
+ "uniform sampler2D s_baseMap; \n"
// + "uniform sampler2D s_lightMap; \n"
+ "void main() \n"
+ "{ \n"
+ " vec4 baseColor; \n"
+ " vec4 lightColor; \n"
+ " \n"
+ " gl_FragColor = texture2D( s_baseMap, v_texCoord ); \n"
// + " lightColor = texture2D( s_lightMap, v_texCoord ); \n"
// + " gl_FragColor = baseColor * (lightColor + 0.25); \n"
+ "} \n";
mediump vec4 v = u_mvMatrix * a_position ; \n"
+ " mediump vec2 pd = vec2(0.8660,-0.5000); \n"
+ " mediump vec2 vpmax = vec2(230.0,-400.0); \n"
+ " mediump float vpmaxf = dot(pd, vpmax); \n"
+ " mediump float vp = dot(pd, v.xy); \n"
+ " if (vp < f + vpmaxf) { \n"
+ " } else if (vp < f+ vpmaxf +r*3.1416) { \n"
+ " mediump float a = (vp-f-vpmaxf)/(r)-1.5708; \n"
+ " v.xyz += vec3((f+vpmaxf+r*cos(a)-vp)*pd, r+r*sin(a)); \n"
+ " } else { \n"
+ " v.xyz += vec3((2.0*(f+ vpmaxf -vp)+3.1416*(r))*pd, 2.0*r); \n"
+ " } \n"
+ " \n"
+ " gl_Position = u_pMatrix * v ; \n"
+ " v_texCoord = a_texCoord; \n"
+ " \n"
+ "} \n";
String fShaderStr = "precision mediump float; \n"
+ "varying vec2 v_texCoord; \n"
+ "uniform sampler2D s_baseMap; \n"
// + "uniform sampler2D s_lightMap; \n"
+ "void main() \n"
+ "{ \n"
+ " vec4 baseColor; \n"
+ " vec4 lightColor; \n"
+ " \n"
+ " gl_FragColor = texture2D( s_baseMap, v_texCoord ); \n"
// + " lightColor = texture2D( s_lightMap, v_texCoord ); \n"
// + " gl_FragColor = baseColor * (lightColor + 0.25); \n"
+ "} \n";
上面仅供大家学习用。