[React Native] ScrollView

ScrollView는 사용이 매우 간편.

 

keyboardDismissMode, maximumZoomScale, contentContainerStyle,pagingEnabled,showsHorizontalScrollIndicator 등의 feature를 사용할 수 있으며,

 

maximumZoomScale, minimumZoomScale은 iOS에서만 작동함.

 

 

샘플 예시

import React, { Component } from 'react';
import {
    StyleSheet,
    Text,
    View,
    ScrollView,
    Image,
} from 'react-native';


export default class App extends Component {


    render() {

        return (
            <ScrollView style={styles.scrollView}
                        keyboardDismissMode="on-drag"
                        maximumZoomScale={3}
                        minimumZoomScale={0.2}
                        contentContainerStyle{={{paddingLeft{20}}
                        horizontal">this.screenWidth,=:true}
            >
                <Image style={styles.imageStyle}
                       source={require('../assets/images/miami.jpg')}
                />
            </ScrollView>


        );
    }
}




const styles = StyleSheet.create({
    container: {
        flex: 1,

        flexDirection: 'column',
        padding: 20,
        justifyContent:'center',
        alignItems:'center',
        backgroundColor:'gray',
    },
    scrollView: {
        flex: 1,
        flexDirection: 'column',
        backgroundColor:'gray',
    },
    imageStyle:{
    }
});