Mike/FlexLove
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

fix multi-child of absolute parent bug

Browse Source
This commit is contained in:
Michael Freno
2025-12-14 12:00:38 -05:00
parent f56102fd06
commit 8613859408
1 changed files with 25 additions and 74 deletions
Download Patch File Download Diff File Expand all files Collapse all files

57
modules/LayoutEngine.lua
View File

@@ -123,8 +123,6 @@ end
--- Apply CSS positioning offsets (top, right, bottom, left) to a child element
---@param child Element The element to apply offsets to
function LayoutEngine:applyPositioningOffsets(child)
if not child then
return
end
@@ -209,13 +207,13 @@ function LayoutEngine:_batchCalculatePositions(children, startX, startY, spacing
if isHorizontal then
positions[i] = {
x = currentPos + child.margin.left,
y = startY + child.margin.top
y = startY + child.margin.top,
}
currentPos = currentPos + child:getBorderBoxWidth() + child.margin.left + child.margin.right + spacing
else
positions[i] = {
x = startX + child.margin.left,
y = currentPos + child.margin.top
y = currentPos + child.margin.top,
}
currentPos = currentPos + child:getBorderBoxHeight() + child.margin.top + child.margin.bottom + spacing
end
@@ -226,7 +224,6 @@ end
--- Layout children within this element according to positioning mode
function LayoutEngine:layoutChildren()
-- Start performance timing first (before any early returns)
local timerName = nil
if LayoutEngine._Performance and LayoutEngine._Performance.enabled and self.element then
@@ -250,44 +247,6 @@ function LayoutEngine:layoutChildren()
-- Track layout recalculations for performance warnings
self:_trackLayoutRecalculation()
if self.positioning == self._Positioning.ABSOLUTE or self.positioning == self._Positioning.RELATIVE then
-- Absolute/Relative positioned containers don't layout their children according to flex rules,
-- but they should still apply CSS positioning offsets to their children
local baseX = (self.element.x or 0) + self.element.padding.left
local baseY = (self.element.y or 0) + self.element.padding.top
for _, child in ipairs(self.element.children) do
-- Apply CSS positioning offsets to children with absolute positioning
if child.top or child.right or child.bottom or child.left then
self:applyPositioningOffsets(child)
elseif child.positioning == self._Positioning.RELATIVE then
-- Reposition relative children to match parent's new position
-- This is needed when the parent (absolute container) moves after children are created
-- Preserve any explicit x/y offsets that were set on the child
local offsetX = (child.units.x and child.units.x.value) or 0
local offsetY = (child.units.y and child.units.y.value) or 0
child.x = baseX + offsetX
child.y = baseY + offsetY
-- If child has children, recursively layout them
if #child.children > 0 then
child:layoutChildren()
end
end
end
-- Detect overflow after children positioning
if self.element._detectOverflow then
self.element:_detectOverflow()
end
-- Stop performance timing
if timerName and LayoutEngine._Performance then
LayoutEngine._Performance:stopTimer(timerName)
end
return
end
-- Handle grid layout
if self.positioning == self._Positioning.GRID then
self._Grid.layoutGridItems(self.element)
@@ -611,11 +570,7 @@ function LayoutEngine:layoutChildren()
if effectiveAlign == alignItems_FLEX_START then
child.y = elementY + elementPaddingTop + currentCrossPos + childMarginTop
elseif effectiveAlign == alignItems_CENTER then
child.y = elementY
+ elementPaddingTop
+ currentCrossPos
+ ((lineHeight - childTotalCrossSize) / 2)
+ childMarginTop
child.y = elementY + elementPaddingTop + currentCrossPos + ((lineHeight - childTotalCrossSize) / 2) + childMarginTop
elseif effectiveAlign == alignItems_FLEX_END then
child.y = elementY + elementPaddingTop + currentCrossPos + lineHeight - childTotalCrossSize + childMarginTop
elseif effectiveAlign == alignItems_STRETCH then
@@ -656,11 +611,7 @@ function LayoutEngine:layoutChildren()
if effectiveAlign == alignItems_FLEX_START then
child.x = elementX + elementPaddingLeft + currentCrossPos + childMarginLeft
elseif effectiveAlign == alignItems_CENTER then
child.x = elementX
+ elementPaddingLeft
+ currentCrossPos
+ ((lineHeight - childTotalCrossSize) / 2)
+ childMarginLeft
child.x = elementX + elementPaddingLeft + currentCrossPos + ((lineHeight - childTotalCrossSize) / 2) + childMarginLeft
elseif effectiveAlign == alignItems_FLEX_END then
child.x = elementX + elementPaddingLeft + currentCrossPos + lineHeight - childTotalCrossSize + childMarginLeft
elseif effectiveAlign == alignItems_STRETCH then