基于exoplayer播放器的高斯模糊视频滤镜

最近项目需求，视频滤镜要用高斯模糊。奈何网上全是图片高斯模糊，且模糊的强度不够，效果并不是自己需要的。

于是，打算自己写一个。

exoPlayer播放器自带滤镜，所以用这个播放器来做。

滤镜的话，用到的是OpenGL来写（不会OpenGL，东拼西凑的）

先看效果吧

  

另外，暴露出4个参数，供需求用

radius	偏移量
blurX	X轴方向偏移次数
blurY	Y轴方向偏移次数
trans	亮度

 原理大概是：

将原图层亮度调为原来的 trans倍(trans为自定义参数，默认0.005)，然后copy一层X轴方向偏移，copy一层Y轴偏移，偏移量为radius。

画个图解释一下

 

然后图层多了，就可以达到高斯模糊的效果。

 

下面粘贴部分源代码

1.关键代码，滤镜

#GaussianBlurEffect
#extension GL_OES_EGL_image_external : require
precision mediump float;
varying vec2 vTextureCoord;
uniform samplerExternalOES sTexture;
const float resolution=1024.0;
const float radius = radius;
vec2 dir = vec2(1.0,1.0);
    void main() {
    vec4 sum = vec4(0.0);
    vec2 tc = vTextureCoord;
    float blur = radius/resolution;
    float hstep = dir.x;
    float vstep = dir.y;
    int x = blurX;
    int y = blurY;
    for(int i = x;i > 0;i--){ 
    	for(int j = y; j > 0; j--){
    		sum = texture2D(sTexture, vec2(tc.x + float(i)*blur*hstep, tc.y + float(j)*blur*vstep)) *trans;
		    sum = texture2D(sTexture, vec2(tc.x - float(i)*blur*hstep, tc.y + float(j)*blur*vstep)) *trans;
		    sum = texture2D(sTexture, vec2(tc.x - float(i)*blur*hstep, tc.y - float(j)*blur*vstep)) *trans;
		    sum = texture2D(sTexture, vec2(tc.x + float(i)*blur*hstep, tc.y - float(j)*blur*vstep)) *trans;
    	}
    }
    vec4 cc= texture2D(sTexture,vTextureCoord );

    gl_FragColor =vec4(sum.rgb, cc.a);
    }

代码中的radius, blurX, blurY, trans 对象，已在上面说明，可以改成固定值

顺手贴一段，无效果的滤镜代码用作参考对比

#NoEffect
#extension GL_OES_EGL_image_external : require
    precision mediump float;
    varying vec2 vTextureCoord;
    uniform samplerExternalOES sTexture;
    void main() {
        gl_FragColor = texture2D(sTexture, vTextureCoord);
    }

然后通过OpenGL和Java绑定(具体绑定方法，不赘述，可以直接看Demo)

GLES20.glCreateProgram();//创建
GLES20.glAttachShader(program, vertexShader);
GLES20.glAttachShader(program, pixelShader);

exoPlayer是用textureView来显示视频，所以 应该在xml文件中，加上textureView. (ImageView是一个开始播放的按钮)

然后是MainActivity的初始化，适当做了注释。后面没注释的，主要都是Activity生命周期 播放器的操作

public class MainActivity extends AppCompatActivity {

    private View videoPlayerView;//播放器 播放按钮View

    private TextureView textureView;//纹理 播放视频用

    private SimpleExoPlayer player;//播放器

    private Handler mainHandler;

    private boolean isPlayer = false;

    private EGLUtils mEglUtils;//EGL工具类
    private GLFramebuffer mFramebuffer;//滤镜代码，以及绑定和绘制的方法

    private String uri = "http://clips.vorwaerts-gmbh.de/big_buck_bunny.mp4";

    @Override
    protected void onCreate(Bundle savedInstanceState) {
        super.onCreate(savedInstanceState);
        setContentView(R.layout.activity_main);

        videoPlayerView = findViewById(R.id.video_player);

        mainHandler = new Handler();

        textureView = findViewById(R.id.texture_view);
        textureView.setSurfaceTextureListener(new TextureView.SurfaceTextureListener() {
            @Override
            public void onSurfaceTextureAvailable(SurfaceTexture surface, int width, int height) {
                //初始化SurfaceTexture, 准备就绪
                init(new Surface(surface),uri);
            }

            @Override
            public void onSurfaceTextureSizeChanged(SurfaceTexture surface, int width, int height) {
                //SurfaceTexture改变大小时调用
            }

            @Override
            public boolean onSurfaceTextureDestroyed(SurfaceTexture surface) {
                //SurfaceTexture摧毁时调用
                return false;
            }

            @Override
            public void onSurfaceTextureUpdated(SurfaceTexture surface) {
                //SurfaceTexture更新时调用
            }
        });


    }
    public void init(Surface surface,String uri){
//        Uri url = Uri.parse(Environment.getExternalStorageDirectory().getAbsolutePath() +"/HMSDK/video/1531383835814.mp4");//本地指定视频
        Uri url = Uri.parse(uri);//网络视频地址
        DefaultBandwidthMeter bandwidthMeter = new DefaultBandwidthMeter();


        TrackSelection.Factory videoTrackSelectionFactory = new AdaptiveTrackSelection.Factory(bandwidthMeter);
        TrackSelector trackSelector = new DefaultTrackSelector(videoTrackSelectionFactory);

        player = ExoPlayerFactory.newSimpleInstance(this, trackSelector);


        DataSource.Factory dataSourceFactory = new DefaultDataSourceFactory(this,
                Util.getUserAgent(this, "ExoPlayerTime"), bandwidthMeter);


        MediaSource videoSource = new ExtractorMediaSource.Factory(dataSourceFactory).createMediaSource(url, mainHandler,null);

        player.addVideoTiemListener(new VideoTimeListener() {
            @Override
            public Surface onSurface(Surface surface,int width,int height) {
                mEglUtils = new EGLUtils();
                mEglUtils.initEGL(surface);
                mFramebuffer = new GLFramebuffer();//滤镜对象
                mFramebuffer.initFramebuffer(textureView.getWidth(),
                        textureView.getHeight(),
                        width,
                        height);

                return new Surface(mFramebuffer.getSurfaceTexture());
            }

            @Override
            public void onVideoTimeChanged(long time) {//每一帧调用一次
                mFramebuffer.drawFrame();

                mEglUtils.swap();
            }

            @Override
            public void onRelease() {
                if(mEglUtils != null){
                    mEglUtils.release();
                }

            }
        });
        player.setVideoSurface(surface);
        player.prepare(videoSource);
    }

    public void playVideo(View view){
        if(player.getContentPosition() >= player.getDuration()){
            player.seekTo(0);
        }
        player.setPlayWhenReady(true);
        videoPlayerView.setVisibility(View.INVISIBLE);
        isPlayEnd();
    }
    private Handler seekBarHandler = new Handler(){
        @Override
        public void handleMessage(Message msg) {
            super.handleMessage(msg);
            if(player.getPlayWhenReady() && player.getContentPosition() < player.getDuration()){
                isPlayEnd();
            }else{
                if(!isPlayer){
                    player.setPlayWhenReady(false);
                    videoPlayerView.setVisibility(View.VISIBLE);
                }
            }
        }
    };
    private void isPlayEnd(){
        seekBarHandler.removeMessages(100);
        Message message = seekBarHandler.obtainMessage();
        message.what = 100;
        seekBarHandler.sendMessageDelayed(message,100);
    }

    @Override
    protected void onResume() {
        super.onResume();
        if(player != null){
            if(isPlayer){
                player.setPlayWhenReady(true);
                isPlayer = false;
                isPlayEnd();
            }
        }
    }

    @Override
    protected void onPause() {
        super.onPause();
        if(player != null){
            if(player.getPlayWhenReady()){
                player.setPlayWhenReady(false);
                isPlayer = true;
            }

        }
    }

    @Override
    protected void onDestroy() {
        super.onDestroy();
        if(player != null){
            player.stop();
            player.release();
            player = null;
        }
    }
}

xml文件中那个src

复制到drawable文件夹中

当然，别忘了在AndroidManifest.xml中，添加网络权限

另外，我整合了aar文件。如果不愿意自己写，也可以用aar文件，直接用就行。点击直接前往。

源码打包：地址；看心情传github