接着我们先看 ConstrainedBox
源码,从下图源码可以看出,它是继承了 SingleChildRenderObjectWidget
,关键是 override 了 createRenderObject
方法,返回了 RenderConstrainedBox
。
这里体现了第六篇中的 Widget 与 RenderObject 的关系
是的,RenderConstrainedBox
就是继承自 RenderBox
,从而实现RenderObject
的布局,这里我们得到了它们的关系如下 :
Widget | RenderObject |
---|---|
ConstrainedBox | RenderConstrainedBox |
然后我们继续对其他每个 Widget 进行观察,可以看到它们也都是继承SingleChildRenderObjectWidget
,而“简单来说”它们不同的地方就是 RenderObject
的实现了:
Widget | RenderBox (RenderObject) |
---|---|
Align | RenderPositionedBox |
Padding | RenderPadding |
Transform | RenderTransform |
Offstage | RenderOffstage |
所以我们可以总结:真正的布局和大小计算等行为,都是在 RenderBox
上去实现的。 不同的 Widget 通过各自的 RenderBox
实现了“差异化”的布局效果。所以找每个 Widget 的实现,找它的 RenderBox
实现就可以了。(当然,另外还有 RenderSliver
,这里暂时不讨论)
这里我们通过 Offstage
这个Widget 小结下,Offstage
这个 Widget 是通过 offstage
标志控制 child 是否显示的效果,同样的它也有一个 RenderOffstage