Changeset 294233 in webkit

Timestamp:

May 16, 2022 8:08:11 AM (2 years ago)

Author:

Alan Bujtas

Message:

[LFC][FFC] Add "flex-direction: row-reverse" basic visual/logical conversion
​https://bugs.webkit.org/show_bug.cgi?id=240432

Reviewed by Antti Koivisto.

With "flex-direction: row-reverse" the main axis progression is from visual right to left (with default writing mode and all that).

• layout/formattingContexts/flex/FlexFormattingContext.cpp:

(WebCore::Layout::FlexFormattingContext::layoutInFlowContentForIntegration):

Location:

trunk/Source/WebCore

Files:

• ChangeLog (modified) (1 diff)
• layout/formattingContexts/flex/FlexFormattingContext.cpp (modified) (6 diffs)

trunk/Source/WebCore/ChangeLog

@@ +1 @@
+2022-05-16  Alan Bujtas  <zalan@apple.com>
+
+        [LFC][FFC] Add "flex-direction: row-reverse" basic visual/logical conversion
+        https://bugs.webkit.org/show_bug.cgi?id=240432
+
+        Reviewed by Antti Koivisto.
+
+        With "flex-direction: row-reverse" the main axis progression is from visual right to left (with default writing mode and all that).
+
+        * layout/formattingContexts/flex/FlexFormattingContext.cpp:
+        (WebCore::Layout::FlexFormattingContext::layoutInFlowContentForIntegration):
+
 2022-05-16  Alan Bujtas  <zalan@apple.com>
 

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

@@ -130 +130 @@
     Vector<FlexItemLogicalBox> logicalFlexItemList;
 
-    auto logicalLeft = LayoutUnit { };
-    auto logicalTop = LayoutUnit { };
 
     auto convertVisualToLogical = [&] {
@@ -137 +135 @@
         auto direction = root().style().flexDirection();
 
-        logicalLeft = constraints.horizontal().logicalLeft;
-        logicalTop = constraints.logicalTop();
-
         for (auto& flexItem : childrenOfType<ContainerBox>(root())) {
             auto& flexItemGeometry = formattingState.boxGeometry(flexItem);
@@ -146 +141 @@
             switch (direction) {
             case FlexDirection::Row:
+            case FlexDirection::RowReverse:
                 logicalSize = { flexItemGeometry.marginBoxWidth(), flexItemGeometry.marginBoxHeight() };
                 break;
@@ -151 +147 @@
                 logicalSize = { flexItemGeometry.marginBoxHeight(), flexItemGeometry.marginBoxWidth() };
                 break;
-            case FlexDirection::RowReverse:
             case FlexDirection::ColumnReverse:
                 ASSERT_NOT_IMPLEMENTED_YET();
@@ -163 +158 @@
     };
     convertVisualToLogical();
+
+    auto logicalLeft = LayoutUnit { };
+    auto logicalTop = LayoutUnit { };
 
     for (auto& logicalFlexItem : logicalFlexItemList) {
@@ -178 +176 @@
             switch (direction) {
             case FlexDirection::Row:
-                topLeft = logicalFlexItem.rect.topLeft();
-                break;
-            case FlexDirection::Column:
-                topLeft = logicalFlexItem.rect.topLeft().transposedPoint();
+                topLeft = { constraints.horizontal().logicalLeft + logicalFlexItem.rect.left(), constraints.logicalTop() + logicalFlexItem.rect.top() };
                 break;
             case FlexDirection::RowReverse:
+                topLeft = { constraints.horizontal().logicalRight() - logicalFlexItem.rect.right(), constraints.logicalTop() + logicalFlexItem.rect.top() };
+                break;
+            case FlexDirection::Column: {
+                auto flippedTopLeft = logicalFlexItem.rect.topLeft().transposedPoint();
+                topLeft = { constraints.horizontal().logicalLeft + flippedTopLeft.x(), constraints.logicalTop() + flippedTopLeft.y() };
+                break;
+            }
             case FlexDirection::ColumnReverse:
                 ASSERT_NOT_IMPLEMENTED_YET();