当前位置：移动技术网 > IT编程>移动开发>Android > Android 实现仿网络直播弹幕功能详解及实例

Android 实现仿网络直播弹幕功能详解及实例

2019年07月24日 | 移动技术网IT编程 | 我要评论

打印设备,科比永久投篮包,宫心计2中宫无后

android 网络直播弹幕

最近看好多网络电视，播放器及直播都有弹幕功能，自己周末捣鼓下并实现，以下是网上的资料，大家可以看下。

现在网络直播越来越火，网络主播也逐渐成为一种新兴职业，对于网络直播，弹幕功能是必须要有的，如下图：

首先来分析一下，这个弹幕功能是怎么实现的，首先在最下面肯定是一个游戏界面view，然后游戏界面上有弹幕view，弹幕的view必须要做成完全透明的，这样即使覆盖在游戏界面的上方也不会影响到游戏的正常观看，只有当有人发弹幕消息时，再将消息绘制到弹幕的view上面就可以了，下方肯定还有有操作界面view，可以让用户来发弹幕和送礼物的功能，原理示意图如下所示：

参照原理图，下面一步一步来实现这个功能。

实现视频的播放

activity_main.xml

<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"/> 
</relativelayout>

mainactivity.java

package com.jackie.bombscreen; 
 
import android.os.build; 
import android.os.bundle; 
import android.os.environment; 
import android.support.v7.app.appcompatactivity; 
import android.view.view; 
import android.widget.videoview; 
 
public class mainactivity extends appcompatactivity { 
 @override 
 protected void oncreate(bundle savedinstancestate) { 
  super.oncreate(savedinstancestate); 
  setcontentview(r.layout.activity_main); 
  videoview videoview = (videoview) findviewbyid(r.id.video_view); 
  videoview.setvideopath(environment.getexternalstoragedirectory() + "/xiaoxingyun.mp4"); 
  videoview.start(); 
 } 
  
 @override 
 public void onwindowfocuschanged(boolean hasfocus) { 
  super.onwindowfocuschanged(hasfocus); 
  if (hasfocus && build.version.sdk_int >= 19) { 
   view decorview = getwindow().getdecorview(); 
   decorview.setsystemuivisibility( 
     view.system_ui_flag_layout_stable 
       | view.system_ui_flag_layout_hide_navigation 
       | view.system_ui_flag_layout_fullscreen 
       | view.system_ui_flag_hide_navigation 
       | view.system_ui_flag_fullscreen 
       | view.system_ui_flag_immersive_sticky); 
  } 
 } 
}

最后别忘了设置androidmainfest.xml

效果如下：

、

实现弹幕的效果

接下来我们开始实现弹幕效果。弹幕其实也就是一个自定义的view，它的上面可以显示类似于跑马灯的文字效果。观众们发表的评论都会在弹幕上显示出来，但又会很快地移出屏幕，既可以起到互动的作用，同时又不会影响视频的正常观看。

我们可以自己来编写这样的一个自定义view，当然也可以直接使用网上现成的开源项目。那么为了能够简单快速地实现弹幕效果，这里我就准备直接使用由哔哩哔哩开源的弹幕效果库danmakuflamemaster。

danmakuflamemaster库的项目主页地址是：

添加build.gradle依赖

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

<?xml version="1.0" encoding="utf-8"?> 
<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" /> 
</relativelayout>

修改mainactivity.java

package com.jackie.bombscreen; 
 
import android.graphics.color; 
import android.os.build; 
import android.os.bundle; 
import android.os.environment; 
import android.support.v7.app.appcompatactivity; 
import android.view.view; 
import android.widget.videoview; 
 
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 misshowdanmaku; 
 private danmakuview mdanmakuview; 
 private danmakucontext mdanmakucontext; 
 
 private 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); 
  videoview videoview = (videoview) findviewbyid(r.id.video_view); 
  videoview.setvideopath(environment.getexternalstoragedirectory() + "/xiaoxingyun.mp4"); 
  videoview.start(); 
 
  mdanmakuview = (danmakuview) findviewbyid(r.id.danmaku_view); 
  mdanmakuview.enabledanmakudrawingcache(true); 
  mdanmakuview.setcallback(new drawhandler.callback() { 
   @override 
   public void prepared() { 
    misshowdanmaku = true; 
    mdanmakuview.start(); 
    generatesomedanmaku(); 
   } 
 
   @override 
   public void updatetimer(danmakutimer timer) { 
 
   } 
 
   @override 
   public void danmakushown(basedanmaku danmaku) { 
 
   } 
 
   @override 
   public void drawingfinished() { 
 
   } 
  }); 
 
  mdanmakucontext = danmakucontext.create(); 
  mdanmakuview.prepare(parser, mdanmakucontext); 
 } 
 
 /** 
  * 向弹幕view中添加一条弹幕 
  * @param content  弹幕的具体内容 
  * @param withborder 弹幕是否有边框 
  */ 
 private void adddanmaku(string content, boolean withborder) { 
  basedanmaku danmaku = mdanmakucontext.mdanmakufactory.createdanmaku(basedanmaku.type_scroll_rl); 
  danmaku.text = content; 
  danmaku.padding = 5; 
  danmaku.textsize = sp2px(20); 
  danmaku.textcolor = color.white; 
  danmaku.settime(mdanmakuview.getcurrenttime()); 
  if (withborder) { 
   danmaku.bordercolor = color.green; 
  } 
  mdanmakuview.adddanmaku(danmaku); 
 } 
 
 /** 
  * 随机生成一些弹幕内容以供测试 
  */ 
 private void generatesomedanmaku() { 
  new thread(new runnable() { 
   @override 
   public void run() { 
    while(misshowdanmaku) { 
     int time = new random().nextint(300); 
     string content = "" + time + time; 
     adddanmaku(content, false); 
     try { 
      thread.sleep(time); 
     } catch (interruptedexception e) { 
      e.printstacktrace(); 
     } 
    } 
   } 
  }).start(); 
 } 
 
 /** 
  * sp转px的方法。 
  */ 
 public int sp2px(float spvalue) { 
  final float fontscale = getresources().getdisplaymetrics().scaleddensity; 
  return (int) (spvalue * fontscale + 0.5f); 
 } 
 
 @override 
 protected void onpause() { 
  super.onpause(); 
  if (mdanmakuview != null && mdanmakuview.isprepared()) { 
   mdanmakuview.pause(); 
  } 
 } 
 
 @override 
 protected void onresume() { 
  super.onresume(); 
  if (mdanmakuview != null && mdanmakuview.isprepared() && mdanmakuview.ispaused()) { 
   mdanmakuview.resume(); 
  } 
 } 
 
 @override 
 protected void ondestroy() { 
  super.ondestroy(); 
  misshowdanmaku = false; 
  if (mdanmakuview != null) { 
   mdanmakuview.release(); 
   mdanmakuview = null; 
  } 
 } 
  
 @override 
 public void onwindowfocuschanged(boolean hasfocus) { 
  super.onwindowfocuschanged(hasfocus); 
  if (hasfocus && build.version.sdk_int >= 19) { 
   view decorview = getwindow().getdecorview(); 
   decorview.setsystemuivisibility( 
     view.system_ui_flag_layout_stable 
       | view.system_ui_flag_layout_hide_navigation 
       | view.system_ui_flag_layout_fullscreen 
       | view.system_ui_flag_hide_navigation 
       | view.system_ui_flag_fullscreen 
       | view.system_ui_flag_immersive_sticky); 
  } 
 } 
}

效果图如下：

加入操作界面

<?xml version="1.0" encoding="utf-8"?> 
<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:background="#fff" 
  android:visibility="gone"> 
 
  <edittext 
   android:id="@+id/edit_text" 
   android:layout_width="0dp" 
   android:layout_height="match_parent" 
   android:layout_weight="1" /> 
 
  <button 
   android:id="@+id/send" 
   android:layout_width="wrap_content" 
   android:layout_height="match_parent" 
   android:text="send" /> 
 </linearlayout> 
</relativelayout>

package com.jackie.bombscreen; 
 
import android.graphics.color; 
import android.os.build; 
import android.os.bundle; 
import android.os.environment; 
import android.support.v7.app.appcompatactivity; 
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 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 misshowdanmaku; 
 private danmakuview mdanmakuview; 
 private danmakucontext mdanmakucontext; 
 
 private 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); 
  videoview videoview = (videoview) findviewbyid(r.id.video_view); 
  videoview.setvideopath(environment.getexternalstoragedirectory() + "/xiaoxingyun.mp4"); 
  videoview.start(); 
 
  mdanmakuview = (danmakuview) findviewbyid(r.id.danmaku_view); 
  mdanmakuview.enabledanmakudrawingcache(true); 
  mdanmakuview.setcallback(new drawhandler.callback() { 
   @override 
   public void prepared() { 
    misshowdanmaku = true; 
    mdanmakuview.start(); 
    generatesomedanmaku(); 
   } 
 
   @override 
   public void updatetimer(danmakutimer timer) { 
 
   } 
 
   @override 
   public void danmakushown(basedanmaku danmaku) { 
 
   } 
 
   @override 
   public void drawingfinished() { 
 
   } 
  }); 
 
  mdanmakucontext = danmakucontext.create(); 
  mdanmakuview.prepare(parser, mdanmakucontext); 
 
  final linearlayout operationlayout = (linearlayout) findviewbyid(r.id.operation_layout); 
  final button send = (button) findviewbyid(r.id.send); 
  final edittext edittext = (edittext) findviewbyid(r.id.edit_text); 
  mdanmakuview.setonclicklistener(new view.onclicklistener() { 
   @override 
   public void onclick(view view) { 
    if (operationlayout.getvisibility() == view.gone) { 
     operationlayout.setvisibility(view.visible); 
    } else { 
     operationlayout.setvisibility(view.gone); 
    } 
   } 
  }); 
   
  send.setonclicklistener(new view.onclicklistener() { 
   @override 
   public void onclick(view view) { 
    string content = edittext.gettext().tostring(); 
    if (!textutils.isempty(content)) { 
     adddanmaku(content, true); 
     edittext.settext(""); 
    } 
   } 
  }); 
 
  getwindow().getdecorview().setonsystemuivisibilitychangelistener (new view.onsystemuivisibilitychangelistener() { 
   @override 
   public void onsystemuivisibilitychange(int visibility) { 
    if (visibility == view.system_ui_flag_visible) { 
     onwindowfocuschanged(true); 
    } 
   } 
  }); 
 } 
 
 /** 
  * 向弹幕view中添加一条弹幕 
  * @param content  弹幕的具体内容 
  * @param withborder 弹幕是否有边框 
  */ 
 private void adddanmaku(string content, boolean withborder) { 
  basedanmaku danmaku = mdanmakucontext.mdanmakufactory.createdanmaku(basedanmaku.type_scroll_rl); 
  danmaku.text = content; 
  danmaku.padding = 5; 
  danmaku.textsize = sp2px(20); 
  danmaku.textcolor = color.white; 
  danmaku.settime(mdanmakuview.getcurrenttime()); 
  if (withborder) { 
   danmaku.bordercolor = color.green; 
  } 
  mdanmakuview.adddanmaku(danmaku); 
 } 
 
 /** 
  * 随机生成一些弹幕内容以供测试 
  */ 
 private void generatesomedanmaku() { 
  new thread(new runnable() { 
   @override 
   public void run() { 
    while(misshowdanmaku) { 
     int time = new random().nextint(300); 
     string content = "" + time + time; 
     adddanmaku(content, false); 
     try { 
      thread.sleep(time); 
     } catch (interruptedexception e) { 
      e.printstacktrace(); 
     } 
    } 
   } 
  }).start(); 
 } 
 
 /** 
  * sp转px的方法。 
  */ 
 public int sp2px(float spvalue) { 
  final float fontscale = getresources().getdisplaymetrics().scaleddensity; 
  return (int) (spvalue * fontscale + 0.5f); 
 } 
 
 @override 
 protected void onpause() { 
  super.onpause(); 
  if (mdanmakuview != null && mdanmakuview.isprepared()) { 
   mdanmakuview.pause(); 
  } 
 } 
 
 @override 
 protected void onresume() { 
  super.onresume(); 
  if (mdanmakuview != null && mdanmakuview.isprepared() && mdanmakuview.ispaused()) { 
   mdanmakuview.resume(); 
  } 
 } 
 
 @override 
 protected void ondestroy() { 
  super.ondestroy(); 
  misshowdanmaku = false; 
  if (mdanmakuview != null) { 
   mdanmakuview.release(); 
   mdanmakuview = null; 
  } 
 } 
 
 
 @override 
 public void onwindowfocuschanged(boolean hasfocus) { 
  super.onwindowfocuschanged(hasfocus); 
  if (hasfocus && build.version.sdk_int >= 19) { 
   view decorview = getwindow().getdecorview(); 
   decorview.setsystemuivisibility( 
     view.system_ui_flag_layout_stable 
       | view.system_ui_flag_layout_hide_navigation 
       | view.system_ui_flag_layout_fullscreen 
       | view.system_ui_flag_hide_navigation 
       | view.system_ui_flag_fullscreen 
       | view.system_ui_flag_immersive_sticky); 
  } 
 } 
}

效果图如下：

自己发的弹幕有绿色边框，很容易区分。

基本上实现了弹幕的功能，当然，里面的知识点还有很多，这只是最基本的功能。有时间的话，建议学学danmakuflamemaster，里面还有很多炫酷的功能。

感谢阅读，希望能帮助到大家，谢谢大家对本站的支持！

您可能感兴趣的文章:

如对本文有疑问，请在下面进行留言讨论，广大热心网友会与你互动！！点击进行留言回复

Android 应用Crash 后自动重启的方法小结

前提首先，我们肯定要在application里面注册一个crashhandler，监听应用crashpublic class testapplication e... [阅读全文]
Android FTP服务器上传文件攻略(代码详解)

1.前言在开发中，会遇到向ftp服务器上传文件的需求,首先要导入commons-net-3.3.jar 然后利用api进行相关操作，具体功能如下：ftp相关代码... [阅读全文]
Android studio 解决logcat无过滤工具栏的操作

在logcat标题栏右键先windows mode，这时多数能恢复过滤工具栏，要恢复之前的停靠样式再同样点右键去掉windows mode的勾即可补充知识：an... [阅读全文]
Android Studio 恢复小窗口停靠模式(Docked Mode)

安卓studio在使用小窗口时，如果我们点击取消了窗口的docked mode模式，窗口就会变成，你一旦触发窗口以外的区域，窗口就会龟缩回去。此时，如果你想要恢... [阅读全文]
Android项目中实体类entity的作用详解

估计很多入门安卓的朋友对entity很困惑，为什么要写实体类？有什么用？写来干什么？对于实体类的理解我入门的时候也是困惑了好久，后面用多了才慢慢理解，这篇博客就... [阅读全文]
Android studio保存logcat日志到本地的操作

windows环境下1、输出logcat日志到本地文件adb logcat -> f:/logcat.txt2、输出带时间的logcat日志到本地文件：a... [阅读全文]
Android Studio快捷键生成TAG、Log.x日志输出介绍

生成taglogt+tab键：private static final string tag = "extract";生成log.d()logd+tab键：lo... [阅读全文]
Android studio 禁用AndroidX方式

gradle.properties文件中添加android.useandroidx=false #禁用androidxandroid.enablejetifie... [阅读全文]
Flutter 透明状态栏及字体颜色的设置方法

注：底色透明是否生效与android版本有关，版本过低设置无效1.在main.dart内设置void main(){ runapp(new myapp()); ... [阅读全文]
Flutter中mixin的使用详解

mixin是什么mixin应该怎么理解呢，对java系出身的我来说，这是一个新概念，各类资料的介绍也没找到一个清晰的定义。从个人理解来看，可以把它想象为kotl... [阅读全文]

网友评论


验证码：

Android 实现仿网络直播弹幕功能详解及实例

2019年07月24日 | 移动技术网IT编程 | 我要评论

您可能感兴趣的文章:

相关文章:

网友评论