fix edge case of flex: 1

This commit is contained in:
Christopher Chedeau
2014-04-15 16:39:42 -07:00
parent 8ebd69437a
commit 9313d3d11e
2 changed files with 20 additions and 4 deletions

View File

@@ -436,8 +436,8 @@ describe('Layout', function() {
{style: {height: 100}} {style: {height: 100}}
]} ]}
]}, ]},
{width: 20, height: 120, top: 0, left: 0, children: [{ {width: 20, height: 120, top: 0, left: 0, children: [
width: 20, height: 120, top: 0, left: 0, children: [ {width: 20, height: 120, top: 0, left: 0, children: [
{width: 0, height: 0, top: 10, left: 10}, {width: 0, height: 0, top: 10, left: 10},
{width: 0, height: 100, top: 20, left: 20} {width: 0, height: 100, top: 20, left: 20}
]} ]}
@@ -445,6 +445,17 @@ describe('Layout', function() {
); );
}); });
it('should layout flex inside of an empty element', function() {
testLayout(
{style: {}, children: [
{style: {flex: 1}},
]},
{width: 0, height: 0, top: 0, left: 0, children: [
{width: 0, height: 0, top: 0, left: 0}
]}
);
});
it('should layout randomly', function() { it('should layout randomly', function() {
function RNG(seed) { function RNG(seed) {
this.state = seed; this.state = seed;
@@ -487,6 +498,7 @@ describe('Layout', function() {
randEnum(node, 0.1, 'justifyContent', ['flex-start', 'center', 'flex-end', 'space-between', 'space-around']); randEnum(node, 0.1, 'justifyContent', ['flex-start', 'center', 'flex-end', 'space-between', 'space-around']);
randEnum(node, 0.1, 'alignItems', ['flex-start', 'center', 'flex-end']); randEnum(node, 0.1, 'alignItems', ['flex-start', 'center', 'flex-end']);
randEnum(node, 0.1, 'alignSelf', ['flex-start', 'center', 'flex-end']); randEnum(node, 0.1, 'alignSelf', ['flex-start', 'center', 'flex-end']);
randEnum(node, 0.1, 'flex', ['none', 1]);
randChildren(node, 0.2); randChildren(node, 0.2);
return node; return node;
} }

View File

@@ -66,6 +66,10 @@ function computeLayout(node) {
return 'column'; return 'column';
} }
function getFlex(node) {
return node.style.flex === 1;
}
var axis = { var axis = {
left: 'horizontal', left: 'horizontal',
right: 'horizontal', right: 'horizontal',
@@ -109,7 +113,7 @@ function computeLayout(node) {
var mainContentDim = 0; var mainContentDim = 0;
var flexibleChildrenCount = 0; var flexibleChildrenCount = 0;
children.forEach(function(child) { children.forEach(function(child) {
if (!child.style.flex) { if (node.layout[dim[mainAxis]] === undefined || !getFlex(child)) {
layoutNode(child); layoutNode(child);
mainContentDim += child.layout[dim[mainAxis]] + mainContentDim += child.layout[dim[mainAxis]] +
getMargin(leading[mainAxis], child) + getMargin(leading[mainAxis], child) +
@@ -126,7 +130,7 @@ function computeLayout(node) {
if (flexibleChildrenCount) { if (flexibleChildrenCount) {
var flexibleMainDim = remainingMainDim / flexibleChildrenCount; var flexibleMainDim = remainingMainDim / flexibleChildrenCount;
children.forEach(function(child) { children.forEach(function(child) {
if (child.style.flex) { if (getFlex(child)) {
child.layout[dim[mainAxis]] = flexibleMainDim; child.layout[dim[mainAxis]] = flexibleMainDim;
layoutNode(child); layoutNode(child);
} }