Android项目中加入弹幕功能

大家好,最近的项目中需要实现弹幕的功能,于是乎就寻找了不少的材料,翻看了郭神写的弹幕博客,以及在github上查阅了哔哩哔哩开源的效果库。整合写了下有关弹幕的文章。
详细的有关弹幕知识可以查看:http://m.blog.csdn.net/article/details?id=51056646 
哔哩哔哩开源的效果库:https://github.com/Bilibili/DanmakuFlameMaster
希望对大家有帮助。下面请看实现后的第一张模拟器效果图,和第二张真机效果图

Android项目中加入弹幕功能


Android项目中加入弹幕功能

此demo包括视频播放,点击屏幕输入文字,弹幕字体文字大小缩放,文字颜色设置以及软键盘和屏幕的比例问题等。

下面逐步介绍项目:

首先使用AndroidStudio新建一个项目,为了更快的开发下项目使用哔哩哔哩的开源类库,只需要在build.gradle中添加依赖即可:

compile 'com.github.ctiao:DanmakuFlameMaster:0.5.3'

同时在清单文件中需要设置网络权限,设置为横屏展示,软键盘随着屏幕可调节高低大小等:

<uses-permission android:name="android.permission.INTERNET" />
<application
    android:allowBackup="true"
    android:icon="@mipmap/ic_launcher"
    android:label="@string/app_name"
    android:roundIcon="@mipmap/ic_launcher_round"
    android:supportsRtl="true"
    android:theme="@style/Theme.AppCompat.NoActionBar">
    <activity android:name=".MainActivity" android:screenOrientation="landscape"
        android:configChanges="orientation|keyboardHidden|screenLayout|screenSize"
        android:windowSoftInputMode="stateVisible|adjustResize">
        <intent-filter>
            <action android:name="android.intent.action.MAIN" />

            <category android:name="android.intent.category.LAUNCHER" />
        </intent-filter>
    </activity>
</application>


然后在布局文件中使用

<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
    android:id="@+id/activity_main"
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    android:background="#000">
    <VideoView
        android:id="@+id/video_view"
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:layout_centerInParent="true" />
    <master.flame.danmaku.ui.widget.DanmakuView
        android:id="@+id/danmaku_view"
        android:layout_width="match_parent"
        android:layout_height="match_parent" />
    <LinearLayout
        android:id="@+id/operation_layout"
        android:layout_width="match_parent"
        android:layout_height="50dp"
        android:layout_alignParentBottom="true"
        android:visibility="gone">
        <EditText
            android:id="@+id/edit_text"
            android:layout_width="0dp"
            android:layout_height="match_parent"
            android:layout_marginLeft="50dp"
            android:layout_weight="1"
            android:imeOptions="flagNoExtractUi" />
        <Button
            android:id="@+id/send"
            android:layout_width="wrap_content"
            android:layout_height="match_parent"
            android:background="#00000000"
            android:text="发送" />
    </LinearLayout>
</RelativeLayout>

接下来初始化控件,播放在线视频

public class MainActivity extends AppCompatActivity {
    private boolean showDanmaku;
    private DanmakuView danmakuView;
    private DanmakuContext danmakuContext;
    private LinearLayout operationLayout;
    private Button send;
    private EditText editText;
    private VideoView videoView;
    BaseDanmakuParser parser =  new BaseDanmakuParser(){
        @Override
        protected IDanmakus parse() {
            return new Danmakus();
        }
    };
    @Override
    protected void onCreate(Bundle savedInstanceState) {
        super.onCreate(savedInstanceState);
        setContentView(R.layout.activity_main);
        initView();
        initListner();
    }

    private void initView() {
        videoView = (VideoView) findViewById(R.id.video_view);
        //设置videoView播放在线视频的路径
        videoView.setVideoPath("http://clips.vorwaerts-gmbh.de/big_buck_bunny.mp4");
        videoView.start();

        operationLayout = (LinearLayout) findViewById(R.id.operation_layout);
        send = (Button) findViewById(R.id.send);
        editText = (EditText) findViewById(R.id.edit_text);
        danmakuView = (DanmakuView) findViewById(R.id.danmaku_view);
    }

接下来就需要添加弹幕以及关联的逻辑操作了:在initListener()中调用setCallBack()方法设置回调函数,接着调用DanmakuContext.create()方法创建实例,查阅源码后了解到可以对弹幕各种全局配置,如字体大小,颜色,显示弹幕多少行等等。
generateSomeDanmaku()方法为了测试弹幕的数据,addDanmaku()方法是为了向DanmakuView中添加一条数据,向左滚动,可以设置文字间距,大小,颜色,边框等等。
然后点击屏幕显示输入框,同时在布局文件中设置软键盘占据屏幕半屏显示,便于输入文字查阅弹幕,点击发送后软件盘隐藏。

private void initListner() {
    //调用了setCallback()方法来设置回调函数
    danmakuView.setCallback(new DrawHandler.Callback() {
        @Override
        public void prepared() {
            showDanmaku = true ;
            danmakuView.start();
            generateSomeDanmaku();
        }
        @Override
        public void updateTimer(DanmakuTimer timer) {}
        @Override
        public void danmakuShown(BaseDanmaku danmaku) {}
        @Override
        public void drawingFinished() {}
    });
    danmakuContext = DanmakuContext.create();
    danmakuContext.setScaleTextSize(2.0f);
    danmakuView.prepare(parser,danmakuContext);

    //设置点击后屏幕后输入框显示或者隐藏
    danmakuView.setOnClickListener(new View.OnClickListener() {
        @Override
        public void onClick(View v) {
            if(operationLayout.getVisibility() == View.GONE){
                operationLayout.setVisibility(View.VISIBLE);
            }else {
                operationLayout.setVisibility(View.GONE);
            }
        }
    });
   //点击发送按钮后逻辑的操作
    send.setOnClickListener(new View.OnClickListener() {
        @Override
        public void onClick(View v) {
            String content = editText.getText().toString();
            if(!TextUtils.isEmpty(content)){
                addDanmaku(content);
                InputMethodManager imm = (InputMethodManager)getSystemService(Context.INPUT_METHOD_SERVICE);
                imm.hideSoftInputFromWindow(editText.getWindowToken(),0);
                editText.setText("");
                operationLayout.setVisibility(View.GONE);
            }
        }
    });
}

//向弹幕view中添加一条弹幕
private  void  addDanmaku(String content){
    BaseDanmaku danmaku = danmakuContext.mDanmakuFactory.createDanmaku(BaseDanmaku.TYPE_SCROLL_RL);
    danmaku.text = content;
    danmaku.padding = 5;
    danmaku.textSize  = 25;
    danmaku.textColor = Color.argb(new Random().nextInt(256), new Random().nextInt(256),
            new Random().nextInt(256),new Random().nextInt(256));
    danmaku.setTime(danmakuView.getCurrentTime());
    danmakuView.addDanmaku(danmaku);
}

//随机生成一些弹幕内容以供测试
private void generateSomeDanmaku() {
    new Thread(new Runnable() {
        BaseDanmaku danmaku = danmakuContext.mDanmakuFactory.createDanmaku(BaseDanmaku.TYPE_SCROLL_RL);
        @Override
        public void run() {
            while (showDanmaku){
                int time = new Random().nextInt(100);
                String content = time +"" ;
                addDanmaku(content);
                try {
                    Thread.sleep(time);
                } catch (InterruptedException e) {
                    e.printStackTrace();
                }
            }
        }
    }).start();
}


最后我们还需要在onPause(),onResume(),onDestroy()中进行一些逻辑处理,保证DanmakuView资源得到释放。

@Override
protected void onPause() {
    super.onPause();
    if (danmakuView != null && danmakuView.isPrepared()) {
        danmakuView.pause();
    }
}
@Override
protected void onResume() {
    super.onResume();
    if (danmakuView != null && danmakuView.isPrepared() && danmakuView.isPaused()) {
        danmakuView.resume();
    }
}
@Override
protected void onDestroy() {
    super.onDestroy();
    showDanmaku = false;
    if (danmakuView != null) {
        danmakuView.release();
        danmakuView = null;
    }
}

由此最终实现了弹幕的简单效果,若还需要更多的需求需要更好的研究哔哩哔哩提供的开源类库,相信努力后的你一定会过的更加精彩。


源码下载:http://download.csdn.net/download/lou_liang/10154828