opengles之卡通着色算法

顶点着色器

uniform mat4 uMVPMatrix; //总变换矩阵
uniform mat4 uMMatrix; //变换矩阵
uniform vec3 uLightLocation;	//光源位置
uniform vec3 uCamera;	//摄像机位置
attribute vec3 aPosition;  //顶点位置
attribute vec3 aNormal;    //顶点法向量
//用于传递给片元着色器的变量
varying vec4 diffuse;//用于传递给片元着色器的散射光最终强度
varying vec4 specular;//用于传递给片元着色器的镜面光最终强度
varying float vEdge;//视线向量与法向量的点积值

//定位光光照计算的方法
void pointLight(					//定位光光照计算的方法
  in vec3 normal,				//法向量
  inout vec4 diffuse,				//散射光最终强度
  inout vec4 specular,			//镜面光最终强度
  inout float edge,
  in vec3 lightLocation,			//光源位置
  in vec4 lightDiffuse,			//散射光强度
  in vec4 lightSpecular			//镜面光强度
){
  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);  
  edge = max(0.0,dot(newNormal,eye));
  //计算从表面点到光源位置的向量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); //根据总变换矩阵计算此次绘制此顶点位置  
   float edge;
   pointLight(normalize(aNormal),diffuse,specular,edge,uLightLocation,vec4(0.7,0.7,0.7,1.0),vec4(0.3,0.3,0.3,1.0));
   vEdge = edge;
}                      

片元着色器

//卡通着色算法
precision mediump float;//默认浮点精度
//接收从顶点着色器过来的参数
varying vec4 diffuse;//接收从顶点着色器传递过来的散射光最终强度
varying vec4 specular;//接收从顶点着色器传递过来的镜面光最终强度
varying float vEdge;//接收从顶点着色器传递过来的视线向量与法向量的点积值
void main()                         
{

	//计算散射光三个色彩通道的平均值
   float averageDiffuse = (diffuse.x + diffuse.y + diffuse.z)/3.0;
   if(averageDiffuse<0.5){
      averageDiffuse=0.2;
   } else {
      averageDiffuse=0.8;
   }
   //生成用于卡通着色的散射光强度值
   vec4 diffuseFinal = vec4(averageDiffuse, averageDiffuse, averageDiffuse, 1.0);
  
   //计算镜面光3个色彩通道的平均值
   float averageSpecular = (specular.x + specular.y + specular.z)/3.0;
   if(averageSpecular<0.18){
      averageSpecular=0.0;
   } else {
      averageSpecular=1.0;
   }
   //生成用于卡通着色的镜面光强度值
   vec4 specularFinal = vec4(averageSpecular, averageSpecular, averageSpecular, 1.0);
   
   float edgeFinal = 1.0;
   if(vEdge<0.2){//如果为边缘像素，用黑色描边
       edgeFinal = 0.0;
   }
   gl_FragColor = edgeFinal*(specularFinal+diffuseFinal);//给此片元颜色值
}