Muti-Barrage 一个多功能的Android弹幕库

4,474 阅读3分钟

前言

过去几个星期每天下班后除了看视频学习就是写弹幕库了,想法来源于去年看到QQ空间里面的支持弹幕的图片预览,心血来潮就想实现一个,最终完成了Muti-Barrage, 先看效果:

1. 单视图弹幕

单视图弹幕
2. 多视图弹幕
多视图弹幕.gif
最后,我将它集成在我的图片预览库中,一款仿QQ空间的图片预览库:PhotoPagerView
弹幕功能的图片预览

一、功能

Muti-Barrage支持的功能:

  • 自定义多视图
  • 设置发送间隔
  • 碰撞检测(多视图情况下还存在问题)
  • 触摸事件处理
  • 支持全屏和上中下显示
  • 支持设置播放次数和循环播放

二、使用

1. 添加依赖

先在build.gradle(Project:xxx)的repositories中添加:

  allprojects {
    repositories {
        google()// 不翻墙可以注释掉
        jcenter()
        maven { url 'https://jitpack.io' }
    }
}

然后在 build.gradle(Module:app) 的 dependencies 添加:

 dependencies {
    ...
   
    /*需要添加的依赖 这里可以查看一下上面的最新版本*/
    implementation 'com.jieWang:Muti-Barrage:1.0.4'
 }

2. 使用

使用方法有点跟RecyclerView相似,可自由定制也造成了使用成本的上升,没办法~ 第一步:添加进布局文件

<com.orient.tea.barragephoto.ui.BarrageView
            android:id="@+id/barrage"
            android:layout_width="match_parent"
            android:layout_height="match_parent"/>

第二步:构建自己的弹幕数据类型实现DataSource接口

public class BarrageData implements DataSource {
    		...
    		@Override
        public int getType() {
            return type;
        }
    
        // 如果需要,通常是不需要的,后续会删除
        @Override
        public long getShowTime() {
            return 0;
        }
}

第三步:获取BarrageView并初始化参数

private BarrageView barrageView;
    
...
      
barrageView = findViewById(xxx);
BarrageView.Options options = new BarrageView.Options()
         .setGravity(BarrageView.GRAVITY_TOP) // 设置弹幕的位置
         .setInterval(50) // 设置弹幕的发送间隔
         .setSpeed(200,29) // 设置速度和波动值
         .setModel(BarrageView.MODEL_COLLISION_DETECTION)     // 设置弹幕模式 随机生成or碰撞检测
         .setRepeat(-1) // 循环播放 默认为1次 -1 为无限循环
         .setClick(false); // 设置弹幕是否可以点击
barrageView.setOptions(options);

第四步:创建ViewHolder,实现BarrageViewHolder接口(后面多处需要加范型)

// 在多视图弹幕中自己需要构建多个类型ViewHolder
class ViewHolder extends BarrageAdapter.BarrageViewHolder<BarrageData> {
            public ViewHolder(View itemView) {
                super(itemView);
            }
    
            @Override
            protected void onBind(BarrageData data) {
                ...// 自己想在ViewHolder中对Ui的处理
            }
}

第五步:设置适配器创建适配器,需要加上范型(第二部实现的数据类型)

private BarrageAdapter<BarrageData> mAdapter;

单视图

barrageView.setAdapter(mAdapter = new BarrageAdapter<BarrageData>(null, this) {
                @Override
                public BarrageViewHolder<BarrageData> onCreateViewHolder(View root, int type) {
                    return new SingleBarrageActivity.ViewHolder(root);// 返回自己创建的ViewHolder
                }
    
                @Override
                public int getItemLayout(BarrageData barrageData) {
                    return R.layout.barrage_item_normal;// 返回自己设置的布局文件
                }
});

多视图要麻烦一点(可以查看示例代码)

// 设置适配器 第一个参数是点击事件的监听器
barrageView.setAdapter(mAdapter = new BarrageAdapter<BarrageData>(null, this) {
                @Override
                public BarrageViewHolder<BarrageData> onCreateViewHolder(View root, int type) {
                    switch (type) {// 这里的type指的我们设置的子布局文件,然后设置ViewHolder
                        ... // 不同的布局文件构建不同的ViewHolder
                    }
                }
    
                @Override
                public int getItemLayout(BarrageData barrageData) {
                    switch (barrageData.getType()) {// 根据弹幕数据中的type设置子布局文件
                        ... // 不同的弹幕类型返回不同的布局文件
                    }
                }
});

如果需要设置弹幕触摸事件,第三步中BarrageView.Options必须得设置可点击

// 设置监听器
mAdapter.setAdapterListener(new AdapterListener<BarrageData>() {
                @Override
                public void onItemClick(BarrageAdapter.BarrageViewHolder<BarrageData> holder, BarrageData item) {
                  ...
                }
});

三、更新

如果您对弹幕的实现原理感兴趣:

教你写一个弹幕库,确定不了解一下?

如果您发现了什么问题,还请指教:

Muti-Barrage:github.com/mCyp/Muti-B…

如果觉得还不错,欢迎Star,如果发现有什么问题,也欢迎提交issues。