浅谈DanmakuView

  今天简单介绍一下开源的弹幕引擎---danmakuView

  使用之前在build.gradle里面添加下面这一条（目前我使用的工具是AndroidStudio 3.1.2）

  implementation 'com.github.ctiao:DanmakuFlameMaster:0.3.8'

  库导入完成之后一定不要忘记 Sync now (emmmm，相信你应该不会忘)

1.设计布局

  首先设计布局，布局文件就很好理解了，采用了谷歌最新的ConstraintLayout布局，简单实用，内部放置一个VideoView用来播放视频，EditText用来输入弹幕，Button用来发送弹幕，介绍Over

<?xml version="1.0" encoding="utf-8"?>
<android.support.constraint.ConstraintLayout
xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:app="http://schemas.android.com/apk/res-auto"
xmlns:tools="http://schemas.android.com/tools"
android:id="@+id/activity_main"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:background="#000"
tools:context=".MainActivity">  

<VideoView
    android:id="@+id/videoview"
    android:layout_width="match_parent"
    android:layout_height="wrap_content" />

<master.flame.danmaku.ui.widget.DanmakuView
    android:id="@+id/danmaku"
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    android:layout_marginBottom="8dp"
    android:layout_marginLeft="8dp"
    android:layout_marginStart="8dp"
    android:layout_marginTop="8dp"
    app:layout_constraintBottom_toBottomOf="parent"
    app:layout_constraintEnd_toEndOf="parent"
    app:layout_constraintStart_toStartOf="parent"
    app:layout_constraintTop_toTopOf="parent" />

<LinearLayout
    android:id="@+id/ly_send"
    android:layout_width="match_parent"
    android:layout_height="50dp"
    android:background="#FFF"
    android:orientation="horizontal"
    android:visibility="gone"
    app:layout_constraintBottom_toBottomOf="parent">

    <EditText
        android:id="@+id/et_text"
        android:layout_width="0dp"
        android:layout_height="match_parent"
        android:layout_weight="1" />

    <Button
        android:id="@+id/btn_send"
        android:layout_width="wrap_content"
        android:layout_height="match_parent"
        android:text="发送" />
</LinearLayout>
</android.support.constraint.ConstraintLayout>

2.界面逻辑

  点击屏幕，底部会显示一个输入框和一个发送按钮，当输入文字并点击发送之后，屏幕上会出现一个蓝色框，里面是刚刚输入的文字，再次点击屏幕，底部的输入框和发送按钮消失。Over

package com.project.software.company;

import android.graphics.Color;
import android.net.Uri;
import android.support.v7.app.AppCompatActivity;
import android.os.Bundle;
import android.text.TextUtils;
import android.view.View;
import android.widget.Button;
import android.widget.EditText;
import android.widget.LinearLayout;
import android.widget.VideoView;  

import org.w3c.dom.Text;

import java.util.Random;

import master.flame.danmaku.controller.DrawHandler;
import master.flame.danmaku.danmaku.model.BaseDanmaku;
import master.flame.danmaku.danmaku.model.DanmakuTimer;
import master.flame.danmaku.danmaku.model.IDanmakus;
import master.flame.danmaku.danmaku.model.android.DanmakuContext;
import master.flame.danmaku.danmaku.model.android.Danmakus;
import master.flame.danmaku.danmaku.parser.BaseDanmakuParser;
import master.flame.danmaku.ui.widget.DanmakuView;  

public class MainActivity extends AppCompatActivity {

private boolean showDanmaku;
private DanmakuView danmakuView;
private DanmakuContext danmakuContext;
private Button sendButton;
private LinearLayout sendLayout;
private EditText editText;
private VideoView videoView;

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

//初始化界面控件
private void initView() {
    videoView = findViewById(R.id.videoview);
    sendLayout = findViewById(R.id.ly_send);
    sendButton = findViewById(R.id.btn_send);
    editText = findViewById(R.id.et_text);
    danmakuView = findViewById(R.id.danmaku);
}

//播放视频
private void playVideo() {
    String uri = "android.resource://"+getPackageName()+"/"+R.raw.sun;
    if(uri !=null){
        videoView.setVideoURI(Uri.parse(uri));
        videoView.start();
    } else {
        videoView.getBackground().setAlpha(0);  //将背景设为透明
    }
}

//创建弹幕解析器
private BaseDanmakuParser parser = new BaseDanmakuParser() {
    @Override
    protected IDanmakus parse() {
        return new Danmakus();
    }
};

//初始化弹幕
private void initDanmaku(){
    danmakuView.setCallback(new DrawHandler.Callback() {   //设置回调函数
        @Override
        public void prepared() {
            showDanmaku = true;
            danmakuView.start(); //开始弹幕
            generateDanmakus(); //开始随机生成弹幕方法
        }

        @Override
        public void updateTimer(DanmakuTimer timer) {
        }

        @Override
        public void drawingFinished() {
        }
    });
    danmakuContext = danmakuContext.create();
    danmakuView.enableDanmakuDrawingCache(true);  //提升屏幕绘制效率
    danmakuView.prepare(parser,danmakuContext);  //进行弹幕准备
    //为danmakuView设置点击事件
    danmakuView.setOnClickListener(new View.OnClickListener() {
        @Override
        public void onClick(View v) {
            if(sendLayout.getVisibility() == View.GONE){
                sendLayout.setVisibility(View.VISIBLE);   //显示布局
            } else {
                sendLayout.setVisibility(View.GONE);  //隐藏布局
            }
        }
    });
    //为“发送”按钮设置点击事件
    sendButton.setOnClickListener(new View.OnClickListener() {
        @Override
        public void onClick(View v) {
            String content = editText.getText().toString();
            if(!TextUtils.isEmpty(content)){
                addDanmaku(content,true);    //添加一条弹幕
                editText.setText("");
            }
        }
    });
}
//添加一条弹幕
//content 弹幕的具体内容
//border 弹幕是否有边框
private void addDanmaku(String content,boolean border){
    //创建弹幕对象，TYPE_SCROLL_RL表示从左向右滚动的弹幕
    BaseDanmaku danmaku = danmakuContext.mDanmakuFactory.createDanmaku(BaseDanmaku.TYPE_SCROLL_RL);
    danmaku.text = content;
    danmaku.padding = 6;
    danmaku.textSize = 30;
    danmaku.textColor = Color.WHITE;   //弹幕文字颜色
    danmaku.time = danmakuView.getCurrentTime();
    if(border){
        danmaku.borderColor = Color.BLUE;  //弹幕文字边框的颜色
    }
    danmakuView.addDanmaku(danmaku);  //添加一条弹幕
}
/*
随机生成一些弹幕的内容
*/
private void generateDanmakus(){
    new Thread(new Runnable() {
        @Override
        public void run() {
            while(showDanmaku){
                int num = new Random().nextInt(300);
                String content = ""+num;
                addDanmaku(content,false);
                try{
                    Thread.sleep(num);
                }catch (InterruptedException e){
                    e.printStackTrace();
                }
            }
        }
    }).start();
}

protected void onPause() {
    super.onPause();
    if(danmakuView != null && danmakuView.isPrepared()){
        danmakuView.pause();
    }
}

protected void onResume() {
    super.onResume();
    if(danmakuView !=null && danmakuView.isPrepared() && danmakuView.isPaused()){
        danmakuView.resume();
    }
}

protected void onDestroy() {
    super.onDestroy();
    showDanmaku = false;
    if(danmakuView != null){
        danmakuView.release();
        danmakuView = null;
    }
}
}

  下面简单解释一下代码，在onCreate()方法中调用了三个初始化函数：

    1.initView()用来初始化界面控件

    2.playVideo()用来播放视频（将视频名称为run的视频放入raw文件夹下面）

    3.initDanmaku()用来初始化屏幕

  接下来是添加弹幕，在发送按钮的点击事件中调用了addDanmaku(content,true)函数，将输入的内容传递过来，并在该函数中设置弹幕的一些属性

  当然，光有自己输入的弹幕是不美观的，还要添加一些别人输入的弹幕，这样显得更真实一些，generateDanmakus()函数就做到了这一点，不过这里选择的是随机生成一些数字

  剩下的onPause(),onResume(),onDestroy()方法就比较简单，我就不一一介绍了

  最后，如果你觉得竖屏和标题栏不好看，可以在MainActivity的《activity》标签（这里我不得不用中文符号，英文符号会出错）中加入下面这一句，使之横屏：

    android:screenOrientation="landscape"

  在《application》标签（这里也是同样的问题）中下入下面这一句，去掉标题栏：

    android:theme="@style/Theme.AppCompat.Light.NoActionBar"

  最最最后，贴图看效果

  此文Over