Summary: If there is a single child which is flex grow and flex shrink then instead of measuring and then shrinking we can just set the flex basis to zero as we know the final result will be that the child take up all remaining space. This is a re-land of D4147298. I have updated the diff to check explicitly for exact measure mode to also handle at_most case correctly. Reviewed By: gkassabli Differential Revision: D4153133 fbshipit-source-id: 2333150a83857cc30078cc8d52761cbd00652830
38 lines
1.4 KiB
HTML
38 lines
1.4 KiB
HTML
<div id="flex_basis_flex_grow_column" style="width: 100px; height: 100px;">
|
|
<div style="flex-basis: 50px; flex-grow: 1;"></div>
|
|
<div style="flex-grow: 1;"></div>
|
|
</div>
|
|
|
|
<div id="flex_basis_flex_grow_row" style="width: 100px; height: 100px; flex-direction: row;">
|
|
<div style="flex-basis: 50px; flex-grow: 1;"></div>
|
|
<div style="flex-grow: 1;"></div>
|
|
</div>
|
|
|
|
<div id="flex_basis_flex_shrink_column" style="width: 100px; height: 100px;">
|
|
<div style="flex-basis: 100px; flex-shrink: 1;"></div>
|
|
<div style="flex-basis: 50px;"></div>
|
|
</div>
|
|
|
|
<div id="flex_basis_flex_shrink_row" style="width: 100px; height: 100px; flex-direction: row;">
|
|
<div style="flex-basis: 100px; flex-shrink: 1;"></div>
|
|
<div style="flex-basis: 50px;"></div>
|
|
</div>
|
|
|
|
<div id="flex_shrink_to_zero" style="height: 75px;">
|
|
<div style="width: 50px; height: 50px; flex-shrink:0;"></div>
|
|
<div style="width: 50px; height: 50px; flex-shrink:1;"></div>
|
|
<div style="width: 50px; height: 50px; flex-shrink:0;"></div>
|
|
</div>
|
|
|
|
<div id="flex_basis_overrides_main_size" style="height: 100px; width: 100px;">
|
|
<div style="height: 20px; flex-grow:1; flex-basis:50px;"></div>
|
|
<div style="height: 10px; flex-grow:1;"></div>
|
|
<div style="height: 10px; flex-grow:1;"></div>
|
|
</div>
|
|
|
|
<div id="flex_grow_shrink_at_most" style="height: 100px; width: 100px;">
|
|
<div>
|
|
<div style="flex-grow:1; flex-shrink:1;"></div>
|
|
</div>
|
|
</div>
|