cl-bullets v0.0.3

bullets

弹幕组件

安装

yarn add cl-bullets

或

npm i cl-bullets --save

React组件

React组件有默认导出，所以组件名字任意，以下代码作为示例

// 导入
import Bullets from 'cl-bullets';

// 使用 
<Bullets ref={(ref)=>{this.bullets = ref}} width={375} height={300} fontSize={12} area={0.5} speed={[1,2]} />
//一条弹幕的格式
this.bullets.add({
    logo: "", 
    text: "我是一条弹幕",
    textColor: "#ffff00",
    background: "rgba(0,0,0,0.3)",
    loop: true,
    border:{
        size: 1,
        color: "red"
    }
});
//or 添加多条弹幕
this.bullets.add([{
    logo: "", 
    text: "我是一条弹幕",
    textColor: "#ffff00",
    background: "rgba(0,0,0,0.3)",
    loop: true,
    border:{
        size: 1,
        color: "red"
    }
}]);
//开始滚动
this.bullets.start()
//停止滚动
this.bullets.stop();
//清空画布
this.bullets.clear();

Vue组件

待开发

属性说明