弹幕视频设计网站12------绘制弹幕02

        大家好，我是爱你三千遍斯塔克，之前我们讨论了一个视频弹幕绘制弹幕的配置环境是怎样的，后来看了一下资料，感觉还挺复杂的，这里有一些资料，里有些资料可供大家参考，希望对大家有帮助。学习交流群：293911833，有遇到问题的，可以加一下群，大家互相交流，一起进步

1、设计一个初始化轨道，然后弹幕能够在这些轨道中进行初始化滚动，轨道是通过初始行进行滚动的

2、接下来我们给弹幕进行一个封装

3、把类封装到一个地方：

4、我们把弹幕的数据，封装到initTest里面

5、这里的参数，是要传给前端的参数

6、初始化弹幕数据对象

7、第一个是弹幕值

8、如果还在highwayAmount，就说明这个列表里面没有被占用，如果highwayAmount不是空的话，还有轨道可以发送

9、把0下标的值传给top，这里的left是用来设置弹幕所在的位置

10、上一秒是这样的，下一秒让left减掉这个数值

11、让他进行左边的一个位移，把左边给删掉

12、他的宽度就是0的基础上，加上这个canvas的宽度

13、定义起点和颜色

14、这里定义一下弹幕的速度

15、

16、用这个方法

17、是否是占用状态

18、当我们调用方法的时候，我们就可以让我们属性值，在我们屏幕中进行显示

19、当我们创建好Barrage这个类的时候

20、把我们的颜色和文字储存到弹幕里面

21、写一个方法，这个方法可以在video中进行调用

22、这里点击发送，弹幕会出现在网站上

23、这里有一个完成绘画标志，这里的false的意思是当我们还没有使用视频的弹幕的时候

24、在没有开始的时候，我们先存储到待发送的弹幕当中

25、如果是ture，我们就可以有没有轨道可以通过

26、利用addTest来插入我们讲述的弹幕

27、判断一下前后轨道，是否前后轨道被占用

28、删掉轨道给top

29、当他不占用的时候，又还给

30、这里的弹幕就可以初始化信息了

31、把他插入一个等待发送的弹幕

32、如果不是绘画的状态

33、既然我们已经希望把弹幕列表放进去，我们就可以把我们弹幕列表中拿出我们的数据，在画板上进行一个绘画和绘制，来实现我们想要达到的效果：已经进入绘画状态了，现在

34、调动runBarrag，

35、把我们第0个轨道数，弹幕全部拿出来

36、这个val就是我们拿来的每个值

37、把我们发送的对象

38、可以进入绘画状态的弹幕之后，我们就可以进行绘制了，首先绘制

39、每次都要进行一个位移，之前的弹幕，我们就可以给他删除掉

40、

41、三个状态

42、先获取左边的值

43、再获取他的宽度

44、如果i没有满足条件，就先把i剔除掉

45、继续绘制我们的弹幕

46、设置弹幕颜色和位置