Android自定义View---腐蚀面具-优快云博客

本文介绍了一种基于OpenGL ES实现的腐蚀面具效果。通过在Android应用中控制纹理渲染，随时间逐渐破坏显示的图像，形成独特视觉效果。文章提供了布局配置、代码示例及动画设置方法。

摘要生成于 C知道，由 DeepSeek-R1 满血版支持，前往体验 >

0.前言

最近一直在研究opengl，在android应用中可以很好的进行细粒度的对展示的效果进行控制，今天这个腐蚀面具的效果就是基于opengl es来做的。话不多说，先看效果图

1.使用

使用很简单，在布局文件中直接使用CorronisonView

 <com.skateboard.corronisonview.CorronisonView
        app:duration="10"
        android:id="@+id/corronisonView"
        android:layout_width="match_parent"
        android:layout_height="match_parent" />
复制代码

其中duration代表了销毁时间。然后在MainActivity里设置bitmap

corronisonView.setBitmap(BitmapFactory.decodeResource(resources,R.drawable.icon))
复制代码

2.代码

关于opengl es在android中的使用这里就不细说了，整个过程其实就是利用了一个纹理来显示图片，然后随着时间的推移舍弃一些片段不进行渲染。这里主要来看一下片段着色器的代码

#version 300 es
precision mediump float;
in vec2 texCoord;
out vec4 fragColor;
uniform sampler2D sampler;
uniform float percent;
void main()
{
   vec4 samplerColor=texture(sampler,texCoord);
   float size=samplerColor.x+samplerColor.y+samplerColor.z+samplerColor.w;
   float curSize=4.0*percent;
   if(size<=curSize)
      discard;
   fragColor=samplerColor;
}
复制代码

随着时间的推移不停的设置percent，然后计算当前颜色的所有颜色分量的和如果小于总分量（也就是4.0）*percent的值的话，就舍弃该片段，不进行渲染。在CorronisonView中设置时间动画，不停修改CorronisonViewRender中percent的值

 private fun prepareTimeAnimator()
    {
        val animator = ValueAnimator.ofInt(time)
        animator.duration = time.toLong() * 1000
        animator.addUpdateListener(ValueAnimator.AnimatorUpdateListener {
            render?.percent = it.animatedFraction
        })
        this.animator = animator
    }
复制代码