bilibili高級彈幕代碼初階教程.doc

《bilibili高級彈幕代碼初階教程.doc》由會員上傳分享，免費(fèi)在線閱讀，更多相關(guān)內(nèi)容在教育資源-天天文庫。

1、目錄第一章初步了解高級彈幕1.1變量1.2創(chuàng)建文本彈幕對象1.3彈幕對象運(yùn)動的設(shè)置1.4繪圖彈幕對象創(chuàng)建以及設(shè)置1.4.1顏色樣式設(shè)置1.4.1.1beginFill指定一種顏色進(jìn)行填充1.4.1.2lineGradientStylebeginGradientFill指定一種線條樣式,填充樣式的漸變1.4.1.3lineStyle指定線條樣式1.4.2圖形的繪制1.4.2.1繪制一條直線1.4.2.2繪制一條二次貝塞爾曲線1.4.2.3繪制一個圓1.4.2.4繪制一個橢圓1.4.2.5繪制一個矩形1.4.2.5繪制一個圓角矩形第二章使用其他工具2.1Ut

2、ils工具庫2.1.1hue將0-360的值映射到色相環(huán)2.1.2rgb將RGB值映射到色彩值上2.1.3formatTimes格式化播放時間2.1.4timer延遲執(zhí)行函數(shù)2.1.5interval定時重復(fù)執(zhí)行函數(shù)2.1.6distance計(jì)算坐標(biāo)距離2.1.7rand返回一個前閉后開的整數(shù)2.2Function函數(shù)的創(chuàng)建與使用2.3播放器控制2.3.1視頻時間跳轉(zhuǎn)至2.3.2跳轉(zhuǎn)到指定av號指定頁視頻第一章初步了解高級彈幕1.1第一節(jié)變量廢話不多說.我們先來看一句最基本的彈幕.vara=1;首先一次個關(guān)鍵字是”var”.該關(guān)鍵字的意思就是聲明一個變量

3、.變量說的簡單點(diǎn)就是在后面的過程中可以給“a”重新賦值.然后就是變量名”a”了,這玩意理解成名字就行了.至于關(guān)于變量名的規(guī)則有些關(guān)鍵字與保留字是不允許創(chuàng)建的.保留字，關(guān)鍵字第三個是運(yùn)算符”=”,首先等于號并不是數(shù)學(xué)中的等于意思.而是給聲明的變量a賦值.將等號右邊的值賦予給左邊.第四個”1”就是一個值了.結(jié)尾的分號表示該語句結(jié)束.看到這里相信大家已經(jīng)對這句彈幕有了基礎(chǔ)的了解.這句話的意思就是：聲明變量”a”并且初始化其值為數(shù)字1.寫高級彈幕的時候請嚴(yán)格注意大小寫.var變量名=表達(dá)式;1.2第二節(jié)創(chuàng)建文本彈幕對象.首先要知道bili的播放器的大小.像素為單

4、位.正常模式：寬541高384寬屏模式：寬950搞528全屏模式與網(wǎng)頁全屏模式根據(jù)顯示器分辨率來確定.在高級彈幕中在實(shí)際彈幕時間會在發(fā)布時間軸填寫的時間基礎(chǔ)上減去約0.2秒.所以請注意時間軸的問題高級彈幕中創(chuàng)建新的文本彈幕對象要用到createComment（"",{}）這個語句.請看實(shí)例vara=$.createComment("text",{x:100});該彈幕的意思就是創(chuàng)建一個變量a并創(chuàng)建一個新彈幕對象賦于a.我們可以這么理解createComment.他的括號內(nèi)有2個參數(shù).”text”是彈幕內(nèi)容.｛x:100｝是該彈幕參數(shù)x軸上的位置是100.

5、當(dāng)然括號內(nèi)的不可能只有x這一個參數(shù).我們可以用到的有.x—新創(chuàng)建元件的X軸座標(biāo)y—新創(chuàng)建元件的Y軸座標(biāo)z—新創(chuàng)建元件的Z軸座標(biāo)lifeTime—元件的生存時間(以秒為單位)注：一旦設(shè)置不可更改alpha—元件的透明度color—文字類元件的色彩fontsize—文字類元件的大小parent—元件的父元件(進(jìn)階應(yīng)用)motion—元件移動策略scale—縮放那么我們來定義一個稍微復(fù)雜點(diǎn)的高級彈幕.例：varc=$.createComment("text",{x:100,y:100,lifeTime:10,fontsize:20,color:0x666666

6、,alpha:0.8});(注：參數(shù)之間以英文逗號區(qū)分,最后一個參數(shù)結(jié)尾無逗號)大家可以預(yù)覽一下這條彈幕.就是在x軸100,y軸100的位置創(chuàng)建一個內(nèi)容是text的彈幕.該彈幕生存時間為10秒.字體大小為20號.十六進(jìn)制顏色為灰色.透明度0.8.那么.到了這里大家應(yīng)該已經(jīng)知道怎么去在一個點(diǎn)創(chuàng)建彈幕并設(shè)置該彈幕各項(xiàng)參數(shù).接下來就來說一下在創(chuàng)建后各項(xiàng)屬性的更改與設(shè)置.現(xiàn)在.聲明變量c并創(chuàng)建了一個彈幕內(nèi)容為"測試"的彈幕.它的x軸為50,y軸為100.例：varc=$.createComment("測試",{x:50,y:100});那么如果我們現(xiàn)在需要讓他的

7、位置x軸不變y軸變更到50.那么我們這個時候就需要直接更改彈幕的某一個參數(shù).只需要在彈幕后面加上.c.y=50;（注：更改顏色的語句不是c.color而是c.textColor.注意大小寫）此外還有比較常用的就是旋轉(zhuǎn)3個軸的設(shè)置.c.rotationX,rotationY,rotationZ.例:c.rotationX=90;另還有些參數(shù)也可以設(shè)置.詳細(xì)參考訓(xùn)練題：1.聲明變量c并創(chuàng)建一條彈幕對象.其內(nèi)容為空.其屬性為X軸為270.Y軸為190.生存時間5秒.字體顏色為0xff0000,透明度為0.5.字體大小為15號.2.更改c的x軸位置為200.透明

8、度更改為1.顏色為0xfff000.1.3彈幕對象運(yùn)動的設(shè)置在上一個章節(jié)中學(xué)習(xí)了