效果图:(方框从左到右进行显示)
图片资源:
原理介绍:
第一步:将三张图片按位置放好,
Android loading界面的一种加载动态图片的方式
。此时图片资源是全部显示。(目的是坚持位置的正确性)第二步:编写 shader。通过纹理s坐标进行判断,大于某个值时discard。当值为0时,全部不显示,当值为1时全部显示,中间显示的分段由值得大小决定。
顶点着色器:
uniform. mat4 uMVPMatrix;attribute vec3 aPosition;attribute vec2 aTexCoor;varying vec2 vTextureCoord;void main(){ gl_Position=uMVPMatrix*vec4(aPosition,1); vTextureCoord=aTexCoor;}
片元着色器:
precision mediump float;varying vec2 vTextureCoord;uniform. sampler2D sTexture;uniform. float uSpan;void main(){ vec4 finalColor=texture2D(sTexture,vTextureCoord); if(vTextureCoord.x>uSpan){ finalColor.a=0.0; } gl_FragColor=finalColor;}
注:使用方法很简单,这里就不题了,