页面滚动，ScrollView

在上一节介绍tab菜单导航的时候实现了首页，但是首页内容较多的时候滑动页面是没反应的，可以使用ScrollView实现：

引入组件import ScrollView from 'react-native'

import {
   
    View,
    Text,
    ScrollView,
    RefreshControl,
   
} from 'react-native'ative

render() {
	construct(props){
	    super(props);
		
	    this.state = {
    		isRefreshing: false//控制刷新图标显示与否
	    }
	}
	
	_onRefresh(){//刷新触发事件
    	this.setState({isRefreshing: true});
    	setTimeout(() => {
        	this.setState({isRefreshing: false});
    	}, 2000)
	}

    return (
        <View Style={styles.container}>
            <ScrollView
		refreshControl={<RefreshControl//此组件下拉即可触发事件，实现刷新
    		refreshing={this.state.isRefreshing}//为true则一直显示刷新图标
    		onRefresh={this._onRefresh.bind(this)}
    		colors={['red', 'yellow','black']}//刷新圆圈依次并循环展示这些颜色
    		progressBackgroundColor="#ffffff"//下拉刷新图标背景色
		/>}

		>
                <Text style={{backgroundColor:'pink',height:100}}>首页部分fdfd</Text>
                <Text>首页部分fdfd</Text>
                <Text style={{backgroundColor:'pink',height:100}}>首页部分fdfd</Text>
                <Text>首页部分fdfd</Text>
                <Text style={{backgroundColor:'pink',height:100}}>首页部分fdfd</Text>
                <Text>首页部分fdfd</Text>
                <Text style={{backgroundColor:'pink',height:100}}>首页部分fdfd</Text>
                <Text>首页部分fdfd</Text><Text>首页部分fdfd</Text>
                <Text>首页部分fdfd</Text>
                <Text>首页部分fdfd</Text>
                <Text>首页部分fdfd</Text>
                <Text>首页部分fdfd</Text><Text>首页部分fdfd</Text>
                <Text>首页部分fdfd</Text>
                <Text>首页部分fdfd</Text>
                <Text>首页部分fdfd</Text>
                <Text>首页部分fdfd</Text>
                <Text>首页部分fdfd</Text>
            </ScrollView>
        </View>
    ) 

这样即可实现页面滚动以及下拉刷新了