Painted levels: being fostered fostered fostered

Tags: “Flutter” “Widget” by Mu Linlu Review: QiShare team


WidgetWhat is?

Widgets are configuration data that describe the UI Element Element Element; A Widget can correspond to multiple elements, that is, multiple elements can be generated from the same configuration. Each Element corresponds to a Widget.

abstract class Widget extends DiagnosticableTree { const Widget({ this.key }); final Key key; @protected Element createElement(); . static bool canUpdate(Widget oldWidget, Widget newWidget) { return oldWidget.runtimeType == newWidget.runtimeType && oldWidget.key == newWidget.key; }}Copy the code

Key

Controls how one widget replaces another widget in the tree. If both widgets have the same runtimeType as the key, the new widget replaces the old widget and the Element is updated with a call to element.update. Otherwise, the old element is removed from the tree and the new element is inserted. In addition, using a GlobalKey as the widget’s key allows the Element to be moved in the tree without losing state. When you find that the runtimeType and key of the new widget are different from those of the previous widget at the same location, but there is another widget with the same globalKey as the old widget at another location in the previous frame tree, move the element of that widget to the new location.

createElement

A given widget can be included in the tree zero or more times. In particular, a given widget can be placed in the tree multiple times. Each time a widget is placed into the tree, it is injected into an Element, which means that widgets merged into the tree will be injected multiple times.

canUpdate

Whether the runtimeType and key of the old and new widgets are the same determines whether an element that uses oldWidget as its own configuration can update itself with newWidget. If two widgets do not have keys, they are considered a match, even if children are completely different.

Specific aboutcanUpdateProcessing logic, as shown in the following figure.

Ways to focus on us are:

QiShare(GitHub) QiShare(CocoaChina) QiShare(StackOverflow) QiShare(wechat)

Elements in Flutter

IOS fix [NSURL fileURLWithPath:] # encoding problem Xcode adjust navigation directory font size B Swift 5.1 (21) – Generic Swift 5.1 (20) – protocol Swift 5.1 (19) – Extended Swift 5.1 (18) – Nested type Swift 5.1 (17) – Type conversion and pattern matching