Changeset 122747 in webkit for trunk/Source/WebCore/rendering/RenderGrid.cpp

Timestamp:

Jul 16, 2012, 12:09:57 PM (13 years ago)

Author:

tony@chromium.org

Message:

Position grid items by row/column index
​https://bugs.webkit.org/show_bug.cgi?id=91293

Reviewed by Ojan Vafai.

Source/WebCore:

Do some initial grid positioning. Only handle the simple case where tracks are
fixed values and don't properly size the grid items. This gives us something to
work with and starts implementing the "Grid Track Sizing Algorithm":
​http://dev.w3.org/csswg/css3-grid-layout/#grid-track-sizing-algorithm0

Test: fast/css-grid-layout/place-cell-by-index.html

• rendering/RenderGrid.cpp:

(RenderGrid::GridTrack): Data structure for holding the track size. UsedBreadth matches the terminology
used in the spec.
(WebCore::RenderGrid::layoutBlock): Pull in some boiler plate code and put the
grid specific code in layoutGridItems.
(WebCore::RenderGrid::computedUsedBreadthOfGridTracks): Implement part of the grid track sizing algorithm.
(WebCore::RenderGrid::layoutGridItems): Compute the size of grid tracks, layout and position children.
(WebCore::RenderGrid::findChildLogicalPosition): Map track sizes to the actual position of the child.

• rendering/RenderGrid.h:
• rendering/style/RenderStyle.h: Just return a copy of Length rather than a reference to Length. This seems

more consistent with other getters that return a Length.

LayoutTests:

Add a test for grid layout in each writing mode direction. The height in vertical writing mode is incorrect for now.

• fast/css-grid-layout/containing-block-grids-expected.html: Scope <p> around text only.
• fast/css-grid-layout/containing-block-grids.html: Fix missing closing </div>.
• fast/css-grid-layout/place-cell-by-index-expected.txt: Added.
• fast/css-grid-layout/place-cell-by-index.html: Added.

File:

• trunk/Source/WebCore/rendering/RenderGrid.cpp (modified) (2 diffs)

trunk/Source/WebCore/rendering/RenderGrid.cpp

@@ -25 +25 @@
 
 #include "config.h"
-
 #include "RenderGrid.h"
 
+#include "LayoutRepainter.h"
+#include "NotImplemented.h"
+#include "RenderLayer.h"
+#include "RenderView.h"
+
 namespace WebCore {
+
+class RenderGrid::GridTrack {
+public:
+    GridTrack()
+        : m_usedBreadth(0)
+    {
+    }
+
+    LayoutUnit m_usedBreadth;
+};
 
 RenderGrid::RenderGrid(Node* node)
@@ -41 +55 @@
 }
 
-void RenderGrid::layoutBlock(bool relayoutChildren, LayoutUnit pageLogicalHeight)
+void RenderGrid::layoutBlock(bool relayoutChildren, LayoutUnit)
 {
-    // For now just call the base class.
-    RenderBlock::layoutBlock(relayoutChildren, pageLogicalHeight);
+    ASSERT(needsLayout());
+
+    if (!relayoutChildren && simplifiedLayout())
+        return;
+
+    // FIXME: Much of this method is boiler plate that matches RenderBox::layoutBlock and Render*FlexibleBox::layoutBlock.
+    // It would be nice to refactor some of the duplicate code.
+    LayoutRepainter repainter(*this, checkForRepaintDuringLayout());
+    LayoutStateMaintainer statePusher(view(), this, locationOffset(), hasTransform() || hasReflection() || style()->isFlippedBlocksWritingMode());
+
+    if (inRenderFlowThread()) {
+        // Regions changing widths can force us to relayout our children.
+        if (logicalWidthChangedInRegions())
+            relayoutChildren = true;
+    }
+    computeInitialRegionRangeForBlock();
+
+    LayoutSize previousSize = size();
+
+    setLogicalHeight(0);
+    computeLogicalWidth();
+
+    m_overflow.clear();
+
+    if (scrollsOverflow()) {
+        if (style()->overflowX() == OSCROLL)
+            layer()->setHasHorizontalScrollbar(true);
+        if (style()->overflowY() == OSCROLL)
+            layer()->setHasVerticalScrollbar(true);
+    }
+
+    layoutGridItems();
+
+    LayoutUnit oldClientAfterEdge = clientLogicalBottom();
+    computeLogicalHeight();
+
+    if (size() != previousSize)
+        relayoutChildren = true;
+
+    layoutPositionedObjects(relayoutChildren || isRoot());
+
+    computeRegionRangeForBlock();
+
+    computeOverflow(oldClientAfterEdge);
+    statePusher.pop();
+
+    updateLayerTransform();
+
+    // Update our scroll information if we're overflow:auto/scroll/hidden now that we know if
+    // we overflow or not.
+    if (hasOverflowClip())
+        layer()->updateScrollInfoAfterLayout();
+
+    repainter.repaintAfterLayout();
+
+    setNeedsLayout(false);
+}
+
+void RenderGrid::computedUsedBreadthOfGridTracks(TrackSizingDirection direction, Vector<GridTrack>& tracks)
+{
+    const Vector<Length>& trackStyles = (direction == ForColumns) ? style()->gridColumns() : style()->gridRows();
+    for (size_t i = 0; i < trackStyles.size(); ++i) {
+        GridTrack track;
+        if (trackStyles[i].isFixed())
+            track.m_usedBreadth = trackStyles[i].getFloatValue();
+        else
+            notImplemented();
+
+        tracks.append(track);
+    }
+}
+
+void RenderGrid::layoutGridItems()
+{
+    Vector<GridTrack> columnTracks, rowTracks;
+    computedUsedBreadthOfGridTracks(ForColumns, columnTracks);
+    // FIXME: The logical width of Grid Columns from the prior step is used in
+    // the formatting of Grid items in content-sized Grid Rows to determine
+    // their required height. We will probably need to pass columns through.
+    computedUsedBreadthOfGridTracks(ForRows, rowTracks);
+
+    for (RenderBox* child = firstChildBox(); child; child = child->nextSiblingBox()) {
+        LayoutPoint childPosition = findChildLogicalPosition(child, columnTracks, rowTracks);
+        // FIXME: Grid items should stretch to fill their cells. Once we
+        // implement grid-{column,row}-align, we can also shrink to fit. For
+        // now, just size as if we were a regular child.
+        child->layoutIfNeeded();
+
+        // FIXME: Handle border & padding on the grid element.
+        child->setLogicalLocation(childPosition);
+    }
+
+    // FIXME: Handle border & padding on the grid element.
+    for (size_t i = 0; i < rowTracks.size(); ++i)
+        setLogicalHeight(logicalHeight() + rowTracks[i].m_usedBreadth);
+}
+
+LayoutPoint RenderGrid::findChildLogicalPosition(RenderBox* child, const Vector<GridTrack>& columnTracks, const Vector<GridTrack>& rowTracks)
+{
+    Length column = child->style()->gridItemColumn();
+    Length row = child->style()->gridItemRow();
+
+    // FIXME: What does a non-positive integer mean for a column/row?
+    if (!column.isPositive() || !row.isPositive())
+        return LayoutPoint();
+
+    // FIXME: Handle other values for grid-{row,column} like ranges or line names.
+    if (!column.isFixed() || !row.isFixed())
+        return LayoutPoint();
+
+    size_t columnTrack = static_cast<size_t>(column.intValue()) - 1;
+    size_t rowTrack = static_cast<size_t>(row.intValue()) - 1;
+
+    LayoutPoint offset;
+    for (size_t i = 0; i < columnTrack && i < columnTracks.size(); ++i)
+        offset.setX(offset.x() + columnTracks[i].m_usedBreadth);
+    for (size_t i = 0; i < rowTrack && i < rowTracks.size(); ++i)
+        offset.setY(offset.y() + rowTracks[i].m_usedBreadth);
+
+    // FIXME: Handle margins on the grid item.
+    return offset;
 }