Chromium Code Reviews
chromiumcodereview-hr@appspot.gserviceaccount.com (chromiumcodereview-hr) | Please choose your nickname with Settings | Help | Chromium Project | Gerrit Changes | Sign out
(60)

Side by Side Diff: third_party/WebKit/Source/core/layout/LayoutFlexibleBox.cpp

Issue 1709963002: [css-align] New CSS Value 'normal' for Self Alignment (Closed) Base URL: https://chromium.googlesource.com/chromium/src.git@master
Patch Set: New test for alignment and anonymous boxes. Created 4 years, 6 months ago
Use n/p to move between diff chunks; N/P to move between comments. Draft comments are only viewable by you.
Jump to:
View unified diff | Download patch
OLDNEW
1 /* 1 /*
2 * Copyright (C) 2011 Google Inc. All rights reserved. 2 * Copyright (C) 2011 Google Inc. All rights reserved.
3 * 3 *
4 * Redistribution and use in source and binary forms, with or without 4 * Redistribution and use in source and binary forms, with or without
5 * modification, are permitted provided that the following conditions are 5 * modification, are permitted provided that the following conditions are
6 * met: 6 * met:
7 * 7 *
8 * * Redistributions of source code must retain the above copyright 8 * * Redistributions of source code must retain the above copyright
9 * notice, this list of conditions and the following disclaimer. 9 * notice, this list of conditions and the following disclaimer.
10 * * Redistributions in binary form must reproduce the above 10 * * Redistributions in binary form must reproduce the above
(...skipping 163 matching lines...) Expand 10 before | Expand all | Expand 10 after
174 int LayoutFlexibleBox::baselinePosition(FontBaseline, bool, LineDirectionMode di rection, LinePositionMode mode) const 174 int LayoutFlexibleBox::baselinePosition(FontBaseline, bool, LineDirectionMode di rection, LinePositionMode mode) const
175 { 175 {
176 ASSERT(mode == PositionOnContainingLine); 176 ASSERT(mode == PositionOnContainingLine);
177 int baseline = firstLineBoxBaseline(); 177 int baseline = firstLineBoxBaseline();
178 if (baseline == -1) 178 if (baseline == -1)
179 baseline = synthesizedBaselineFromContentBox(*this, direction); 179 baseline = synthesizedBaselineFromContentBox(*this, direction);
180 180
181 return beforeMarginInLineDirection(direction) + baseline; 181 return beforeMarginInLineDirection(direction) + baseline;
182 } 182 }
183 183
184 static const StyleContentAlignmentData& normalValueBehavior() 184 static const StyleContentAlignmentData& contentAlignmentNormalBehavior()
185 { 185 {
186 // The justify-content property applies along the main axis, but since flexi ng 186 // The justify-content property applies along the main axis, but since flexi ng
187 // in the main axis is controlled by flex, stretch behaves as flex-start (ig noring 187 // in the main axis is controlled by flex, stretch behaves as flex-start (ig noring
188 // the specified fallback alignment, if any). 188 // the specified fallback alignment, if any).
189 // https://drafts.csswg.org/css-align/#distribution-flex 189 // https://drafts.csswg.org/css-align/#distribution-flex
190 static const StyleContentAlignmentData normalBehavior = {ContentPositionNorm al, ContentDistributionStretch}; 190 static const StyleContentAlignmentData normalBehavior = {ContentPositionNorm al, ContentDistributionStretch};
191 return normalBehavior; 191 return normalBehavior;
192 } 192 }
193 193
194 int LayoutFlexibleBox::firstLineBoxBaseline() const 194 int LayoutFlexibleBox::firstLineBoxBaseline() const
(...skipping 103 matching lines...) Expand 10 before | Expand all | Expand 10 after
298 return flexDirection == (style()->isLeftToRightDirection() ? FlowRowReve rse : FlowRow); 298 return flexDirection == (style()->isLeftToRightDirection() ? FlowRowReve rse : FlowRow);
299 return flexDirection == FlowColumnReverse; 299 return flexDirection == FlowColumnReverse;
300 } 300 }
301 301
302 void LayoutFlexibleBox::removeChild(LayoutObject* child) 302 void LayoutFlexibleBox::removeChild(LayoutObject* child)
303 { 303 {
304 LayoutBlock::removeChild(child); 304 LayoutBlock::removeChild(child);
305 m_intrinsicSizeAlongMainAxis.remove(child); 305 m_intrinsicSizeAlongMainAxis.remove(child);
306 } 306 }
307 307
308 void LayoutFlexibleBox::styleDidChange(StyleDifference diff, const ComputedStyle * oldStyle)
309 {
310 LayoutBlock::styleDidChange(diff, oldStyle);
311
312 if (oldStyle && oldStyle->alignItemsPosition() == ItemPositionStretch && dif f.needsFullLayout()) {
313 // Flex items that were previously stretching need to be relayed out so we can compute new available cross axis space.
314 // This is only necessary for stretching since other alignment values do n't change the size of the box.
315 for (LayoutBox* child = firstChildBox(); child; child = child->nextSibli ngBox()) {
316 ItemPosition previousAlignment = ComputedStyle::resolveAlignment(*ol dStyle, child->styleRef(), ItemPositionStretch);
317 if (previousAlignment == ItemPositionStretch && previousAlignment != ComputedStyle::resolveAlignment(styleRef(), child->styleRef(), ItemPositionStre tch))
318 child->setChildNeedsLayout(MarkOnlyThis);
319 }
320 }
321 }
322
323 void LayoutFlexibleBox::layoutBlock(bool relayoutChildren) 308 void LayoutFlexibleBox::layoutBlock(bool relayoutChildren)
324 { 309 {
325 ASSERT(needsLayout()); 310 ASSERT(needsLayout());
326 311
327 if (!relayoutChildren && simplifiedLayout()) 312 if (!relayoutChildren && simplifiedLayout())
328 return; 313 return;
329 314
330 m_relaidOutChildren.clear(); 315 m_relaidOutChildren.clear();
331 316
332 if (updateLogicalWidthAndColumnWidth()) 317 if (updateLogicalWidthAndColumnWidth())
(...skipping 991 matching lines...) Expand 10 before | Expand all | Expand 10 after
1324 if (justifyContentDistribution == ContentDistributionSpaceAround) 1309 if (justifyContentDistribution == ContentDistributionSpaceAround)
1325 return availableFreeSpace / numberOfChildren; 1310 return availableFreeSpace / numberOfChildren;
1326 } 1311 }
1327 return LayoutUnit(); 1312 return LayoutUnit();
1328 } 1313 }
1329 1314
1330 static LayoutUnit alignmentOffset(LayoutUnit availableFreeSpace, ItemPosition po sition, LayoutUnit ascent, LayoutUnit maxAscent, bool isWrapReverse) 1315 static LayoutUnit alignmentOffset(LayoutUnit availableFreeSpace, ItemPosition po sition, LayoutUnit ascent, LayoutUnit maxAscent, bool isWrapReverse)
1331 { 1316 {
1332 switch (position) { 1317 switch (position) {
1333 case ItemPositionAuto: 1318 case ItemPositionAuto:
1319 case ItemPositionNormal:
1334 ASSERT_NOT_REACHED(); 1320 ASSERT_NOT_REACHED();
1335 break; 1321 break;
1336 case ItemPositionStretch: 1322 case ItemPositionStretch:
1337 // Actual stretching must be handled by the caller. 1323 // Actual stretching must be handled by the caller.
1338 // Since wrap-reverse flips cross start and cross end, stretch children should be aligned with the cross end. 1324 // Since wrap-reverse flips cross start and cross end, stretch children should be aligned with the cross end.
1339 // This matters because applyStretchAlignment doesn't always stretch or stretch fully (explicit cross size given, 1325 // This matters because applyStretchAlignment doesn't always stretch or stretch fully (explicit cross size given,
1340 // or stretching constrained by max-height/max-width). 1326 // or stretching constrained by max-height/max-width).
1341 // For flex-start and flex-end this is handled by alignmentForChild(). 1327 // For flex-start and flex-end this is handled by alignmentForChild().
1342 if (isWrapReverse) 1328 if (isWrapReverse)
1343 return availableFreeSpace; 1329 return availableFreeSpace;
(...skipping 28 matching lines...) Expand all
1372 if (hasOrthogonalFlow(child)) 1358 if (hasOrthogonalFlow(child))
1373 child.setOverrideLogicalContentHeight(childPreferredSize - child.borderA ndPaddingLogicalHeight()); 1359 child.setOverrideLogicalContentHeight(childPreferredSize - child.borderA ndPaddingLogicalHeight());
1374 else 1360 else
1375 child.setOverrideLogicalContentWidth(childPreferredSize - child.borderAn dPaddingLogicalWidth()); 1361 child.setOverrideLogicalContentWidth(childPreferredSize - child.borderAn dPaddingLogicalWidth());
1376 } 1362 }
1377 1363
1378 LayoutUnit LayoutFlexibleBox::staticMainAxisPositionForPositionedChild(const Lay outBox& child) 1364 LayoutUnit LayoutFlexibleBox::staticMainAxisPositionForPositionedChild(const Lay outBox& child)
1379 { 1365 {
1380 const LayoutUnit availableSpace = mainAxisContentExtent(contentLogicalHeight ()) - mainAxisExtentForChild(child); 1366 const LayoutUnit availableSpace = mainAxisContentExtent(contentLogicalHeight ()) - mainAxisExtentForChild(child);
1381 1367
1382 ContentPosition position = styleRef().resolvedJustifyContentPosition(normalV alueBehavior()); 1368 ContentPosition position = styleRef().resolvedJustifyContentPosition(content AlignmentNormalBehavior());
1383 ContentDistributionType distribution = styleRef().resolvedJustifyContentDist ribution(normalValueBehavior()); 1369 ContentDistributionType distribution = styleRef().resolvedJustifyContentDist ribution(contentAlignmentNormalBehavior());
1384 LayoutUnit offset = initialJustifyContentOffset(availableSpace, position, di stribution, 1); 1370 LayoutUnit offset = initialJustifyContentOffset(availableSpace, position, di stribution, 1);
1385 if (styleRef().flexDirection() == FlowRowReverse || styleRef().flexDirection () == FlowColumnReverse) 1371 if (styleRef().flexDirection() == FlowRowReverse || styleRef().flexDirection () == FlowColumnReverse)
1386 offset = availableSpace - offset; 1372 offset = availableSpace - offset;
1387 return offset; 1373 return offset;
1388 } 1374 }
1389 1375
1390 LayoutUnit LayoutFlexibleBox::staticCrossAxisPositionForPositionedChild(const La youtBox& child) 1376 LayoutUnit LayoutFlexibleBox::staticCrossAxisPositionForPositionedChild(const La youtBox& child)
1391 { 1377 {
1392 LayoutUnit availableSpace = crossAxisContentExtent() - crossAxisExtentForChi ld(child); 1378 LayoutUnit availableSpace = crossAxisContentExtent() - crossAxisExtentForChi ld(child);
1393 return alignmentOffset(availableSpace, alignmentForChild(child), LayoutUnit( ), LayoutUnit(), styleRef().flexWrap() == FlexWrapReverse); 1379 return alignmentOffset(availableSpace, alignmentForChild(child), LayoutUnit( ), LayoutUnit(), styleRef().flexWrap() == FlexWrapReverse);
(...skipping 51 matching lines...) Expand 10 before | Expand all | Expand 10 after
1445 LayoutUnit staticBlockPosition = flowAwareBorderBefore() + flowAwarePaddingB efore(); 1431 LayoutUnit staticBlockPosition = flowAwareBorderBefore() + flowAwarePaddingB efore();
1446 if (childLayer->staticBlockPosition() != staticBlockPosition) { 1432 if (childLayer->staticBlockPosition() != staticBlockPosition) {
1447 childLayer->setStaticBlockPosition(staticBlockPosition); 1433 childLayer->setStaticBlockPosition(staticBlockPosition);
1448 if (child.style()->hasStaticBlockPosition(style()->isHorizontalWritingMo de())) 1434 if (child.style()->hasStaticBlockPosition(style()->isHorizontalWritingMo de()))
1449 child.setChildNeedsLayout(MarkOnlyThis); 1435 child.setChildNeedsLayout(MarkOnlyThis);
1450 } 1436 }
1451 } 1437 }
1452 1438
1453 ItemPosition LayoutFlexibleBox::alignmentForChild(const LayoutBox& child) const 1439 ItemPosition LayoutFlexibleBox::alignmentForChild(const LayoutBox& child) const
1454 { 1440 {
1455 ItemPosition align = ComputedStyle::resolveAlignment(styleRef(), child.style Ref(), ItemPositionStretch); 1441 // TODO (lajava) We should only need to resolve 'auto' values again in case of an anonymous
1442 // Flex item, however, LayoutFullScreen inserts an Anonymous box between Fle x container and
1443 // its childnre, expecting to propagate its align-items property's value to the Flex items.
Timothy Loh 2016/06/29 02:00:32 typo childnre
jfernandez 2016/06/29 19:55:47 Actually, this TODO is not needed anymore, since w
1444 ItemPosition align = child.styleRef().resolvedAlignSelf(selfAlignmentNormalB ehavior(), child.isAnonymous() ? style() : nullptr).position();
1445 DCHECK(align != ItemPositionAuto && align != ItemPositionNormal);
1456 1446
1457 if (align == ItemPositionBaseline && hasOrthogonalFlow(child)) 1447 if (align == ItemPositionBaseline && hasOrthogonalFlow(child))
1458 align = ItemPositionFlexStart; 1448 align = ItemPositionFlexStart;
1459 1449
1460 if (style()->flexWrap() == FlexWrapReverse) { 1450 if (style()->flexWrap() == FlexWrapReverse) {
1461 if (align == ItemPositionFlexStart) 1451 if (align == ItemPositionFlexStart)
1462 align = ItemPositionFlexEnd; 1452 align = ItemPositionFlexEnd;
1463 else if (align == ItemPositionFlexEnd) 1453 else if (align == ItemPositionFlexEnd)
1464 align = ItemPositionFlexStart; 1454 align = ItemPositionFlexStart;
1465 } 1455 }
(...skipping 72 matching lines...) Expand 10 before | Expand all | Expand 10 after
1538 { 1528 {
1539 if (isHorizontalFlow()) 1529 if (isHorizontalFlow())
1540 return child.styleRef().overflowY(); 1530 return child.styleRef().overflowY();
1541 return child.styleRef().overflowX(); 1531 return child.styleRef().overflowX();
1542 } 1532 }
1543 1533
1544 void LayoutFlexibleBox::layoutAndPlaceChildren(LayoutUnit& crossAxisOffset, cons t OrderedFlexItemList& children, const Vector<LayoutUnit, 16>& childSizes, Layou tUnit availableFreeSpace, bool relayoutChildren, SubtreeLayoutScope& layoutScope , Vector<LineContext>& lineContexts) 1534 void LayoutFlexibleBox::layoutAndPlaceChildren(LayoutUnit& crossAxisOffset, cons t OrderedFlexItemList& children, const Vector<LayoutUnit, 16>& childSizes, Layou tUnit availableFreeSpace, bool relayoutChildren, SubtreeLayoutScope& layoutScope , Vector<LineContext>& lineContexts)
1545 { 1535 {
1546 ASSERT(childSizes.size() == children.size()); 1536 ASSERT(childSizes.size() == children.size());
1547 1537
1548 ContentPosition position = styleRef().resolvedJustifyContentPosition(normalV alueBehavior()); 1538 ContentPosition position = styleRef().resolvedJustifyContentPosition(content AlignmentNormalBehavior());
1549 ContentDistributionType distribution = styleRef().resolvedJustifyContentDist ribution(normalValueBehavior()); 1539 ContentDistributionType distribution = styleRef().resolvedJustifyContentDist ribution(contentAlignmentNormalBehavior());
1550 1540
1551 size_t numberOfChildrenForJustifyContent = numberOfInFlowPositionedChildren( children); 1541 size_t numberOfChildrenForJustifyContent = numberOfInFlowPositionedChildren( children);
1552 LayoutUnit autoMarginOffset = autoMarginOffsetInMainAxis(children, available FreeSpace); 1542 LayoutUnit autoMarginOffset = autoMarginOffsetInMainAxis(children, available FreeSpace);
1553 LayoutUnit mainAxisOffset = flowAwareBorderStart() + flowAwarePaddingStart() ; 1543 LayoutUnit mainAxisOffset = flowAwareBorderStart() + flowAwarePaddingStart() ;
1554 mainAxisOffset += initialJustifyContentOffset(availableFreeSpace, position, distribution, numberOfChildrenForJustifyContent); 1544 mainAxisOffset += initialJustifyContentOffset(availableFreeSpace, position, distribution, numberOfChildrenForJustifyContent);
1555 if (style()->flexDirection() == FlowRowReverse && shouldPlaceBlockDirectionS crollbarOnLogicalLeft()) 1545 if (style()->flexDirection() == FlowRowReverse && shouldPlaceBlockDirectionS crollbarOnLogicalLeft())
1556 mainAxisOffset += isHorizontalFlow() ? verticalScrollbarWidth() : horizo ntalScrollbarHeight(); 1546 mainAxisOffset += isHorizontalFlow() ? verticalScrollbarWidth() : horizo ntalScrollbarHeight();
1557 1547
1558 LayoutUnit totalMainExtent = mainAxisExtent(); 1548 LayoutUnit totalMainExtent = mainAxisExtent();
1559 if (!shouldPlaceBlockDirectionScrollbarOnLogicalLeft()) 1549 if (!shouldPlaceBlockDirectionScrollbarOnLogicalLeft())
(...skipping 80 matching lines...) Expand 10 before | Expand all | Expand 10 after
1640 } 1630 }
1641 1631
1642 if (m_numberOfInFlowChildrenOnFirstLine == -1) 1632 if (m_numberOfInFlowChildrenOnFirstLine == -1)
1643 m_numberOfInFlowChildrenOnFirstLine = seenInFlowPositionedChildren; 1633 m_numberOfInFlowChildrenOnFirstLine = seenInFlowPositionedChildren;
1644 lineContexts.append(LineContext(crossAxisOffset, maxChildCrossAxisExtent, ch ildren.size(), maxAscent)); 1634 lineContexts.append(LineContext(crossAxisOffset, maxChildCrossAxisExtent, ch ildren.size(), maxAscent));
1645 crossAxisOffset += maxChildCrossAxisExtent; 1635 crossAxisOffset += maxChildCrossAxisExtent;
1646 } 1636 }
1647 1637
1648 void LayoutFlexibleBox::layoutColumnReverse(const OrderedFlexItemList& children, LayoutUnit crossAxisOffset, LayoutUnit availableFreeSpace) 1638 void LayoutFlexibleBox::layoutColumnReverse(const OrderedFlexItemList& children, LayoutUnit crossAxisOffset, LayoutUnit availableFreeSpace)
1649 { 1639 {
1650 ContentPosition position = styleRef().resolvedJustifyContentPosition(normalV alueBehavior()); 1640 ContentPosition position = styleRef().resolvedJustifyContentPosition(content AlignmentNormalBehavior());
1651 ContentDistributionType distribution = styleRef().resolvedJustifyContentDist ribution(normalValueBehavior()); 1641 ContentDistributionType distribution = styleRef().resolvedJustifyContentDist ribution(contentAlignmentNormalBehavior());
1652 1642
1653 // This is similar to the logic in layoutAndPlaceChildren, except we place t he children 1643 // This is similar to the logic in layoutAndPlaceChildren, except we place t he children
1654 // starting from the end of the flexbox. We also don't need to layout anythi ng since we're 1644 // starting from the end of the flexbox. We also don't need to layout anythi ng since we're
1655 // just moving the children to a new position. 1645 // just moving the children to a new position.
1656 size_t numberOfChildrenForJustifyContent = numberOfInFlowPositionedChildren( children); 1646 size_t numberOfChildrenForJustifyContent = numberOfInFlowPositionedChildren( children);
1657 LayoutUnit mainAxisOffset = logicalHeight() - flowAwareBorderEnd() - flowAwa rePaddingEnd(); 1647 LayoutUnit mainAxisOffset = logicalHeight() - flowAwareBorderEnd() - flowAwa rePaddingEnd();
1658 mainAxisOffset -= initialJustifyContentOffset(availableFreeSpace, position, distribution, numberOfChildrenForJustifyContent); 1648 mainAxisOffset -= initialJustifyContentOffset(availableFreeSpace, position, distribution, numberOfChildrenForJustifyContent);
1659 mainAxisOffset -= isHorizontalFlow() ? verticalScrollbarWidth() : horizontal ScrollbarHeight(); 1649 mainAxisOffset -= isHorizontalFlow() ? verticalScrollbarWidth() : horizontal ScrollbarHeight();
1660 1650
1661 size_t seenInFlowPositionedChildren = 0; 1651 size_t seenInFlowPositionedChildren = 0;
(...skipping 38 matching lines...) Expand 10 before | Expand all | Expand 10 after
1700 if (alignContentDistribution == ContentDistributionSpaceBetween) 1690 if (alignContentDistribution == ContentDistributionSpaceBetween)
1701 return availableFreeSpace / (numberOfLines - 1); 1691 return availableFreeSpace / (numberOfLines - 1);
1702 if (alignContentDistribution == ContentDistributionSpaceAround || alignC ontentDistribution == ContentDistributionStretch) 1692 if (alignContentDistribution == ContentDistributionSpaceAround || alignC ontentDistribution == ContentDistributionStretch)
1703 return availableFreeSpace / numberOfLines; 1693 return availableFreeSpace / numberOfLines;
1704 } 1694 }
1705 return LayoutUnit(); 1695 return LayoutUnit();
1706 } 1696 }
1707 1697
1708 void LayoutFlexibleBox::alignFlexLines(Vector<LineContext>& lineContexts) 1698 void LayoutFlexibleBox::alignFlexLines(Vector<LineContext>& lineContexts)
1709 { 1699 {
1710 ContentPosition position = styleRef().resolvedAlignContentPosition(normalVal ueBehavior()); 1700 ContentPosition position = styleRef().resolvedAlignContentPosition(contentAl ignmentNormalBehavior());
1711 ContentDistributionType distribution = styleRef().resolvedAlignContentDistri bution(normalValueBehavior()); 1701 ContentDistributionType distribution = styleRef().resolvedAlignContentDistri bution(contentAlignmentNormalBehavior());
1712 1702
1713 // If we have a single line flexbox or a multiline line flexbox with only on e flex line, 1703 // If we have a single line flexbox or a multiline line flexbox with only on e flex line,
1714 // the line height is all the available space. 1704 // the line height is all the available space.
1715 // For flex-direction: row, this means we need to use the height, so we do t his after calling updateLogicalHeight. 1705 // For flex-direction: row, this means we need to use the height, so we do t his after calling updateLogicalHeight.
1716 if (lineContexts.size() == 1) { 1706 if (lineContexts.size() == 1) {
1717 lineContexts[0].crossAxisExtent = crossAxisContentExtent(); 1707 lineContexts[0].crossAxisExtent = crossAxisContentExtent();
1718 return; 1708 return;
1719 } 1709 }
1720 1710
1721 if (position == ContentPositionFlexStart) 1711 if (position == ContentPositionFlexStart)
(...skipping 141 matching lines...) Expand 10 before | Expand all | Expand 10 after
1863 ASSERT(child); 1853 ASSERT(child);
1864 LayoutUnit lineCrossAxisExtent = lineContexts[lineNumber].crossAxisE xtent; 1854 LayoutUnit lineCrossAxisExtent = lineContexts[lineNumber].crossAxisE xtent;
1865 LayoutUnit originalOffset = lineContexts[lineNumber].crossAxisOffset - crossAxisStartEdge; 1855 LayoutUnit originalOffset = lineContexts[lineNumber].crossAxisOffset - crossAxisStartEdge;
1866 LayoutUnit newOffset = contentExtent - originalOffset - lineCrossAxi sExtent; 1856 LayoutUnit newOffset = contentExtent - originalOffset - lineCrossAxi sExtent;
1867 adjustAlignmentForChild(*child, newOffset - originalOffset); 1857 adjustAlignmentForChild(*child, newOffset - originalOffset);
1868 } 1858 }
1869 } 1859 }
1870 } 1860 }
1871 1861
1872 } // namespace blink 1862 } // namespace blink
OLDNEW

Powered by Google App Engine
This is Rietveld 408576698