使jpg图片能够透明的一种方法

来源:互联网 发布:网络团购流程 编辑:程序博客网 时间:2024/05/16 12:07

效果如图(里面的方体):


注意:化学元素围成的圈,后面的透过方体也能看到!!!。

贴图图片:


第一步:shader的编写

顶点着色器:

uniform mat4 uMVPMatrix; //总变换矩阵uniform mat4 uMMatrix; //变换矩阵uniform vec3 uLightLocation;//光源位置uniform vec3 uCamera;//摄像机位置attribute vec3 aPosition;  //顶点位置attribute vec3 aNormal;    //顶点法向量attribute vec2 aTexCoor;    //顶点纹理坐标//用于传递给片元着色器的变量varying vec4 vAmbient;varying vec4 vDiffuse;varying vec4 vSpecular;varying vec2 vTextureCoord;  //定位光光照计算的方法void pointLight(//定位光光照计算的方法  in vec3 normal,//法向量  inout vec4 ambient,//环境光最终强度  inout vec4 diffuse,//散射光最终强度  inout vec4 specular,//镜面光最终强度  in vec3 lightLocation,//光源位置  in vec4 lightAmbient,//环境光强度  in vec4 lightDiffuse,//散射光强度  in vec4 lightSpecular//镜面光强度){  ambient=lightAmbient;//直接得出环境光的最终强度    vec3 normalTarget=aPosition+normal;//计算变换后的法向量  vec3 newNormal=(uMMatrix*vec4(normalTarget,1)).xyz-(uMMatrix*vec4(aPosition,1)).xyz;  newNormal=normalize(newNormal); //对法向量规格化  //计算从表面点到摄像机的向量  vec3 eye= normalize(uCamera-(uMMatrix*vec4(aPosition,1)).xyz);    //计算从表面点到光源位置的向量vp  vec3 vp= normalize(lightLocation-(uMMatrix*vec4(aPosition,1)).xyz);    vp=normalize(vp);//格式化vp  vec3 halfVector=normalize(vp+eye);//求视线与光线的半向量      float shininess=50.0;//粗糙度,越小越光滑  float nDotViewPosition=max(0.0,dot(newNormal,vp)); //求法向量与vp的点积与0的最大值  diffuse=lightDiffuse*nDotViewPosition;//计算散射光的最终强度  float nDotViewHalfVector=dot(newNormal,halfVector);//法线与半向量的点积   float powerFactor=max(0.0,pow(nDotViewHalfVector,shininess)); //镜面反射光强度因子  specular=lightSpecular*powerFactor;    //计算镜面光的最终强度}void main()     {    gl_Position = uMVPMatrix * vec4(aPosition,1); //根据总变换矩阵计算此次绘制此顶点位置        vec4 ambientTemp, diffuseTemp, specularTemp;   //存放环境光、散射光、镜面反射光的临时变量         pointLight(normalize(aNormal),ambientTemp,diffuseTemp,specularTemp,uLightLocation,   vec4(1.0,1.0,1.0,1.0),vec4(1.0,1.0,1.0,1.0),vec4(1.0,1.0,1.0,1.0));      vAmbient=ambientTemp;   vDiffuse=diffuseTemp;   vSpecular=specularTemp;   vTextureCoord = aTexCoor;//将接收的纹理坐标传递给片元着色器}                      

片元着色器:

precision mediump float;uniform sampler2D sTexture;//纹理内容数据//接收从顶点着色器过来的参数varying vec4 vAmbient;varying vec4 vDiffuse;varying vec4 vSpecular;varying vec2 vTextureCoord;void main()                         {       vec4 finalColor=texture2D(sTexture, vTextureCoord);      <span style="color:#cc0000;"> finalColor.a=(finalColor.r+finalColor.g+finalColor.b)/3.0;//核心语句!!!!!!!!!!!</span>   gl_FragColor = finalColor*vAmbient+finalColor*vSpecular+finalColor*vDiffuse;}   


第二步:画方体:

package com.gzdxid.utils;import android.opengl.GLES20;public class DrawCubeTextureLight {private DrawRectTextureLight frontRect = null;private DrawRectTextureLight leftRect = null;private DrawRectTextureLight bottomRect = null;private int flag;private float halfWidth;private float halfHeight;private float halfLength;final float tzz = 0.1f;final float tzs=0.0f;// flag==0:法线朝里;flag==1:法线朝外;public DrawCubeTextureLight(float width,float height,float length,int mProgram, int flag) {frontRect = new DrawRectTextureLight(width, height,mProgram);leftRect=new DrawRectTextureLight(height, length, mProgram);bottomRect=new DrawRectTextureLight(width, length, mProgram);this.flag = flag;this.halfWidth=width/2;this.halfHeight=height/2;this.halfLength=length/2;}// textureId:up-down-left-right-front-backpublic void drawSelf(int[] textureId) {<span style="color:#ff0000;">GLES20.glDisable(GLES20.GL_DEPTH_TEST);//一定要关闭,不然方体后面的元素看不到</span>switch (flag) {case 0:drawCube0(textureId);break;case 1:drawCube1(textureId);break;}<span style="color:#cc0000;">GLES20.glEnable(GLES20.GL_DEPTH_TEST);</span>}private void drawCube0(int[] textureId) {// TODO Auto-generated method stub// upMatrixState.pushMatrix();MatrixState.translate(0, halfHeight - tzz, 0);MatrixState.rotate(90, 1, 0, 0);bottomRect.drawSelf(textureId[0]);MatrixState.popMatrix();// downMatrixState.pushMatrix();MatrixState.translate(0, -halfHeight + tzz, 0);MatrixState.rotate(-90, 1, 0, 0);bottomRect.drawSelf(textureId[1]);MatrixState.popMatrix();// leftMatrixState.pushMatrix();MatrixState.translate(-halfWidth + tzz, 0, 0);MatrixState.rotate(90, 0, 1, 0);leftRect.drawSelf(textureId[2]);MatrixState.popMatrix();// rightMatrixState.pushMatrix();MatrixState.translate(halfWidth - tzz, 0, 0);MatrixState.rotate(-90, 0, 1, 0);leftRect.drawSelf(textureId[3]);MatrixState.popMatrix();// frontMatrixState.pushMatrix();MatrixState.translate(0, 0, halfLength - tzz);MatrixState.rotate(180, 0, 1, 0);frontRect.drawSelf(textureId[4]);MatrixState.popMatrix();// backMatrixState.pushMatrix();MatrixState.translate(0, 0, -halfLength + tzz);frontRect.drawSelf(textureId[5]);MatrixState.popMatrix();}private void drawCube1(int[] textureId) {// upMatrixState.pushMatrix();MatrixState.translate(0, halfHeight - tzs, 0);MatrixState.rotate(-90, 1, 0, 0);bottomRect.drawSelf(textureId[0]);MatrixState.popMatrix();// downMatrixState.pushMatrix();MatrixState.translate(0, -halfHeight + tzs, 0);MatrixState.rotate(90, 1, 0, 0);bottomRect.drawSelf(textureId[1]);MatrixState.popMatrix();// leftMatrixState.pushMatrix();MatrixState.translate(-halfWidth + tzs, 0, 0);MatrixState.rotate(-90, 0, 1, 0);leftRect.drawSelf(textureId[3]);MatrixState.popMatrix();// rightMatrixState.pushMatrix();MatrixState.translate(halfWidth - tzs, 0, 0);MatrixState.rotate(90, 0, 1, 0);leftRect.drawSelf(textureId[2]);MatrixState.popMatrix();// frontMatrixState.pushMatrix();MatrixState.translate(0, 0, halfLength - tzs);frontRect.drawSelf(textureId[4]);MatrixState.popMatrix();// backMatrixState.pushMatrix();MatrixState.translate(0, 0, -halfLength + tzs);MatrixState.rotate(180, 0, 1, 0);frontRect.drawSelf(textureId[5]);MatrixState.popMatrix();}}

补:画平面代码:

package com.gzdxid.utils;import java.nio.FloatBuffer;import android.opengl.GLES20;//纹理矩形public class DrawRectTextureLight {int mProgram;//自定义渲染管线着色器程序id    int muMVPMatrixHandle;//总变换矩阵引用    int maPositionHandle; //顶点位置属性引用     int maTexCoorHandle; //顶点纹理坐标属性引用     String mVertexShader;//顶点着色器         String mFragmentShader;//片元着色器FloatBuffer   mVertexBuffer;//顶点坐标数据缓冲FloatBuffer   mTexCoorBuffer;//顶点纹理坐标数据缓冲    int vCount=0;           public DrawRectTextureLight(float width, float height, int mProgram)    {        initVertexData(width, height);intShader(mProgram);    }        //初始化顶点坐标与着色数据的方法    public void initVertexData(float width, float height)    {    vCount = 6;float w = width / 2;float h = height / 2;float vertices[] = new float[] { -w,  h, 0,-w, -h, 0, w, -h, 0, w, -h, 0, w,  h, 0,-w,  h, 0,};mVertexBuffer=UtilBufferTransfer.getFloatBuffer(vertices);float texCoor[] = new float[] { 0, 0, 0, 1, 1, 1, 1, 1, 1, 0, 0, 0 };mTexCoorBuffer=UtilBufferTransfer.getFloatBuffer(texCoor);    }    //初始化shader    public void intShader(int mProgam)    {    this.mProgram = mProgam;    muMVPMatrixHandle = GLES20.glGetUniformLocation(mProgram, "uMVPMatrix");          maPositionHandle = GLES20.glGetAttribLocation(mProgram, "aPosition");        maTexCoorHandle= GLES20.glGetAttribLocation(mProgram, "aTexCoor");    }        public void drawSelf(int texId)    {             GLES20.glUseProgram(mProgram);          GLES20.glUniformMatrix4fv(muMVPMatrixHandle, 1, false, MatrixState.getFinalMatrix(), 0);          GLES20.glVertexAttribPointer           (         maPositionHandle,            3,          GLES20.GL_FLOAT,          false,                3*4,                   mVertexBuffer         );                GLES20.glVertexAttribPointer           (        maTexCoorHandle,          2,          GLES20.GL_FLOAT,          false,                2*4,                   mTexCoorBuffer         );            GLES20.glEnableVertexAttribArray(maPositionHandle);           GLES20.glEnableVertexAttribArray(maTexCoorHandle);                    GLES20.glActiveTexture(GLES20.GL_TEXTURE0);         GLES20.glBindTexture(GLES20.GL_TEXTURE_2D, texId);                  GLES20.glDrawArrays(GLES20.GL_TRIANGLES, 0, vCount);     }}

第三步:应用

                       <span style="color:#ff0000;"> GLES20.glEnable(GLES20.GL_BLEND);GLES20.glBlendFunc(GLES20.GL_SRC_ALPHA, GLES20.GL_ONE_MINUS_SRC_ALPHA);</span>MatrixState.pushMatrix();MatrixState.translate(0, 0, offsetZ);MatrixState.rotate(angleRotateCube, 0, 1, 0);MatrixState.rotate(-angleRotateZ, 0, 0, 1);centerCube.drawSelf(cubeId);MatrixState.popMatrix();<span style="color:#ff0000;">GLES20.glDisable(GLES20.GL_BLEND);</span>


小感想:在三维软件渲染图片时的效果,我们要想一想怎样用代码实现,这样才真正理解代码意思!!!



0 0
原创粉丝点击