kylefang/react-native
1
0
Fork 0
mirror of https://github.com/zhigang1992/react-native.git synced 2026-04-08 17:46:35 +08:00
Code Issues Packages Projects Releases Wiki Activity

BREAKING [react_native] Move to new C-based implementation of css-layout in RN Android

Browse Source 
Summary:
Moves from CSSNodeDEPRECATED to CSSNode. This has shown to be a huge performance win for layout time within FB.

This is BREAKING because CSSNode contains bug fixes that were not migrated to CSSNodeDEPRECATED which may change the way your layout appears. The most common of these by far involves `flex: 1`.

Previously, developers had to put `flex: 1` in many places it didn't belong in order to work around a bug in css-layout. Now `flex: 1` is treated properly and, unfortunately, this means that your layout may no longer look correct. Specifically, you may see that your layout looks collapsed, or children don't render. The fix is to simply remove `flex: 1` from those containers.

Reviewed By: emilsjolander

Differential Revision: D3992787

fbshipit-source-id: 7a3a2a34a8941c0524e6ba3c5379e434d3e03247
This commit is contained in:
Andy Street
2016-11-21 06:16:27 -08:00
committed by Facebook Github Bot
parent 27817bed0e
commit d63ba47b59
16 changed files with 124 additions and 33 deletions
Download Patch File Download Diff File Expand all files Collapse all files

10
ReactAndroid/src/main/java/com/facebook/react/uimanager/ReactShadowNode.java
View File

@@ -19,8 +19,8 @@ import com.facebook.csslayout.CSSDirection;
import com.facebook.csslayout.CSSFlexDirection;
import com.facebook.csslayout.CSSJustify;
import com.facebook.csslayout.CSSLayoutContext;
import com.facebook.csslayout.CSSNode;
import com.facebook.csslayout.CSSNodeAPI;
import com.facebook.csslayout.CSSNodeDEPRECATED;
import com.facebook.csslayout.CSSOverflow;
import com.facebook.csslayout.CSSPositionType;
import com.facebook.csslayout.CSSWrap;
@@ -30,9 +30,9 @@ import com.facebook.react.uimanager.annotations.ReactPropertyHolder;
/**
* Base node class for representing virtual tree of React nodes. Shadow nodes are used primarily
* for layouting therefore it extends {@link CSSNodeDEPRECATED} to allow that. They also help with handling
* Common base subclass of {@link CSSNodeDEPRECATED} for all layout nodes for react-based view. It extends
* {@link CSSNodeDEPRECATED} by adding additional capabilities.
* for layouting therefore it extends {@link CSSNode} to allow that. They also help with handling
* Common base subclass of {@link CSSNode} for all layout nodes for react-based view. It extends
* {@link CSSNode} by adding additional capabilities.
*
* Instances of this class receive property updates from JS via @{link UIManagerModule}. Subclasses
* may use {@link #updateShadowNode} to persist some of the updated fields in the node instance that
@@ -74,7 +74,7 @@ public class ReactShadowNode {
private float mAbsoluteBottom;
private final Spacing mDefaultPadding = new Spacing(0);
private final Spacing mPadding = new Spacing(CSSConstants.UNDEFINED);
private final CSSNodeDEPRECATED mCSSNode = new CSSNodeDEPRECATED();
private final CSSNode mCSSNode = new CSSNode();
/**
* Nodes that return {@code true} will be treated as "virtual" nodes. That is, nodes that are not

5
ReactAndroid/src/main/java/com/facebook/react/views/text/ReactTextInlineImageShadowNode.java
View File

@@ -9,11 +9,11 @@
package com.facebook.react.views.text;
import com.facebook.csslayout.CSSNodeDEPRECATED;
import com.facebook.csslayout.CSSNode;
import com.facebook.react.uimanager.LayoutShadowNode;
/**
* Base class for {@link CSSNodeDEPRECATED}s that represent inline images.
* Base class for {@link CSSNode}s that represent inline images.
*/
public abstract class ReactTextInlineImageShadowNode extends LayoutShadowNode {
@@ -22,5 +22,4 @@ public abstract class ReactTextInlineImageShadowNode extends LayoutShadowNode {
* place of this node.
*/
public abstract TextInlineImageSpan buildInlineImageSpan();
}

4
ReactAndroid/src/main/java/com/facebook/react/views/text/frescosupport/FrescoBasedReactTextInlineImageShadowNode.java
View File

@@ -18,7 +18,6 @@ import android.content.res.Resources;
import android.net.Uri;
import com.facebook.common.util.UriUtil;
import com.facebook.csslayout.CSSNodeDEPRECATED;
import com.facebook.drawee.controller.AbstractDraweeControllerBuilder;
import com.facebook.react.bridge.ReadableArray;
import com.facebook.react.uimanager.annotations.ReactProp;
@@ -26,7 +25,7 @@ import com.facebook.react.views.text.ReactTextInlineImageShadowNode;
import com.facebook.react.views.text.TextInlineImageSpan;
/**
* {@link CSSNodeDEPRECATED} that represents an inline image. Loading is done using Fresco.
* Shadow node that represents an inline image. Loading is done using Fresco.
*
*/
public class FrescoBasedReactTextInlineImageShadowNode extends ReactTextInlineImageShadowNode {
@@ -113,5 +112,4 @@ public class FrescoBasedReactTextInlineImageShadowNode extends ReactTextInlineIm
public @Nullable Object getCallerContext() {
return mCallerContext;
}
}