Skip to content
This repository was archived by the owner on Feb 25, 2025. It is now read-only.

Commit a5f6fdb

Browse files
committed
Merge pull request #121 from collinjackson/baseline5
Draw debug rects when flex overflows and debugPaintSizeEnabled
2 parents a548d39 + acd51f8 commit a5f6fdb

File tree

1 file changed

+29
-8
lines changed

1 file changed

+29
-8
lines changed

sky/sdk/lib/rendering/flex.dart

Lines changed: 29 additions & 8 deletions
Original file line numberDiff line numberDiff line change
@@ -92,7 +92,8 @@ class RenderFlex extends RenderBox with ContainerRenderObjectMixin<RenderBox, Fl
9292
}
9393
}
9494

95-
bool _overflowOccurredDuringLayout = false;
95+
// Set during layout if overflow occurred on the main axis
96+
double _overflow;
9697

9798
void setupParentData(RenderBox child) {
9899
if (child.parentData is! FlexBoxParentData)
@@ -325,6 +326,8 @@ class RenderFlex extends RenderBox with ContainerRenderObjectMixin<RenderBox, Fl
325326
}
326327
child = child.parentData.nextSibling;
327328
}
329+
_overflow = math.max(0.0, -freeSpace);
330+
freeSpace = math.max(0.0, freeSpace);
328331

329332
// Steps 4-5. Distribute remaining space to flexible children.
330333
double spacePerFlex = totalFlex > 0 ? (freeSpace / totalFlex) : 0.0;
@@ -362,7 +365,7 @@ class RenderFlex extends RenderBox with ContainerRenderObjectMixin<RenderBox, Fl
362365
child = child.parentData.nextSibling;
363366
}
364367

365-
// Section 8.2: Axis Alignment using the justify-content property
368+
// Section 8.2: Main Axis Alignment using the justify-content property
366369
double remainingSpace = math.max(0.0, freeSpace - usedSpace);
367370
double leadingSpace;
368371
double betweenSpace;
@@ -389,20 +392,16 @@ class RenderFlex extends RenderBox with ContainerRenderObjectMixin<RenderBox, Fl
389392
break;
390393
}
391394

392-
Size desiredSize;
393395
switch (_direction) {
394396
case FlexDirection.horizontal:
395-
desiredSize = new Size(mainSize, crossSize);
396-
size = constraints.constrain(desiredSize);
397+
size = constraints.constrain(new Size(mainSize, crossSize));
397398
crossSize = size.height;
398399
break;
399400
case FlexDirection.vertical:
400-
desiredSize = new Size(crossSize, mainSize);
401401
size = constraints.constrain(new Size(crossSize, mainSize));
402402
crossSize = size.width;
403403
break;
404404
}
405-
_overflowOccurredDuringLayout = desiredSize != size;
406405

407406
// Position elements
408407
double childMainPosition = leadingSpace;
@@ -449,7 +448,7 @@ class RenderFlex extends RenderBox with ContainerRenderObjectMixin<RenderBox, Fl
449448
}
450449

451450
void paint(PaintingCanvas canvas, Offset offset) {
452-
if (_overflowOccurredDuringLayout) {
451+
if (_overflow > 0) {
453452
canvas.save();
454453
canvas.clipRect(offset & size);
455454
defaultPaint(canvas, offset);
@@ -458,4 +457,26 @@ class RenderFlex extends RenderBox with ContainerRenderObjectMixin<RenderBox, Fl
458457
defaultPaint(canvas, offset);
459458
}
460459
}
460+
461+
void debugPaintSize(PaintingCanvas canvas, Offset offset) {
462+
super.debugPaintSize(canvas, offset);
463+
if (_overflow <= 0)
464+
return;
465+
466+
// Draw a red rectangle over the overflow area in debug mode
467+
// You should be using a Clip if you want to clip your children
468+
Paint paint = new Paint()..color = const Color(0x7FFF0000);
469+
Rect overflowRect;
470+
switch(direction) {
471+
case FlexDirection.horizontal:
472+
overflowRect = offset + new Offset(size.width, 0.0) &
473+
new Size(_overflow, size.height);
474+
break;
475+
case FlexDirection.vertical:
476+
overflowRect = offset + new Offset(0.0, size.height) &
477+
new Size(size.width, _overflow);
478+
break;
479+
}
480+
canvas.drawRect(overflowRect, paint);
481+
}
461482
}

0 commit comments

Comments
 (0)