@@ -12,22 +12,43 @@ No matter how complex the layout is and how deep the constraints are, it has alm
1212performance as a single Flex or Stack. When facing complex layouts, it provides better performance,
1313flexibility, and a very flat code hierarchy than Flex and Stack. Say no to 'nested hell'.
1414
15+ In short, once you use it, you can't go back.
16+
17+ Improving "nested hell" is one of my original intentions for developing Flutter ConstraintLayout,
18+ but I don't advocate the ultimate pursuit of one level of nesting, which is unnecessary. So features
19+ like chains are already well supported by Flex itself, so ConstraintLayout will not actively support
20+ it.
21+
1522View [ Flutter Web Online Example] ( https://constraintlayout.flutterfirst.cn )
1623
1724** Flutter ConstraintLayout has extremely high layout performance. It does not require linear
18- equations to solve. It is recommended to use ConstraintLayout at the top level. For extremely
19- complex layout(One thousand child elements, two thousand constraints), layout and drawing total time
20- within 5 milliseconds(debug mode on Windows 10,release mode take less time), the frame rate can be
21- easily reached 200 fps.**
25+ equations to solve.** At any time, each child element will only be laid out once. When its own width
26+ or height is set to wrapContent, some child elements may calculate the offset twice. The layout
27+ process of ConstraintLayout consists of the following three steps:
28+
29+ 1 . Constraint calculation
30+ 2 . Layout
31+ 3 . Draw
32+
33+ The performance of layout and drawing is almost equivalent to a single Flex or Stack, and the
34+ performance of constraint calculation is roughly 0.01 milliseconds (layout of general complexity, 20
35+ child elements). Constraints are only recalculated after they have changed.
36+
37+ It is recommended to use ConstraintLayout at the top level. For extremely complex layout(one
38+ thousand child elements, two thousand constraints), layout and drawing total time within 5
39+ milliseconds(debug mode on Windows 10,release mode take less time), the frame rate can be easily
40+ reached 200 fps.
2241
2342** If not necessary, try to be relative to the parent layout, so that you can define less id. Or use
2443relative id.**
2544
2645** Warning** :
2746For layout performance considerations, constraints are always one-way, and there should be no two
28- child elements directly or indirectly restrain each other. Each constraint should describe exactly
29- where the child elements are located. Although constraints can only be one-way, you can still better
30- handle things that were previously (Android ConstraintLayout) two-way constraints, such as chains.
47+ child elements directly or indirectly restrain each other(for example, the right side of A is
48+ constrained to the left side of B, and the left side of B is in turn constrained to A right). Each
49+ constraint should describe exactly where the child elements are located. Although constraints can
50+ only be one-way, you can still better handle things that were previously (Android ConstraintLayout)
51+ two-way constraints, such as chains(not yet supported, please use with Flex).
3152
3253Anyone who sends you a harassing message, you can send him Flutter code and use 'nested hell' to
3354insult him:
@@ -189,12 +210,12 @@ dependencies:
189210 flutter_constraintlayout :
190211 git :
191212 url : ' https://github.com/hackware1993/Flutter-ConstraintLayout.git'
192- ref : ' v1.0.2 -stable'
213+ ref : ' v1.0.3 -stable'
193214` ` `
194215
195216` ` ` yaml
196217dependencies :
197- flutter_constraintlayout : ^1.0.2 -stable
218+ flutter_constraintlayout : ^1.0.3 -stable
198219` ` `
199220
200221` ` ` dart
0 commit comments