Changeset 295027 in webkit

Timestamp:

May 30, 2022 7:10:13 AM (2 years ago)

Author:

Alan Bujtas

Message:

Add support for justify-content: space-between
​https://bugs.webkit.org/show_bug.cgi?id=241080

Reviewed by Antti Koivisto.

Distribute items evenly. The first item is flush with the start, the last is flush with the end.

• Source/WebCore/layout/formattingContexts/flex/FlexFormattingContext.cpp:

(WebCore::Layout::FlexFormattingContext::justifyFlexItems):

• Source/WebCore/layout/integration/LayoutIntegrationCoverage.cpp:

(WebCore::LayoutIntegration::canUseForFlexLayout):

Canonical link: ​https://commits.webkit.org/251122@main

File:

• trunk/Source/WebCore/layout/formattingContexts/flex/FlexFormattingContext.cpp (modified) (2 diffs)

trunk/Source/WebCore/layout/formattingContexts/flex/FlexFormattingContext.cpp

@@ -460 +460 @@
 {
     auto justifyContent = root().style().justifyContent();
+    // FIXME: Make this optional.
+    auto contentLogicalWidth = [&] {
+        auto logicalWidth = LayoutUnit { };
+        for (auto& logicalFlexItem : logicalFlexItemList)
+            logicalWidth += logicalFlexItem.rect.width();
+        return logicalWidth;
+    }();
 
     auto initialOffset = [&] {
-        auto contentLogicalWidth = [&] {
-            auto logicalWidth = LayoutUnit { };
-            for (auto& logicalFlexItem : logicalFlexItemList)
-                logicalWidth += logicalFlexItem.rect.width();
-            return logicalWidth;
-        };
+        switch (justifyContent.distribution()) {
+        case ContentDistribution::Default:
+            // Fall back to justifyContent.position() 
+            break;
+        case ContentDistribution::SpaceBetween:
+            return LayoutUnit { };
+        default:
+            ASSERT_NOT_IMPLEMENTED_YET();
+            break;
+        }
 
         switch (justifyContent.position()) {
@@ -478 +489 @@
         case ContentPosition::FlexEnd:
         case ContentPosition::Right:
-            return availableSpace - contentLogicalWidth();
+            return availableSpace - contentLogicalWidth;
         case ContentPosition::Center:
-            return availableSpace / 2 - contentLogicalWidth() / 2;
+            return availableSpace / 2 - contentLogicalWidth / 2;
         default:
             ASSERT_NOT_IMPLEMENTED_YET();
             break;
         }
+        ASSERT_NOT_REACHED();
         return LayoutUnit { };
     };
 
+    auto gapBetweenItems = [&] {
+        switch (justifyContent.distribution()) {
+        case ContentDistribution::Default:
+            return LayoutUnit { };
+        case ContentDistribution::SpaceBetween:
+            if (logicalFlexItemList.size() == 1)
+                return LayoutUnit { };
+            return (availableSpace - contentLogicalWidth) / (logicalFlexItemList.size() - 1); 
+        default:
+            ASSERT_NOT_IMPLEMENTED_YET();
+            break;
+        }
+        ASSERT_NOT_REACHED();
+        return LayoutUnit { };
+    };
+
     auto logicalLeft = initialOffset();
+    auto gap = gapBetweenItems();
     for (auto& logicalFlexItem : logicalFlexItemList) {
         logicalFlexItem.rect.setLeft(logicalLeft);
-        logicalLeft = logicalFlexItem.rect.right();
+        logicalLeft = logicalFlexItem.rect.right() + gap;
     }
 }