webview chromium v48 h5 video上屏过程详解

前段时间网上有同学问h5 video不显示图像问题。我好像误导别人了。最近刚好有机会看这块，就仔细梳理了下。

这篇博客分为两部分，第一部分是h5 video 播放器的实现结构，第二部分是h5 video上屏过程的详细剖析。

这部分比想象中复杂，不过梳理清楚这块，对于chromium系统如何跨线程使用texture会有更深的认识，花些精力还比较值得。

第一部分h5 video播放器的实现结构

图中我们可以看到h5 video播放是桥接到java层调用android系统mediaplayer完成的。

第二部分h5 video视频流上屏过程

首先需要明确一点，在webview方案chromium v48版本中，video元素视频流的合成与

网页上其他内容的合成是统一的，并不是单独处理的。区别只在于video元素单独占用的GraphicsLayer在cc端对应的是VideoLayer.

而网页上常规内容占用的GraphicsLayer在cc端对应的是PictureLayer.网页上如果由2dcanvas元素，其在cc端对应的是TextureLayer.

video元素在blink端的对应层GraphicsLayer,与cc端的对应层VideoLayer之间的关系建立过程如图:

VideoLayer创建并被关联到GraphicsLayer的时机在:

WebMediaPlayerAndroid::OnVideoSizeChanged().

video元素单独占用的GraphicsLayer和网页上的其他层一样，遍历blink的renderlayer tree会被访问到。

我把video视频源上屏的过程分成4个步骤:

步骤1:承载video内容的texture被创建的过程；

步骤2:步骤1中创建的承载video内容的texture