diff --git a/spec/LayoutSpec.js b/spec/LayoutSpec.js index 9110dd92..9e1cce8b 100755 --- a/spec/LayoutSpec.js +++ b/spec/LayoutSpec.js @@ -223,5 +223,31 @@ describe('Layout', function() { ] }); }); + + it('should layout node with flex recursively', function() { + testLayout({ + style: {width: 1000, height: 1000}, + children: [{ + style: {width: 1000, flex: 1}, + children: [{ + style: {width: 1000, flex: 1}, + children: [{ + style: {width: 1000, flex: 1} + }] + }] + }] + }, { + width: 1000, height: 1000, top: 0, left: 0, + children: [{ + width: 1000, height: 1000, top: 0, left: 0, + children: [{ + width: 1000, height: 1000, top: 0, left: 0, + children: [{ + width: 1000, height: 1000, top: 0, left: 0 + }] + }] + }] + }); + }); }); diff --git a/src/Layout.js b/src/Layout.js index 6662730f..de54ae1d 100755 --- a/src/Layout.js +++ b/src/Layout.js @@ -60,9 +60,10 @@ function computeLayout(node) { var flexibleMainDim = (node.layout[dim[mainAxis]] - mainContentDim) / flexibleChildren.length; + // optim: don't allocate a new array, re-traverse + filter the initial one flexibleChildren.forEach(function(child) { - layoutNode(child); child.layout[dim[mainAxis]] = flexibleMainDim; + layoutNode(child); }); var mainPos = 0; @@ -72,7 +73,7 @@ function computeLayout(node) { mainPos += child.layout[dim[mainAxis]] + 2 * getMargin(child); }); - if (!mainDimInStyle) { + if (node.layout[dim[mainAxis]] === undefined && !mainDimInStyle) { node.layout[dim[mainAxis]] = mainPos; } node.layout[dim[crossAxis]] = node.style[dim[crossAxis]];