【专业领域】QtWebkit里RenderLayer树的绘制详细流程分析

更新:RenderLayer树的绘制对RenderObject的绘制,同时补足绘制阶段的描述。

QtWebkit里,QWebView,QWebPage和QWebFrame的关系如下:

QtWebKit从绘制事件(Qt的paint)发出,到WebCore里面的RenderLayers树的绘制详细流程分析如下。

首先是QWidget收到paintEvent,发送给Qt的QWebView,在QWebView里,创建Qt的画笔QPainter,并基于此画笔创建绘图上下文:GraphicContext,然后使用此画笔再调用Qt的QWebFrame的渲染函数render把这个QWebFrame绘制到裁剪区里。在QWebFrame的render函数里,再调用QWebFramePrivate的绘制相对坐标函数:renderRelativeCoords,后者就会计算每一个裁剪区和QWebView的交集、同时调用FrameView的绘制内容函数:paintContents。

FrameView的paintContents函数内部就会开始绘制RenderLayer--通过paintLayer函数,此函数自己不干活,实际调用的是RenderLayer自己的绘制函数:RenderLayer::paint,此RenderLayer的函数内部又会调用自己的paintLayer函数,这里才是重中之重。

在paintLayer函数里,主要分成三件事:

1 做几何表换:比如平移、翻转、旋转等等;

2 绘制RenderLayer的内容;

3 绘制RenderLayer的反射。

后面两件事情其实都是调用与本RenderLayer关联的RenderObject来绘制,

每一层的绘制都包括:绘制背景、绘制前景、绘制外边框、绘制掩模、

绘制z坐标为负数的RenderLayer、以及z坐标为正数的RenderLayer--即paintList,这paintLayer是递归调用的。具体序列图如下:

原文发布于微信公众号 - 程序员互动联盟(coder_online)

原文发表时间:2015-04-30

本文参与腾讯云自媒体分享计划,欢迎正在阅读的你也加入,一起分享。

发表于

我来说两句

0 条评论
登录 后参与评论

相关文章

来自专栏程序员的诗和远方

一个比想象中更骚气的圆-svg实现

之前写了一篇Canvas画图-一个比想象中更骚气的圆(渐变圆环),其实SVG也可以实现类似的效果,而且两者api惊人的相似。 关于SVG SVG是一种矢量...

3177
来自专栏林德熙的博客

WPF 在 DrawingContext 的 push 如何使用

如果在一个 DrawingContext 画出一个 DrawingVisual ,如何修改这个 DrawingVisual 的大小,对他进行变换?

641
来自专栏进击的君君的前端之路

CSS理解之border

1363
来自专栏柠檬先生

css3 动画应用 animations 和transtions transform在加上JavaScript 可以实现硬件加速动画。

transitions(过渡) 被应用于元素指定的属性变化时,该属性经过一段时间逐渐的过渡到最终想要的值。   主要包括四个属性:     执行变换的属性:...

22110
来自专栏小李刀刀的专栏

深入解析CSS样式层叠权重值

读到《重新认识CSS的权重》这篇,鬼哥在文章最后给出了便于记忆的顺序:“important > 内联 > ID > 类 > 标签 | 伪类 | 属性选择 > 伪...

3146
来自专栏九彩拼盘的叨叨叨

SVG 直线路径写法示例

大写字母表示到后面值为绝对值,小写字母表示后面值为相对当前点的值 画一条起点是(10, 10)终点点是 (20, 30) 的线

814
来自专栏程序你好

CSS盒子(Box)模型入门

无论您是CSS的新手还是经验丰富的老手,了解和理解box模型都很重要。让我们更好地了解它。

1042
来自专栏mySoul

css3动画

此为动画样式中的关键帧,用关键帧来控制css动画中的关键样式。相比较过渡更加的容易空值中间的部分

1024
来自专栏听雨堂

从MapX到MapXtreme2004[11]-坐标概论

        坐标的问题是Mapxtreme中最郁闷的问题,前几天在这上面耗了很多时间,没有搞定,今天又是不得不钻研,还好,小有心得。         1、...

1977
来自专栏前端黑板报

canvas-画线

坐标系统简析 ? 左边是笛卡尔坐标系,右边是canvas坐标系。 笛卡尔坐标系(Cartesian coordinate system): 也称直角坐标系,是一...

2249

扫码关注云+社区