status-im
/
react-native
mirror of https://github.com/status-im/react-native.git
2
0
Fork 0
Code Issues Projects Releases Wiki Activity

Add prop to FbReactScrollView to fill the rest of the background to avoid overdraw 

Reviewed By: foghina

Differential Revision: D3079290

fb-gh-sync-id: b824d235ca34f8e0408f5f40e6b73e028006ac9f
fbshipit-source-id: b824d235ca34f8e0408f5f40e6b73e028006ac9f
This commit is contained in:
Nathan Spaun 2016-03-30 18:05:06 -07:00 committed by Facebook Github Bot 7
parent 9d49cf095b
commit 4498bc8197
5 changed files with 86 additions and 0 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

10
Libraries/Components/ScrollView/ScrollView.js
View File

@ -11,6 +11,7 @@
*/
'use strict';
var ColorPropType = require('ColorPropType');
var EdgeInsetsPropType = require('EdgeInsetsPropType');
var Platform = require('Platform');
var PointPropType = require('PointPropType');
@ -318,6 +319,15 @@ var ScrollView = React.createClass({
PropTypes.func,
'Use the `refreshControl` prop instead.'
),
/**
* Sometimes a scrollview takes up more space than its content fills. When this is
* the case, this prop will fill the rest of the scrollview with a color to avoid setting
* a background and creating unnecessary overdraw. This is an advanced optimization
* that is not needed in the general case.
* @platform android
*/
endFillColor: ColorPropType,
},
mixins: [ScrollResponder.Mixin],

25
ReactAndroid/src/main/java/com/facebook/react/views/scroll/ReactHorizontalScrollView.java
View File

@ -12,7 +12,11 @@ package com.facebook.react.views.scroll;
import javax.annotation.Nullable;
import android.content.Context;
import android.graphics.Canvas;
import android.graphics.Color;
import android.graphics.Rect;
import android.graphics.drawable.ColorDrawable;
import android.graphics.drawable.Drawable;
import android.view.MotionEvent;
import android.view.View;
import android.widget.HorizontalScrollView;
@ -38,6 +42,8 @@ public class ReactHorizontalScrollView extends HorizontalScrollView implements
private boolean mRemoveClippedSubviews;
private boolean mScrollEnabled = true;
private boolean mSendMomentumEvents;
private @Nullable Drawable mEndBackground;
private int mEndFillColor = Color.TRANSPARENT;
public ReactHorizontalScrollView(Context context) {
super(context);
@ -185,4 +191,23 @@ public class ReactHorizontalScrollView extends HorizontalScrollView implements
public void getClippingRect(Rect outClippingRect) {
outClippingRect.set(Assertions.assertNotNull(mClippingRect));
}
public void setEndFillColor(int color) {
if (color != mEndFillColor) {
mEndFillColor = color;
mEndBackground = new ColorDrawable(mEndFillColor);
}
}
@Override
public void draw(Canvas canvas) {
if (mEndFillColor != Color.TRANSPARENT) {
final View content = getChildAt(0);
if (mEndBackground != null && content != null && content.getRight() < getWidth()) {
mEndBackground.setBounds(content.getRight(), 0, getWidth(), getHeight());
mEndBackground.draw(canvas);
}
}
super.draw(canvas);
}
}

13
ReactAndroid/src/main/java/com/facebook/react/views/scroll/ReactHorizontalScrollViewManager.java
View File

@ -11,6 +11,8 @@ package com.facebook.react.views.scroll;
import javax.annotation.Nullable;
import android.graphics.Color;
import com.facebook.react.bridge.ReadableArray;
import com.facebook.react.uimanager.annotations.ReactProp;
import com.facebook.react.uimanager.ThemedReactContext;
@ -85,4 +87,15 @@ public class ReactHorizontalScrollViewManager
scrollView.scrollTo(data.mDestX, data.mDestY);
}
}
/**
* When set, fills the rest of the scrollview with a color to avoid setting a background and
* creating unnecessary overdraw.
* @param view
* @param color
*/
@ReactProp(name = "endFillColor", defaultInt = Color.TRANSPARENT, customType = "Color")
public void setBottomFillColor(ReactHorizontalScrollView view, int color) {
view.setEndFillColor(color);
}
}

25
ReactAndroid/src/main/java/com/facebook/react/views/scroll/ReactScrollView.java
View File

@ -12,7 +12,11 @@ package com.facebook.react.views.scroll;
import javax.annotation.Nullable;
import android.content.Context;
import android.graphics.Canvas;
import android.graphics.Color;
import android.graphics.Rect;
import android.graphics.drawable.ColorDrawable;
import android.graphics.drawable.Drawable;
import android.view.MotionEvent;
import android.view.View;
import android.widget.ScrollView;
@ -41,6 +45,8 @@ public class ReactScrollView extends ScrollView implements ReactClippingViewGrou
private boolean mRemoveClippedSubviews;
private boolean mScrollEnabled = true;
private boolean mSendMomentumEvents;
private @Nullable Drawable mEndBackground;
private int mEndFillColor = Color.TRANSPARENT;
public ReactScrollView(Context context) {
super(context);
@ -187,4 +193,23 @@ public class ReactScrollView extends ScrollView implements ReactClippingViewGrou
postOnAnimationDelayed(r, ReactScrollViewHelper.MOMENTUM_DELAY);
}
}
@Override
public void draw(Canvas canvas) {
if (mEndFillColor != Color.TRANSPARENT) {
final View content = getChildAt(0);
if (mEndBackground != null && content != null && content.getBottom() < getHeight()) {
mEndBackground.setBounds(0, content.getBottom(), getWidth(), getHeight());
mEndBackground.draw(canvas);
}
}
super.draw(canvas);
}
public void setEndFillColor(int color) {
if (color != mEndFillColor) {
mEndFillColor = color;
mEndBackground = new ColorDrawable(mEndFillColor);
}
}
}

13
ReactAndroid/src/main/java/com/facebook/react/views/scroll/ReactScrollViewManager.java
View File

@ -13,6 +13,8 @@ import javax.annotation.Nullable;
import java.util.Map;
import android.graphics.Color;
import com.facebook.react.bridge.ReadableArray;
import com.facebook.react.common.MapBuilder;
import com.facebook.react.uimanager.annotations.ReactProp;
@ -70,6 +72,17 @@ public class ReactScrollViewManager
view.setSendMomentumEvents(sendMomentumEvents);
}
/**
* When set, fills the rest of the scrollview with a color to avoid setting a background and
* creating unnecessary overdraw.
* @param view
* @param color
*/
@ReactProp(name = "endFillColor", defaultInt = Color.TRANSPARENT, customType = "Color")
public void setBottomFillColor(ReactScrollView view, int color) {
view.setEndFillColor(color);
}
@Override
public @Nullable Map<String, Integer> getCommandsMap() {
return ReactScrollViewCommandHelper.getCommandsMap();