import css-layout-185

Reviewed By: lucasr

Differential Revision: D3312496

fbshipit-source-id: 259b6db2fc0166696eb171dc6e2974c81ec2133f

React/Layout/Layout.h

@@ -56,6 +56,11 @@
    CSS_JUSTIFY_SPACE_AROUND
  } css_justify_t;
 
+ typedef enum {
+   CSS_OVERFLOW_VISIBLE = 0,
+   CSS_OVERFLOW_HIDDEN
+ } css_overflow_t;
+
  // Note: auto is only a valid value for alignSelf. It is NOT a valid value for
  // alignItems.
  typedef enum {
@@ -91,7 +96,8 @@
  typedef enum {
    CSS_MEASURE_MODE_UNDEFINED = 0,
    CSS_MEASURE_MODE_EXACTLY,
-   CSS_MEASURE_MODE_AT_MOST
+   CSS_MEASURE_MODE_AT_MOST,
+   CSS_MEASURE_MODE_COUNT
  } css_measure_mode_t;
 
  typedef enum {
@@ -99,20 +105,40 @@
    CSS_HEIGHT
  } css_dimension_t;
 
+ typedef struct {
+   float available_width;
+   float available_height;
+   css_measure_mode_t width_measure_mode;
+   css_measure_mode_t height_measure_mode;
+
+   float computed_width;
+   float computed_height;
+ } css_cached_measurement_t;
+
+ enum {
+   // This value was chosen based on empiracle data. Even the most complicated
+   // layouts should not require more than 16 entries to fit within the cache.
+   CSS_MAX_CACHED_RESULT_COUNT = 16
+ };
+
  typedef struct {
    float position[4];
    float dimensions[2];
    css_direction_t direction;
 
+   float flex_basis;
+
    // Instead of recomputing the entire layout every single time, we
    // cache some information to break early when nothing changed
    bool should_update;
-   float last_requested_dimensions[2];
-   float last_parent_max_width;
-   float last_parent_max_height;
-   float last_dimensions[2];
-   float last_position[2];
-   css_direction_t last_direction;
+   int generation_count;
+   css_direction_t last_parent_direction;
+
+   int next_cached_measurements_index;
+   css_cached_measurement_t cached_measurements[CSS_MAX_CACHED_RESULT_COUNT];
+   float measured_dimensions[2];
+
+   css_cached_measurement_t cached_layout;
  } css_layout_t;
 
  typedef struct {
@@ -128,6 +154,7 @@
    css_align_t align_self;
    css_position_type_t position_type;
    css_wrap_type_t flex_wrap;
+   css_overflow_t overflow;
    float flex;
    float margin[6];
    float position[4];
@@ -155,8 +182,7 @@
    int children_count;
    int line_index;
 
-   css_node_t *next_absolute_child;
-   css_node_t *next_flex_child;
+   css_node_t* next_child;
 
    css_dim_t (*measure)(void *context, float width, css_measure_mode_t widthMode, float height, css_measure_mode_t heightMode);
    void (*print)(void *context);
@@ -178,12 +204,8 @@
  } css_print_options_t;
  void print_css_node(css_node_t *node, css_print_options_t options);
 
+ // Function that computes the layout!
+ void layoutNode(css_node_t *node, float availableWidth, float availableHeight, css_direction_t parentDirection);
  bool isUndefined(float value);
 
- // Function that computes the layout!
- void layoutNode(css_node_t *node, float maxWidth, float maxHeight, css_direction_t parentDirection);
-
- // Reset the calculated layout values for a given node. You should call this before `layoutNode`.
- void resetNodeLayout(css_node_t *node);
-
  #endif

React/Views/RCTRootShadowView.m

@@ -34,7 +34,6 @@
   [self applySizeConstraints];
 
   [self fillCSSNode:self.cssNode];
-  resetNodeLayout(self.cssNode);
   layoutNode(self.cssNode, CSS_UNDEFINED, CSS_UNDEFINED, CSS_DIRECTION_INHERIT);
 
   NSMutableSet<RCTShadowView *> *viewsWithNewFrame = [NSMutableSet set];

ReactAndroid/src/main/java/com/facebook/csslayout/CSSCachedMeasurement.java

@@ -0,0 +1,22 @@
+/**
+ * Copyright (c) 2014-present, Facebook, Inc.
+ * All rights reserved.
+ * This source code is licensed under the BSD-style license found in the
+ * LICENSE file in the root directory of this source tree. An additional grant
+ * of patent rights can be found in the PATENTS file in the same directory.
+ */
+
+// NOTE: this file is auto-copied from https://github.com/facebook/css-layout
+// @generated SignedSource<<fe2172034939f4e8919ad4b533f27703>>
+
+package com.facebook.csslayout;
+
+public class CSSCachedMeasurement {
+  public float availableWidth;
+  public float availableHeight;
+  public CSSMeasureMode widthMeasureMode = null;
+  public CSSMeasureMode heightMeasureMode = null;
+  
+  public float computedWidth;
+  public float computedHeight;
+}

ReactAndroid/src/main/java/com/facebook/csslayout/CSSLayout.java

@@ -7,7 +7,7 @@
  */
 
 // NOTE: this file is auto-copied from https://github.com/facebook/css-layout
-// @generated SignedSource<<1e547b3af02a275fe73089e5a0a172c5>>
+// @generated SignedSource<<4ed6ae4c11cdd41f5db380e3b9a06f23>>
 
 package com.facebook.csslayout;
 
@@ -17,6 +17,10 @@ import java.util.Arrays;
  * Where the output of {@link LayoutEngine#layoutNode(CSSNode, float)} will go in the CSSNode.
  */
 public class CSSLayout {
+  // This value was chosen based on empiracle data. Even the most complicated
+  // layouts should not require more than 16 entries to fit within the cache.
+  public static final int MAX_CACHED_RESULT_COUNT = 16;
+  
   public static final int POSITION_LEFT = 0;
   public static final int POSITION_TOP = 1;
   public static final int POSITION_RIGHT = 2;
@@ -28,24 +32,38 @@ public class CSSLayout {
   public float[] position = new float[4];
   public float[] dimensions = new float[2];
   public CSSDirection direction = CSSDirection.LTR;
-
-  /**
-   * This should always get called before calling {@link LayoutEngine#layoutNode(CSSNode, float)}
-   */
+  
+  public float flexBasis;
+  
+  public int generationCount;
+  public CSSDirection lastParentDirection;
+  
+  public int nextCachedMeasurementsIndex;
+  public CSSCachedMeasurement[] cachedMeasurements = new CSSCachedMeasurement[MAX_CACHED_RESULT_COUNT];
+  public float[] measuredDimensions = new float[2];
+  
+  public CSSCachedMeasurement cachedLayout = new CSSCachedMeasurement();
+  
+  CSSLayout() {
+    resetResult();
+  }
+  
   public void resetResult() {
     Arrays.fill(position, 0);
     Arrays.fill(dimensions, CSSConstants.UNDEFINED);
     direction = CSSDirection.LTR;
-  }
-
-  public void copy(CSSLayout layout) {
-    position[POSITION_LEFT] = layout.position[POSITION_LEFT];
-    position[POSITION_TOP] = layout.position[POSITION_TOP];
-    position[POSITION_RIGHT] = layout.position[POSITION_RIGHT];
-    position[POSITION_BOTTOM] = layout.position[POSITION_BOTTOM];
-    dimensions[DIMENSION_WIDTH] = layout.dimensions[DIMENSION_WIDTH];
-    dimensions[DIMENSION_HEIGHT] = layout.dimensions[DIMENSION_HEIGHT];
-    direction = layout.direction;
+    
+    flexBasis = 0;
+    
+    generationCount = 0;
+    lastParentDirection = null;
+    
+    nextCachedMeasurementsIndex = 0;
+    measuredDimensions[DIMENSION_WIDTH] = CSSConstants.UNDEFINED;
+    measuredDimensions[DIMENSION_HEIGHT] = CSSConstants.UNDEFINED;
+    
+    cachedLayout.widthMeasureMode = null;
+    cachedLayout.heightMeasureMode = null;
   }
 
   @Override

ReactAndroid/src/main/java/com/facebook/csslayout/CSSLayoutContext.java

@@ -7,7 +7,7 @@
  */
 
 // NOTE: this file is auto-copied from https://github.com/facebook/css-layout
-// @generated SignedSource<<9d48f3d4330e7b6cba0fff7d8f1e8b0c>>
+// @generated SignedSource<<ad69450666e601bed3648b9f7b990f4d>>
 
 package com.facebook.csslayout;
 
@@ -20,4 +20,5 @@ package com.facebook.csslayout;
  */
 public class CSSLayoutContext {
   /*package*/ final MeasureOutput measureOutput = new MeasureOutput();
+  int currentGenerationCount;
 }

ReactAndroid/src/main/java/com/facebook/csslayout/CSSNode.java

@@ -7,7 +7,7 @@
  */
 
 // NOTE: this file is auto-copied from https://github.com/facebook/css-layout
-// @generated SignedSource<<e87a0b3f12fe2e671deb259075a51dc0>>
+// @generated SignedSource<<67fbba6df7c2472877c7b04327fb1863>>
 
 package com.facebook.csslayout;
 
@@ -66,9 +66,8 @@ public class CSSNode {
 
   public int lineIndex = 0;
 
-  /*package*/ CSSNode nextAbsoluteChild;
-  /*package*/ CSSNode nextFlexChild;
-
+  /*package*/ CSSNode nextChild;
+  
   private @Nullable ArrayList<CSSNode> mChildren;
   private @Nullable CSSNode mParent;
   private @Nullable MeasureFunction mMeasureFunction = null;
@@ -142,7 +141,6 @@ public class CSSNode {
    * Performs the actual layout and saves the results in {@link #layout}
    */
   public void calculateLayout(CSSLayoutContext layoutContext) {
-    layout.resetResult();
     LayoutEngine.layoutNode(layoutContext, this, CSSConstants.UNDEFINED, CSSConstants.UNDEFINED, null);
   }
 

ReactAndroid/src/main/java/com/facebook/csslayout/CSSOverflow.java

@@ -0,0 +1,17 @@
+/**
+ * Copyright (c) 2014-present, Facebook, Inc.
+ * All rights reserved.
+ * This source code is licensed under the BSD-style license found in the
+ * LICENSE file in the root directory of this source tree. An additional grant
+ * of patent rights can be found in the PATENTS file in the same directory.
+ */
+
+// NOTE: this file is auto-copied from https://github.com/facebook/css-layout
+// @generated SignedSource<<3bbf86ec0e75cbdbc9c741e0b3922679>>
+
+package com.facebook.csslayout;
+
+public enum CSSOverflow {
+  VISIBLE,
+  HIDDEN,
+}

ReactAndroid/src/main/java/com/facebook/csslayout/CSSStyle.java

@@ -7,7 +7,7 @@
  */
 
 // NOTE: this file is auto-copied from https://github.com/facebook/css-layout
-// @generated SignedSource<<4c7c75ffd4800aee843a5f5828f3e3ab>>
+// @generated SignedSource<<d231dc5fd873a05ae8641a7199502a2a>>
 
 package com.facebook.csslayout;
 
@@ -26,6 +26,7 @@ public class CSSStyle {
   public CSSAlign alignSelf;
   public CSSPositionType positionType;
   public CSSWrap flexWrap;
+  public CSSOverflow overflow;
   public float flex;
 
   public Spacing margin = new Spacing();
@@ -54,6 +55,7 @@ public class CSSStyle {
     alignSelf = CSSAlign.AUTO;
     positionType = CSSPositionType.RELATIVE;
     flexWrap = CSSWrap.NOWRAP;
+    overflow = CSSOverflow.VISIBLE;
     flex = 0f;
 
     margin.reset();;

ReactAndroid/src/main/java/com/facebook/csslayout/README

@@ -1,7 +1,7 @@
 The source of truth for css-layout is: https://github.com/facebook/css-layout
 
 The code here should be kept in sync with GitHub.
-HEAD at the time this code was synced: https://github.com/facebook/css-layout/commit/b0d00ad33850d83450139d994bded89d20ddac32
+HEAD at the time this code was synced: https://github.com/facebook/css-layout/commit/16f43dac87ace8b60e0e4c07a798a558c22bd21b
 
 There is generated code in:
  - README (this file)

ReactAndroid/src/main/java/com/facebook/csslayout/README.facebook

@@ -1,7 +1,7 @@
 The source of truth for css-layout is: https://github.com/facebook/css-layout
 
 The code here should be kept in sync with GitHub.
-HEAD at the time this code was synced: https://github.com/facebook/css-layout/commit/b0d00ad33850d83450139d994bded89d20ddac32
+HEAD at the time this code was synced: https://github.com/facebook/css-layout/commit/16f43dac87ace8b60e0e4c07a798a558c22bd21b
 
 There is generated code in:
  - README.facebook (this file)