multiple flex and padding

This commit is contained in:
Christopher Chedeau
2014-04-22 09:48:33 -07:00
parent bda6b23b8b
commit fce826f18b
2 changed files with 21 additions and 3 deletions

View File

@@ -192,6 +192,8 @@ var computeLayout = (function() {
} }
} else { } else {
flexibleChildrenCount++; flexibleChildrenCount++;
mainContentDim += getPadding(child, leading[mainAxis]) +
getPadding(child, trailing[mainAxis]);
} }
} }
@@ -210,7 +212,9 @@ var computeLayout = (function() {
if (getFlex(child)) { if (getFlex(child)) {
child.layout[dim[mainAxis]] = flexibleMainDim - child.layout[dim[mainAxis]] = flexibleMainDim -
getMargin(child, leading[mainAxis]) - getMargin(child, leading[mainAxis]) -
getMargin(child, trailing[mainAxis]); getMargin(child, trailing[mainAxis]) +
getPadding(child, leading[mainAxis]) +
getPadding(child, trailing[mainAxis]);
layoutNode(child); layoutNode(child);
} }
} }

View File

@@ -447,7 +447,7 @@ describe('Layout', function() {
it('should layout node with height, padding and space-around', function() { it('should layout node with height, padding and space-around', function() {
testLayout( testLayout(
{style : {height: 10, paddingTop: 5, justifyContent: 'space-around'}, children: [ {style: {height: 10, paddingTop: 5, justifyContent: 'space-around'}, children: [
{style: {}} {style: {}}
]}, ]},
{width: 0, height: 10, top: 0, left: 0, children: [ {width: 0, height: 10, top: 0, left: 0, children: [
@@ -608,7 +608,7 @@ describe('Layout', function() {
); );
}); });
it('should llll', function() { it('should layout node with flex and main margin', function() {
testLayout( testLayout(
{style: {width: 700, flexDirection: 'row'}, children: [ {style: {width: 700, flexDirection: 'row'}, children: [
{style: {marginLeft: 5, flex: 1}} {style: {marginLeft: 5, flex: 1}}
@@ -619,6 +619,20 @@ describe('Layout', function() {
); );
}); });
it('should layout node with multiple flex and padding', function() {
testLayout(
{style: {width: 700, flexDirection: 'row'}, children: [
{style: {flex: 1}},
{style: {paddingRight: 5, flex: 1}}
]},
{width: 700, height: 0, top: 0, left: 0, children: [
{width: 347.5, height: 0, top: 0, left: 0},
{width: 352.5, height: 0, top: 0, left: 347.5}
]}
);
});
it('should layout randomly', function() { it('should layout randomly', function() {
function RNG(seed) { function RNG(seed) {
this.state = seed; this.state = seed;