Ability to disable/lock the android ViewPager scroll from props

Summary:
This is a nice feature to have.

I've tested this by copying and renaming the ViewPager java and javascript files from the react-native repo and including them in a project. Whats the best way to test this directly from the repo?
Closes https://github.com/facebook/react-native/pull/5968

Differential Revision: D3240651

Pulled By: mkonicek

fbshipit-source-id: 5f1d157216df4f3314915496188a92aec1b85e91
This commit is contained in:
Kevin Johnson 2016-05-11 16:50:12 -07:00 committed by Facebook Github Bot 8
parent c3714d7ed7
commit 31250ad150
3 changed files with 16 additions and 2 deletions

View File

@ -109,6 +109,7 @@ var ViewPagerAndroidExample = React.createClass({
return { return {
page: 0, page: 0,
animationsAreEnabled: true, animationsAreEnabled: true,
scrollEnabled: true,
progress: { progress: {
position: 0, position: 0,
offset: 0, offset: 0,
@ -167,6 +168,7 @@ var ViewPagerAndroidExample = React.createClass({
<ViewPagerAndroid <ViewPagerAndroid
style={styles.viewPager} style={styles.viewPager}
initialPage={0} initialPage={0}
scrollEnabled={this.state.scrollEnabled}
onPageScroll={this.onPageScroll} onPageScroll={this.onPageScroll}
onPageSelected={this.onPageSelected} onPageSelected={this.onPageSelected}
onPageScrollStateChanged={this.onPageScrollStateChanged} onPageScrollStateChanged={this.onPageScrollStateChanged}
@ -174,6 +176,13 @@ var ViewPagerAndroidExample = React.createClass({
ref={viewPager => { this.viewPager = viewPager; }}> ref={viewPager => { this.viewPager = viewPager; }}>
{pages} {pages}
</ViewPagerAndroid> </ViewPagerAndroid>
<View style={styles.buttons}>
<Button
enabled={true}
text={this.state.scrollEnabled ? 'Scroll Enabled' : 'Scroll Disabled'}
onPress={() => this.setState({scrollEnabled: !this.state.scrollEnabled})}
/>
</View>
<View style={styles.buttons}> <View style={styles.buttons}>
{ animationsAreEnabled ? { animationsAreEnabled ?
<Button <Button

View File

@ -128,7 +128,7 @@ var ViewPagerAndroid = React.createClass({
* When false, the content does not scroll. * When false, the content does not scroll.
* The default value is true. * The default value is true.
*/ */
scrollEnabled: React.PropTypes.bool, scrollEnabled: ReactPropTypes.bool,
}, },
componentDidMount: function() { componentDidMount: function() {

View File

@ -142,7 +142,11 @@ import com.facebook.react.uimanager.events.NativeGestureUtil;
@Override @Override
public boolean onInterceptTouchEvent(MotionEvent ev) { public boolean onInterceptTouchEvent(MotionEvent ev) {
if (mScrollEnabled && super.onInterceptTouchEvent(ev)) { if (!mScrollEnabled) {
return false;
}
if (super.onInterceptTouchEvent(ev)) {
NativeGestureUtil.notifyNativeGestureStarted(this, ev); NativeGestureUtil.notifyNativeGestureStarted(this, ev);
return true; return true;
} }
@ -154,6 +158,7 @@ import com.facebook.react.uimanager.events.NativeGestureUtil;
if (!mScrollEnabled) { if (!mScrollEnabled) {
return false; return false;
} }
return super.onTouchEvent(ev); return super.onTouchEvent(ev);
} }