使用SurfaceView实现视频弹幕

本文实例为大家分享了SurfaceView视频弹幕展示的具体代码,供大家参考,具体内容如下

全部代码如下:

package com.example.app2;

import android.graphics.Canvas;
import android.graphics.Color;
import android.graphics.Paint;
import android.graphics.PixelFormat;
import android.graphics.PorterDuff;
import android.media.MediaPlayer;
import android.os.Bundle;
import android.support.v7.app.AppCompatActivity;
import android.text.TextUtils;
import android.view.SurfaceHolder;
import android.view.SurfaceView;
import android.view.View;
import android.widget.EditText;
import android.widget.Toast;

import java.io.IOException;
import java.util.ArrayList;
import java.util.List;

public class MainActivity extends AppCompatActivity implements SurfaceHolder.Callback {
  private SurfaceView mSvVideo;
  private SurfaceView mSvDanMu;
  private EditText mEd;

  private MediaPlayer mediaPlayer;
  private SurfaceHolder svVideoHolder, svDanMuHolder;

  private boolean isPlay = true;
  List<DanMuBean> list = new ArrayList<>();

  @Override
  protected void onCreate(Bundle savedInstanceState) {
    super.onCreate(savedInstanceState);
    setContentView(R.layout.activity_main);
    // 创建MediaPlayer
    initPlayer();

    // 初始化视图
    initView();
  }

  private void initPlayer() {
    if (mediaPlayer == null) {
      mediaPlayer = new MediaPlayer();
    }
    // 重置
    mediaPlayer.reset();

    try {
      mediaPlayer.setDataSource("http://clips.vorwaerts-gmbh.de/big_buck_bunny.mp4");
      mediaPlayer.prepareAsync(); //异步准备
      mediaPlayer.setOnPreparedListener(new MediaPlayer.OnPreparedListener() {
        @Override
        public void onPrepared(MediaPlayer mp) {
          mediaPlayer.setLooping(true); //是否开启循环播放
          mediaPlayer.start(); //开始播放
        }
      });
    } catch (IOException e) {
      e.printStackTrace();
    }
  }

  /**
   * 发送的信息
   *
   * @param view
   */
  public void send(View view) {
    submit();
  }

  private void submit() {
    // validate 非空判断
    String edString = mEd.getText().toString().trim();
    if (TextUtils.isEmpty(edString)) {
      Toast.makeText(this, "edString不能为空", Toast.LENGTH_SHORT).show();
      return;
    }

    list.add(new DanMuBean(edString)); //添加数据
    mEd.setText(""); //清空
  }

  private void initView() {
    mSvVideo = (SurfaceView) findViewById(R.id.sv_video);
    mSvDanMu = (SurfaceView) findViewById(R.id.sv_danMu);
    mEd = (EditText) findViewById(R.id.ed);

    // 初始化 svDanMuHolder svVideoHolder
    svVideoHolder = mSvVideo.getHolder();
    svDanMuHolder = mSvDanMu.getHolder();

    // 添加监听
    svVideoHolder.addCallback(this);
    svDanMuHolder.addCallback(this);

    // 将弹幕显示在最上层, 并设置为透明
    mSvDanMu.setZOrderOnTop(true);
    svDanMuHolder.setFormat(PixelFormat.TRANSPARENT); //PixelFormat: 像素格式, TRANSPARENT(2):透明的; TRANSLUCENT(-3):半透明
  }

  /**
   * surfaceCreated:创建
   *
   * @param holder
   */
  @Override
  public void surfaceCreated(SurfaceHolder holder) {
    if (holder == svVideoHolder) {
      mediaPlayer.setDisplay(svVideoHolder); //将内容显示在 svVideoHolder上
    } else if (holder == svDanMuHolder) {
      // 弹幕设置 开启线程
      new Thread(new Runnable() {
        @Override
        public void run() {
          while (isPlay) { //死循环
            // 得到画笔, 设置属性
            Paint paint = new Paint();
            paint.setStrokeWidth(5); //设置笔画宽度
            paint.setTextSize(30); //设置字体大小
            paint.setColor(Color.GREEN); // 设置颜色

            // 得到画布 通过lockCanvas
            Canvas canvas = svDanMuHolder.lockCanvas();
            if (canvas == null) {
              break;
            }

            // 填充画布的颜色
            canvas.drawColor(PixelFormat.TRANSPARENT, PorterDuff.Mode.CLEAR); //参数1: 设为透明, 参2: PorterDuff.Mode.CLEAR: 所绘制不会提交到画布上

            // 设置弹幕内容
            for (int i = 0; i < list.size(); i++) {
              String text = list.get(i).text;
              canvas.drawText(text, list.get(i).x += 1, list.get(i).y, paint);

              if (list.get(i).x > mSvVideo.getWidth()) {
                list.get(i).x = 0;
              }
            }

            // 提交
            svDanMuHolder.unlockCanvasAndPost(canvas);
          }
        }
      }).start();
    }
  }

  @Override
  public void surfaceChanged(SurfaceHolder holder, int format, int width, int height) {

  }

  @Override
  public void surfaceDestroyed(SurfaceHolder holder) {
    isPlay = false;
  }
}

布局xml

<?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
  xmlns:tools="http://schemas.android.com/tools"
  android:layout_width="match_parent"
  android:layout_height="match_parent"
  android:orientation="vertical"
  tools:context=".MainActivity">

  <FrameLayout
    android:layout_width="match_parent"
    android:layout_height="wrap_content">

    <SurfaceView
      android:id="@+id/sv_video"
      android:layout_width="match_parent"
      android:layout_height="280dp" />

    <SurfaceView
      android:id="@+id/sv_danMu"
      android:layout_width="match_parent"
      android:layout_height="280dp" />
  </FrameLayout>

  <LinearLayout
    android:layout_width="match_parent"
    android:layout_height="wrap_content">

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

    <Button
      android:layout_width="wrap_content"
      android:layout_height="wrap_content"
      android:onClick="send"
      android:text="弹幕" />

  </LinearLayout>
</LinearLayout>

效果界面:

以上就是本文的全部内容,希望对大家的学习有所帮助,也希望大家多多支持我们。

(0)

相关推荐

  • android实现歌词自动滚动效果

    最近在做Android 的MP3播放的项目,要实现歌词的自动滚动,以及同步显示. lyric的歌词解析主要用yoyoplayer里面的,显示部分参考了这里 ,这里只是模拟MP3歌词的滚动. 先上一下效果图: 滚动实现的代码其实也简单.显示画出当前时间点的歌词,然后再分别画出改歌词后面和前面的歌词,前面的部分往上推移,后面的部分往下推移,这样就保持了当前时间歌词在中间. 代码如下 LyricView,相关信息在注释了标明了. package ru.org.piaozhiye.lyric; impo

  • 比较完整的android MP3 LRC歌词滚动高亮显示(附源码)

    1.以前的滚动只是安行来刷新,现在不是按行来滚动了,其实就是在一定时间内整体往上移动,比如说在1S内刷新10次,由于认得肉眼看起来像是滚动. 关键代码如下: 复制代码 代码如下: float plus = currentDunringTime == 0 ? 30                : 30                        + (((float) currentTime - (float) sentenctTime) / (float) currentDunringTim

  • Android 基于RecyclerView实现的歌词滚动自定义控件

    本文介绍了Android 基于RecyclerView实现的歌词滚动自定义控件,分享给大家,具体如下: 先来几张效果图: 这几天打算做一个控件,来让自己复习一下自定义 view 的知识以及事件分发机制的原理与应用.对于这个控件,我已经封装好了,只要调用就可以了. 本来是想放上 gitHub 和 添加依赖的.但是提交 github 出了问题一直不会弄,所以就只能先等等了.((:′⌒`)) 接下来说一下实现原理: 该控件分为以下几个部分: 歌词自动滚动 歌词颜色字体变化 触碰屏幕歌词不滚动,高亮显示

  • Android实现歌词滚动效果

    本文实例为大家分享了Android实现歌词滚动效果的具体代码,供大家参考,具体内容如下 自定义TextView public class VerticalScrollTextView extends TextView { private Paint mPaint; private float mX; private Paint mPathPaint; public int index = 0; private List<Sentence> list; public float mTouchHi

  • SurfaceView播放视频发送弹幕并实现滚动歌词

    本文实例为大家分享了SurfaceView播放视频发送弹幕,并实现滚动歌词,供大家参考,具体内容如下 SurfaceView使用步骤 使用SurfaceView的步骤: 首先要继承SurfaceView,实现SurfaceHolder.Callback接口. 重写方法:surfaceChanged:surface大小或格式发生变化时触发,在surfaceCreated调用后该函数至少会被调用一次. surfaceCreated:Surface创建时触发,一般在这个函数开启绘图线程(新的线程,不要

  • Android实现视频弹幕功能

    本文实例为大家分享了Android视频弹幕的具体代码,供大家参考,具体内容如下 效果图: 上图:代码随机生成的弹幕及弹幕输入栏 下图:绿色框的弹幕为用户手动添加发送的弹幕 1.准备工作 准备一个视频文件,将该视频文件放到res/raw目录下. 需要将视频设置为横屏播放,即往配置文件中添加android:screenOrientation="landscape": <activity android:name=".MainActivity" android:co

  • 使用SurfaceView实现视频弹幕

    本文实例为大家分享了SurfaceView视频弹幕展示的具体代码,供大家参考,具体内容如下 全部代码如下: package com.example.app2; import android.graphics.Canvas; import android.graphics.Color; import android.graphics.Paint; import android.graphics.PixelFormat; import android.graphics.PorterDuff; imp

  • python3写爬取B站视频弹幕功能

    需要准备的环境: 一个B站账号,需要先登录,否则不能查看历史弹幕记录 联网的电脑和顺手的浏览器,我用的Chrome Python3环境以及request模块,安装使用命令,换源比较快: pip3 install request -i http://pypi.douban.com/simple 爬取步骤: 登录后打开需要爬取的视频页面,打开开发者工具台,Chrome可以使用F12快捷键,选择network监听请求 点击查看历史弹幕,获取请求 其中rolldate后面的数字表示该视频对应的弹幕号,返

  • JS实现的视频弹幕效果示例

    本文实例讲述了JS实现的视频弹幕效果.分享给大家供大家参考,具体如下: <!DOCTYPE html> <html lang="zh-CN"> <head> <meta http-equiv="Content-Type" content="text/html; charset=UTF-8"> <meta charset="utf-8"> <title>斗鱼

  • javascript实现视频弹幕效果(两个版本)

    本文实例为大家分享了javascript实现视频弹幕效果的具体代码,供大家参考,具体内容如下 基础版本 <!DOCTYPE html> <html lang="en"> <head> <meta charset="utf-8"> <style> * { margin: 0; padding: 0; } .dm { width: 800px; height: 600px; background-color:

  • jquery实现直播视频弹幕效果

    JQ实现弹幕效果,快来吐糟你的想法吧 代码如下,复制即可使用: <!DOCTYPE html> <html> <head> <meta charset="utf-8" /> <title>JQ实现弹幕效果</title> <style type="text/css"> *{ padding: 0; margin: 0; } #box{ height:700px; width:1000

  • 微信小程序视频弹幕发送功能的实现

    1. 目录结构 2. videoDanmu <!-- 视频区域 --> <video src="{{src}}" id='video' danmu-btn enable-danmu danmu-list="{{ danmuList }}" > </video> <!-- 弹幕发送区域 --> <view class='sendDanmu'> <textarea name="" id

  • 微信小程序视频弹幕位置随机

    本文实例为大家分享了微信小程序视频弹幕位置随机的具体代码,供大家参考,具体内容如下 最近更新开发工具之后,微信小程序视频播放弹幕不再自动随机,所以就用了一个比较取巧的方法(多条空弹幕和自己要发送的弹幕一起发送,利用随机数控制顺序就行了); wxml代码 <!--pages/study/video/videoplay/videoplay.wxml--> <view class="page-body"> <view class="page-secti

  • JavaScript css3实现简单视频弹幕功能

    本文尝试写了一个demo模拟了最简单的视频弹幕功能. 思路: 设置一个<div>和所播放的video的大小一致,把这个div标签蒙在video上面用于放置弹幕.在video的右边放一个<ul>列表用于显示弹幕列表. 屏幕上面的弹幕,把内容放在<span>标签里面,一般一行字都是从左边飞到右边, 为了简单起见,这个移动就用了CSS3 的transition 属性.position设置为absolute, 那么就用的transition过度left属性,实现弹幕的移动.当然

随机推荐