iOS彈幕組件LNDanmakuMaster的具體使用

LNDanmakuMaster是一個輕量的彈幕播放器,通過:創建播放器->創建軌道->添加彈幕的方式進行彈幕播放,提供豐富軌道樣式的同時也支持自定義軌道;對傳入的彈幕的視圖層沒有要求(任意的View/Layer);提供多種(目前是3)彈幕分佈策略;支持使用軌道組播放特殊彈幕;提供與分佈策略的對應的彈幕seek策略。

Github鏈接:LNDanmakuMaster

你可以直接下載這個鏈接並運行上面豐富的Demo,或參考Demo代碼實現自己的彈幕播放器,也可以直接使用Cocoapods👇

Cocoapods

pod 'LNDanmakuMaster'

彈幕機制

1.驅動機制
視頻播放器的刷新率通常為29frame/s,彈幕播放器采用同樣的刷新頻率會有卡頓感,因此彈幕播放器通常使用自己的刷新驅動,要麼是UIView animation,要麼是CADisplayLink;CADisplaylink支持更多的細節、進度控制,因此這裡我們選用的是CADisplayLink。
LNDanmakuClock是這樣一個驅動,封裝瞭CADisplayLink,增加瞭一些暫停、銷毀的控制方法,這個時鐘每次的輸出就是從上一次DisplayLink回調到這次displayLink回調的一小段時間。

2.進度控制機制
LNDanmakuMaster整體采用時間定義進度,這也是它與其他彈幕框架的主要區別之一,我們的所有進度控制、追趕控制、繁忙度控制,都是使用時間計算的。
使用時間變量替代空間變量的優勢包括:

  • 如果你的軌道路線並非直線:如果你希望一個彈幕既可以在水平軌道播放也可以在圓形軌道播放,既要給出角速度,也要給出線速度,如果使用時間單位,隻需要給出運行的總時間。
  • 如果你先控制一個曲線軌道兩條彈幕之間的間距,空間間距需要計算曲線的長度,而對時間間距來說處理起來就和直線一樣。
  • 在做一些判斷時,如果使用空間條件做判斷,則需要進行速度、時間相關大量乘除法運算,使用時間可能隻需要加減法,雖然我不知道具體是否有優勢,但直觀上感覺乘除法是沒有加減法快的。
  • 如果是像B站那種中間出現一列的彈幕,它不需要速度,隻需要顯示的時間就夠瞭。

總之,使用時間體系替代速度體系,是能統一多種軌道進度控制的一個好方法。

3.刷新機制
根據Clock的輸出,我們可以得到一個穩定的回調得知剛剛經過瞭多長一段時間,那麼彈幕的刷新過程就成為:在彈幕的剩餘存活時間中扣除剛剛經過的那段時間,並根據扣除後的剩餘時間占總時間的百分比來刷新彈幕的位置、大小等信息。
經過以上三個主要機制的介紹,已經有瞭實現一個彈幕框架的所有主要邏輯,剩下的就是一些模塊的細分和細節上的雕琢。

模塊分工

LNDanmakuMaster將整個彈幕框架分成以下幾個部分(Abstract代表支持重寫定制):

模塊名稱 類名 備註
播放器 LNDanmakuPlayer 播放器相當於對整個彈幕框架其他組件的整合,對外提供調用方法和時機代理
分發器 LNDanmakuAbstractDispatcher Dispatcher類似管理軌道的工頭兒,根據軌道集合的狀態決定彈幕放到哪裡才是最好的
軌道控制器 LNDanmakuAbstractTrackController 軌道控制器類似一個工人,定期使用工具(Track)維護自己的彈幕,並向Dispatcher反饋自己的(繁忙/空閑)狀態
軌道 LNDanmakuAbstractTrack Track的職責完全符合軌道的定義,它不維護彈幕,隻維護任意一條彈幕彈幕在這個軌道上的刷新的位置、大小、仿射變換等屬性與時間進度的映射,像是一個空間信息與時間信息的函數
樣式 LNDanmakuAbstractAttributes 樣式是彈幕的載體,包含瞭一條彈幕的所有信息,例如:存活時間、位置、攜帶的業務模型、展示時使用的View/Layer等等。對,沒錯,與CollectionViewAttributes十分類似,並根據播放器特性增加瞭時間戳信息

額外的組件

模塊名稱 類名 備註
軌道組 LNDanmakuTrackGroup 這個組件是用來做一些特殊彈幕播放的,是類似一個Player的更小單元(但沒有自己的驅動),內部包含瞭一個Dispatcher和若幹TrackController

這個組件的意義:
某些彈幕播放對軌道有一定的要求,又或是軌道對自己播放的彈幕有一定要求,例如:送禮物的軌道隻能出現在屏幕頂端,而不是中央,來避免影響用戶觀看視頻;或者是,圓形的軌道不能那些較長的文字,這樣它看起來就不是那麼圓瞭,等等。
一但從兩個方面考慮這個問題,就會陷入:軌道挑選彈幕/彈幕挑選軌道的困境,而實際上兩種情況是都存在的,這兩個問題最後統一使用軌道組解決,用戶指定一個軌道的分組,並可以跨過Player層,直接向這個軌道組拋彈幕,那麼這個彈幕就隻有可能出現在這個軌道組包含的軌道中;這個功能在Demo中一個彩虹樣式的軌道中得以體現,我將七種顏色的彈幕分別拋入七個軌道組中(每個軌道組有三根軌道,兩個相鄰的軌道組公用中間那個重合的軌道),這樣它們就呈現除瞭一種彩虹的效果。

使用示例

以上介紹完瞭這個框架的所有重要組件,這裡舉例介紹構建一個最簡單彈幕播放器的過程:
1.懶加載一個danmakuPlayer:
這個是起碼要做,不需要做任何配置它就可以正常工作

- (LNDanmakuPlayer *)danmakuPlayer
{
  if (!_danmakuPlayer) {
    _danmakuPlayer = [[LNDanmakuPlayer alloc] init];
  }
  return _danmakuPlayer;
}

2.把這個播放器的容器View加到屏幕上:

  [self.view addSubview:self.danmakuPlayer.containerView];

3.給這個Player加一些軌道:
Player支持自定義就是主要體現在自定義軌道和彈幕樣式上,所以,所有的軌道都是你親手加上去的,你可以在init/viewDidLoad等初始化的時機做這個時,也可以在Player懶加載時一並加好

- (void)addTrack
  for (int i = 0; i < 20; i++) {
    LNDanmakuHorizontalMoveTrackController *horizontalTrackController = [[LNDanmakuHorizontalMoveTrackController alloc] init];
    horizontalTrackController.horizontalTrack.startPosition = CGPointMake(0, 44.f + 30.f * i);
    horizontalTrackController.horizontalTrack.width = self.view.frame.size.width;
    horizontalTrackController.spaceTimeInterval = 0.f;
    [self.danmakuPlayer addTrack:horizontalTrackController];
  }
}

4.讓播放器動起來!
現在這個播放器就可以從外界接口隨便一個彈幕並播放在屏幕上瞭

- (void)startPlay {
  [self.danmakuPlayer start];
}

5.讓我們嘗試放一個簡單的彈幕放上去:

(void)addRandomDanmaku
{
LNDanmakuAttributes *attributes = [[LNDanmakuAttributes alloc] init];
UIView *colorView = [[UIView alloc] init];
colorView.backgroundColor = [UIColor redColor];
attributes.presentView = colorView;
attributes.trackTime =4.f;
attributes.size = CGSizeMake(88.f, 44.f);
[_player insertAttributes:@[attributes]];
}

這個框架盡量使用最符合正常邏輯的方法定義瞭每個組件的分工來保證它使用起來是最舒服的,並盡可能封裝瞭那些看起來比較復雜的邏輯:分發、刷新、追趕等等;當然,我覺得一個合理的框架應該是下限很低,上限也很高的,而不是一成不變使用規則(正如掌控疾風的某位男子應該算得上是設計得比較成功的角色),所以,當使用者需要深入探討這些邏輯的時候,也可以從外部輕易定制他們,玩出自己的特色。

後續會陸續更新一些使用上或是原理方面的文章介紹這個框架,雖然實現起來沒有很多高超的技巧,但我認為代碼優秀與否並非取決於使用瞭多麼高深或是精妙的語言特性,而是寫代碼的邏輯和思路;而且,我從心底十分抵制那些沒什麼復雜邏輯卻要制定很多使用規則的組件(更惡心的是還要業務線強推),所以這個組件一定會朝著盡量少的使用規則、盡量樸素的代碼、更豐富的功能方向發展。

最後附上幾個Demo中的效果圖

橫向的軌道

pop動畫軌道

波浪軌道+軌道分組

心形軌道

到此這篇關於iOS彈幕組件LNDanmakuMaster的具體使用的文章就介紹到這瞭,更多相關iOS彈幕組件LNDanmakuMaster內容請搜索WalkonNet以前的文章或繼續瀏覽下面的相關文章希望大傢以後多多支持WalkonNet!

推薦閱讀: