前言
在上篇文章中,我们提到了如何使用 .NET连接斗鱼TV直播弹幕的基本操作。然而想要做得好,做得容易扩展,就需要做进一步的代码整理。
本文将涉及以下内容:
介绍如何使用
ReactiveExtensions(Rx),演示这一系列操作用起来,就像写HelloWorld一样简单;用我自制的“准游戏引擎”
FlysEngine,只需少量代码,即可实现桌面弹幕的效果;最后提供一波“伸手党”福利,文中所有可运行、完整代码,将按原样奉上。
Rx.NET
Rx,是 ReactiveExtensions的缩写,据说 Rx发明于 .NET2.0时代的微软。那时候还没有 async/await。后来,也许由于 RX对编程语言要求不高(如不要求内置 协程- coroutine), RX反倒在 .NET之外的其它编程语言中大行其道。如 rx.js、 RxJava等等。
C#从 .NET2.0就提供了 yield关键字,然后 3.0提供了 LINQ, 5.0提供了 async/await,因此很多时候 RX的意义不大。但在某些情况下(如这种情况),就有意义了,原因请见下图:
| - | 单数据 | 多数据 |
|---|---|---|
| 同步 | T | IEnumerable<T> |
| 异步 | Task<T> | Observable<T>/ IAsyncEnumerable<T> |
C#的 协程支持同步多数据,异步单数据,但不支持同步多数据( C# 8.0现在已经支持 IAsyncEnumerable<T>),本文将使用 Rx来包装上一篇文章的斗鱼TV直播弹幕客户端。
来先看一波老代码:

注意剪头所指的位置,那是基础代码“出口”,或者业务逻辑“入口”,基础代码不能简单地 return打断,因为它要不停地输出数据,这时就需要像 协程等编程语言功能,或者 Rx的支持。
Rx-Hello World
首先引入 NuGet包 System.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")调用结果如下(和昨天效果完全一样):

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}))效果如下:

只需一个 Merge指令即可合并两个直播间的弹幕( Observable<T>)
扩展简单
比如只想提取特殊的弹幕,或者数据之前想做一些转换,可以使用 Where, Select等数据过滤和转换操作符,符合 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。
桌面弹幕不同于 网页弹幕,只能在网页中显示,而 桌面弹幕可以直接显示在屏幕最上方。有些公司年会可能用到了 桌面弹幕,这无疑增加了主持人与观众们的互动,提高了群众参与的积极性。
注意:本文中所说
FlysEngine的实质是Direct2D和WindowsAPI-UpdateLayeredWindowIndirect函数。如果不想使用FlysEngine,完全可以使用其它方式代替。最简单的方式是使用WPF,然后设置AllowsTransparency=true,但这样性能会差一些。本文介绍的方法,CPU使用率将保持在0%左右!
桌面弹幕的要点
渲染文字
DirectWrite;文字移动 将文字从屏幕右边移动到左边;
检测是否离开屏幕 如果屏幕上不显示弹幕,即可将弹幕删除;
初始位置确定 如果一行显示不下,则将弹幕放在下一行。
渲染文字
渲染文字一般是通过 DirectWrite,它性能很好,功能也强大。FlysEngine将 DirectWrite封装了,因此直接用便是。
注意:
DirectWrite不仅渲染文字,还提供了.Metrics属性,可以计算文字渲染之后的大小,这会让事情变得容易很多。
文字移动
文字移动首先需要一个位置,随着时间变化,将该位置的 X坐标不段减少即可。这可以通过 FlysEngine中的 UpdateLogic事件实现,它会定期调用,传入一个 floatdt,代码离上一次调用 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表情:

要多加一个枚举让其支持:
target.DrawText("????????????", res.TextFormats[36], rectangle, res.GetColor(Color.Blue), Direct2D.DrawTextOptions.EnableColorFont); // 重点支持彩色 emoji表情后,效果如下:

结
最终效果昨天已经见过了,如下:

本文(包括上文)所用的代码如下:
| id | 链接 |
|---|---|
| 老式代码 | https://github.com/sdcb/blog-data/blob/master/2019/20191013-douyu-barrage-with-dotnet-2/barrage_tranditional.linq |
| 新式代码 | https://github.com/sdcb/blog-data/blob/master/2019/20191013-douyu-barrage-with-dotnet-2/barrage.linq |
| 合并弹幕 | https://github.com/sdcb/blog-data/blob/master/2019/20191013-douyu-barrage-with-dotnet-2/barrage-combine.linq |
| 桌面弹幕 | https://github.com/sdcb/blog-data/blob/master/2019/20191013-douyu-barrage-with-dotnet-2/desktop-barrage.linq |
喜欢的朋友请“刷一波666???”,并关注我的微信公众号:【DotNet骚操作】
