Skip to content

Instantly share code, notes, and snippets.

@ashrithks
Created October 31, 2017 13:55
Show Gist options
  • Save ashrithks/8d97f928d92643468a26e29c4d2dbb67 to your computer and use it in GitHub Desktop.
Save ashrithks/8d97f928d92643468a26e29c4d2dbb67 to your computer and use it in GitHub Desktop.
nestedScrollview in react native
import React, { Component } from 'react';
import { View, ScrollView } from 'react-native';
export default class App extends Component {
constructor() {
super();
this.state = {
enabled:true
};
}
render() {
return (
<ScrollView
scrollEnabled={this.state.enabled}
>
<View style={{height:600,backgroundColor:'violet'}}></View>
<View style={{ height: 2000, backgroundColor: 'red' }} >
<ScrollView
onTouchStart={(ev) => {
this.setState({enabled:false }); }}
onMomentumScrollEnd={(e) => { this.setState({ enabled:true }); }}
onScrollEndDrag={(e) => { this.setState({ enabled:true }); }}
style={{ margin: 10, maxHeight: 200 }} >
<View style={{ height: 200, backgroundColor: 'blue' }} />
<View style={{ height: 200, backgroundColor: 'pink' }} />
<View style={{ height: 200, backgroundColor: 'blue' }} />
<View style={{ height: 200, backgroundColor: 'pink' }} />
<View style={{ height: 200, backgroundColor: 'blue' }} />
<View style={{ height: 200, backgroundColor: 'pink' }} />
<View style={{ height: 200, backgroundColor: 'blue' }} />
<View style={{ height: 200, backgroundColor: 'pink' }} />
<View style={{ height: 200, backgroundColor: 'blue' }} />
<View style={{ height: 200, backgroundColor: 'pink' }} />
<View style={{ height: 200, backgroundColor: 'blue' }} />
<View style={{ height: 200, backgroundColor: 'pink' }} />
</ScrollView>
</View>
</ScrollView>
);
}
}
@shiny852
Copy link

Hello, please is there a chance to scroll content of app using buttons ? I have 2 buttons, up and down. How can i make it slowly scroll up or down ?

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment