.NET斗鱼直播弹幕客户端(下)

在上篇文章中,我们提到了如何使用.NET连接斗鱼TV直播弹幕的基本操作。然而想要做得好,做得容易扩展,就需要做进一步的代码整理。

本文将涉及以下内容:

  • 介绍如何使用Reactive ExtensionsRx),演示这一系列操作用起来,就像写Hello World一样简单;
  • 用我自制的“准游戏引擎”FlysEngine,只需少量代码,即可实现桌面弹幕的效果;
  • 最后提供一波“伸手党”福利,文中所有可运行、完整代码,将按原样奉上。

Rx.NET

Rx,是Reactive Extensions的缩写,据说Rx发明于.NET 2.0时代的微软。那时候还没有async/await。后来,也许由于RX对编程语言要求不高(如不要求内置协程-coroutine),RX反倒在.NET之外的其它编程语言中大行其道。如rx.jsRxJava等等。

C#.NET 2.0就提供了yield关键字,然后3.0提供了LINQ5.0提供了async/await,因此很多时候RX的意义不大。但在某些情况下(如这种情况),就有意义了,原因请见下图:

同步TIEnumerable<T>
异步Task<T>Observable<T>/IAsyncEnumerable<T>

C#协程支持同步多数据,异步单数据,但不支持异步多数据(C# 8.0现在已经支持IAsyncEnumerable<T>),本文将使用Rx来包装上一篇文章的斗鱼TV直播弹幕客户端。

来先看一波老代码:

.NET斗鱼直播弹幕客户端(下)-LMLPHP

注意剪头所指的位置,那是基础代码“出口”,或者业务逻辑“入口”,基础代码不能简单地return打断,因为它要不停地输出数据,这时就需要像协程等编程语言功能,或者Rx的支持。

Rx-Hello World

首先引入NuGetSystem.Reactive,一个简单的“异步多值返回”的Rx示例代码如下:

Observable.Create<int>(async (o, cancellationToken) =>
{
for (var i = 0; i < 5; ++i)
{
await Task.Delay(1000);
o.OnNext(i);
}
o.OnCompleted();
})

麻雀虽小,五脏俱全,如代码所示,几乎只需在正常代码外包一层Rx,即可享受Rx的好处。

使用Rx

使用起来就更简单了,上篇展示的长达252行代码的demo,现在只需一行代码,即可无侵入式地调用:

DouyuBarrage.ChatMessageFromUrl("https://www.douyu.com/scboy")

调用结果如下(和昨天效果完全一样):

.NET斗鱼直播弹幕客户端(下)-LMLPHP

Rx的其它好处

除了调用简单之外,Rx的扩展也非常非常简单,比如完成以下操作,以前可能非常麻烦,需要改多处代码,而使用Rx,只需像LINQ一样加几个指令即可:

同时抓多个直播间的弹幕

#load ".\barrage.linq"
DouyuBarrage.ChatMessageFromUrl("https://www.douyu.com/scboy")
.Select(x => new { Room = "scboy", Message = x.Message })
.Merge(DouyuBarrage.ChatMessageFromUrl("https://www.douyu.com/topic/lscs?rid=633019")
.Select(x => new { Room = "lalala", Message = x.Message}))

效果如下:

.NET斗鱼直播弹幕客户端(下)-LMLPHP

只需一个Merge指令即可合并两个直播间的弹幕(Observable<T>

扩展简单

比如只想提取特殊的弹幕,或者数据之前想做一些转换,可以使用WhereSelect等数据过滤和转换操作符,符合LINQ的习惯,非常好用。比如我正常弹幕的提取,其实是从JObjectFromUrl转换而来,JObjectFromUrl,又是从RawFromUrl转换而来,这提高了扩展性,又无需修改老代码,正是所谓“对扩展开放,对修改封闭”的开放-封闭原则:

public IObservable<JToken> JObjectFromUrl(string url)
=> RawFromUrl(url).Select(MsgTool.DecodeStringToJObject); public IObservable<Barrage> ChatMessageFromUrl(string url) =>
JObjectFromUrl(url)
.Where(x => x["type"].Value<string>() == "chatmsg")
.Select(Barrage.FromJToken);

又比如可能我只想提取彩色弹幕,我只需ChatMessageFromUrl().Where(x => x.Color != 0xffffff)即可,非常方便。

桌面弹幕

这可能是另一个主题——实时渲染,用到了我自己写的“准游戏引擎”FlysEngine,因此需要安装NuGet包:FlysEngine.Desktop

桌面弹幕不同于网页弹幕,只能在网页中显示,而桌面弹幕可以直接显示在屏幕最上方。有些公司年会可能用到了桌面弹幕,这无疑增加了主持人与观众们的互动,提高了群众参与的积极性。

桌面弹幕的要点

  • 渲染文字 DirectWrite
  • 文字移动 将文字从屏幕右边移动到左边;
  • 检测是否离开屏幕 如果屏幕上不显示弹幕,即可将弹幕删除;
  • 初始位置确定 如果一行显示不下,则将弹幕放在下一行。

渲染文字

渲染文字一般是通过DirectWrite,它性能很好,功能也强大。FlysEngineDirectWrite封装了,因此直接用便是。

文字移动

文字移动首先需要一个位置,随着时间变化,将该位置的X坐标不段减少即可。这可以通过FlysEngine中的UpdateLogic事件实现,它会定期调用,传入一个float dt,代码离上一次调用UpdateLogic的时间间隔。因此可以利用这个dt变量,计算是弹幕的新位置:

public void MoveLeft(float dt, float speed)
{
Position.X -= dt * speed;
}

检测是否离开屏幕

由于我们已知弹幕是矩形,(很显然屏幕也是矩形)因此这个检测比较简单,直接判断文字的右边缘是否大于0即可。

也由于需要经常/频繁地删除在屏幕上的弹幕对象,因此最好储存弹幕的数据结构别使用O(n)的集合,如最好别使用List<T>,它是线性表。我这里使用的是链表.NET的链表实现是LinkedList<T>(很多人以为是List<T>)。

多说一句,链接的遍历算法如下(while循环):

var node = barrages.First;
while (node != null)
{
var next = node.Next;
// do work here
node = next;
}

之所以不使用foreach来遍历,因为这样遍历可以实现高性能的“边遍历、边删除”的实现。

初始位置确定

这一点思想需要多想想,需要从第一行开始,从后往前看,看最后那一边弹幕是否大于屏幕右边。只要想清楚了,代码很容易:

float GetNewY()
{
float y = 0;
while (barrages.Reverse().Where(x => x.Position.Y == y).Select(x => x.Rect.Right).FirstOrDefault() > form.Width)
{
y += FontSize;
}
return y;
}

有了这些,就可以愉快地感受屏幕弹幕啦!

彩色emoji表情

Direct2D支持——但默认不显示弹幕emoji表情:

.NET斗鱼直播弹幕客户端(下)-LMLPHP

需要多加一个枚举让其支持:

target.DrawText("
05-26 11:35