Compute main dimensions from chidren when not defined
This commit is contained in:
@@ -71,9 +71,8 @@ function computeDOMLayout(node) {
|
|||||||
function testLayout(node, expectedLayout) {
|
function testLayout(node, expectedLayout) {
|
||||||
var layout = computeLayout(node);
|
var layout = computeLayout(node);
|
||||||
var domLayout = computeDOMLayout(node);
|
var domLayout = computeDOMLayout(node);
|
||||||
expect(layout).toEqual(expectedLayout)
|
|
||||||
expect(layout).toEqual(domLayout);
|
|
||||||
expect(expectedLayout).toEqual(domLayout);
|
expect(expectedLayout).toEqual(domLayout);
|
||||||
|
expect(layout).toEqual(domLayout);
|
||||||
}
|
}
|
||||||
|
|
||||||
describe('Layout', function() {
|
describe('Layout', function() {
|
||||||
@@ -178,5 +177,21 @@ describe('Layout', function() {
|
|||||||
]
|
]
|
||||||
});
|
});
|
||||||
});
|
});
|
||||||
|
|
||||||
|
it('should layout node based on children main dimensions', function() {
|
||||||
|
testLayout({
|
||||||
|
style: {width: 300},
|
||||||
|
children: [
|
||||||
|
{style: {width: 100, height: 200}},
|
||||||
|
{style: {width: 300, height: 150}}
|
||||||
|
]
|
||||||
|
}, {
|
||||||
|
width: 300, height: 350, top: 0, left: 0,
|
||||||
|
children: [
|
||||||
|
{width: 100, height: 200, top: 0, left: 0},
|
||||||
|
{width: 300, height: 150, top: 200, left: 0}
|
||||||
|
]
|
||||||
|
});
|
||||||
|
});
|
||||||
});
|
});
|
||||||
|
|
||||||
|
@@ -40,8 +40,12 @@ function computeLayout(node) {
|
|||||||
var mainAxis = node.style.flexDirection === 'row' ? 'row' : 'column';
|
var mainAxis = node.style.flexDirection === 'row' ? 'row' : 'column';
|
||||||
var crossAxis = mainAxis === 'row' ? 'column' : 'row';
|
var crossAxis = mainAxis === 'row' ? 'column' : 'row';
|
||||||
|
|
||||||
var mainPos = 0;
|
var mainDimInStyle = dim[mainAxis] in node.style;
|
||||||
|
if (mainDimInStyle) {
|
||||||
|
node.layout[dim[mainAxis]] = node.style[dim[mainAxis]];
|
||||||
|
}
|
||||||
|
|
||||||
|
var mainPos = 0;
|
||||||
var children = [];
|
var children = [];
|
||||||
(node.children || []).forEach(function(child) {
|
(node.children || []).forEach(function(child) {
|
||||||
var offset = {};
|
var offset = {};
|
||||||
@@ -52,8 +56,10 @@ function computeLayout(node) {
|
|||||||
mainPos += child.layout[dim[mainAxis]] + 2 * getMargin(child);
|
mainPos += child.layout[dim[mainAxis]] + 2 * getMargin(child);
|
||||||
});
|
});
|
||||||
|
|
||||||
node.layout.width = node.style.width;
|
if (!mainDimInStyle) {
|
||||||
node.layout.height = node.style.height;
|
node.layout[dim[mainAxis]] = mainPos;
|
||||||
|
}
|
||||||
|
node.layout[dim[crossAxis]] = node.style[dim[crossAxis]];
|
||||||
node.layout.top = getMargin(node) + parent.top;
|
node.layout.top = getMargin(node) + parent.top;
|
||||||
node.layout.left = getMargin(node) + parent.left;
|
node.layout.left = getMargin(node) + parent.left;
|
||||||
}
|
}
|
||||||
|
Reference in New Issue
Block a user