弹幕视频设计网站16------------弹幕暂停与调节进度条

简介: 弹幕视频设计网站16------------弹幕暂停与调节进度条


1、之后,我们添加这两个功能,弹幕暂停与调节进度条:

1.1 第一个是点击暂停,他就能够暂停

1.2 这个时候我们要把弹幕启动起来,跟之前是一样的

1.3 定义两个组件

2、写上两个方法,想想怎么能够让弹幕停止绘制

3、每次调用的时候,都会让递归减2

4、如果是true的话,我们就不让他绘画,改为flase就不自动绘画了

5、我们先获得barrage这个对象,可以看到对象的

6、点击暂停,就实现暂停了,点击绘画,就实现绘画了

7、点击暂停,就暂停了,但是却出现了一个问题, 点击开始就不动了,这是为什么呢?

8、这个弹幕,我们需要调用一下drawBarrage这个方法

9、我们只需要调用一下方法就行

10、现在已经成功了

11、现在解决新的问题,拖拽一下进度条之后,弹幕就再也不出现了,这里怎么解决,我们的预想是我们弹幕往前滑动的时候,当我们的弹幕往后滑动是无所谓的,因为往后滑动是无所谓的,一定是没有出现过的,因此我们要判定自己字符条的行为到底是往前还是往后。

12、只要调动的时间小于刚才滑动的时间就行了,我们就调动刚才滑动的函数

13、先定义一个lastTime的函数

14、 将我们保存在last-time这个时间,保存到我们的属性当中

15、全部都改成0就可以

16、往前滑动也仍然出现

17、添加弹幕清除功能

18、现在已经成功了

19、将弹幕改为未使用的状态

20、此刻弹幕进度条修改好了

相关文章
|
3天前
|
数据库
视频弹幕设计网站10-----弹幕列表信息获取
视频弹幕设计网站10-----弹幕列表信息获取
视频弹幕设计网站10-----弹幕列表信息获取
|
2天前
|
Web App开发 编解码 资源调度
在阿里云直播解决方案中,当使用ARTC协议观看直播并进行清晰度切换时出现画面卡顿或马赛克现象,可能存在以下几种原因
【6月更文挑战第30天】阿里云直播中,ARTC协议下清晰度切换出现卡顿或马赛克可能由网络带宽、缓冲策略、转码效率、播放器解码、协议特点及服务器资源调度引起。解决措施包括优化网络、智能切换算法、播放器与服务器优化。通过监控和日志分析定位问题,参照官方最佳实践进行优化。
12 1
|
3天前
|
存储 前端开发 JavaScript
视频弹幕设计网站11-----绘制弹幕
视频弹幕设计网站11-----绘制弹幕
|
3天前
|
存储 前端开发
弹幕视频设计网站12------绘制弹幕02
弹幕视频设计网站12------绘制弹幕02
|
3天前
|
前端开发 JavaScript
弹幕视频设计网站13---------绘制弹幕03
弹幕视频设计网站13---------绘制弹幕03
|
3天前
|
JavaScript 数据库
视频弹幕设计网站08-------video样式
视频弹幕设计网站08-------video样式
|
3天前
|
前端开发 JavaScript
视频弹幕设计网站07-----------创建video
视频弹幕设计网站07-----------创建video
|
2月前
|
XML Java 调度
Android开发音效增强中铃声播放Ringtone及声音池调度SoundPool的讲解及实战(超详细 附源码)
Android开发音效增强中铃声播放Ringtone及声音池调度SoundPool的讲解及实战(超详细 附源码)
146 0
|
小程序 开发者
微信小程序开发之视频播放器带弹幕Video弹幕颜色自定义(有图有源码)
微信小程序开发之视频播放器带弹幕Video弹幕颜色自定义(有图有源码)
137 0
|
移动开发
【H5 音乐播放实例】第四节 音乐详情页制作 -音乐的播放和暂停
【H5 音乐播放实例】第四节 音乐详情页制作 -音乐的播放和暂停
125 0