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

Add percentage support to react native

Browse Source 
Summary:
Adds support for percentage value in react native.

syntax: property: 100 | property | '100%'

supported properties:
padding
margin
width
height
minWidth
minHeight
maxWidth
maxHeight
flexBasis

```
class Playground extends React.Component {
  render() {
    return (
      <View style={{backgroundColor: 'white', padding: 10, paddingTop: 30, height: '100%'}}>
        <Text>
          If you want to quickly test out something,
          open the Playground.js file and start coding.
        </Text>
        <View style={{backgroundColor: 'red', height: 50, width: 50}}/>
        <View style={{backgroundColor: 'blue', height: '50%', width: '50%'}}/>
      </View>
    );
  }
}
```

Reviewed By: astreet

Differential Revision: D4376549

fbshipit-source-id: c41d68a7555396f95d063a7527ee081773ac56dc
This commit is contained in:
Emil Sjolander
2017-01-11 03:58:03 -08:00
committed by Facebook Github Bot
parent 00d5674474
commit 3f49e743be
16 changed files with 567 additions and 216 deletions
Download Patch File Download Diff File Expand all files Collapse all files

15
ReactAndroid/src/main/java/com/facebook/react/flat/NativeViewWrapper.java
View File

@@ -18,6 +18,8 @@ import com.facebook.react.uimanager.ThemedReactContext;
import com.facebook.react.uimanager.UIViewOperationQueue;
import com.facebook.react.uimanager.ViewGroupManager;
import com.facebook.react.uimanager.ViewManager;
import com.facebook.yoga.YogaValue;
import com.facebook.yoga.YogaUnit;
/* package */ final class NativeViewWrapper extends FlatShadowNode implements AndroidView {
@@ -101,13 +103,24 @@ import com.facebook.react.uimanager.ViewManager;
@Override
public void setPadding(int spacingType, float padding) {
if (getStylePadding(spacingType) != padding) {
YogaValue current = getStylePadding(spacingType);
if (current.unit != YogaUnit.PIXEL || current.value != padding) {
super.setPadding(spacingType, padding);
mPaddingChanged = true;
markUpdated();
}
}
@Override
public void setPaddingPercent(int spacingType, float percent) {
YogaValue current = getStylePadding(spacingType);
if (current.unit != YogaUnit.PERCENT || current.value != percent) {
super.setPadding(spacingType, percent);
mPaddingChanged = true;
markUpdated();
}
}
@Override
public void onCollectExtraUpdates(UIViewOperationQueue uiViewOperationQueue) {
if (mReactShadowNode != null && mReactShadowNode.hasUnseenUpdates()) {