react-native-swiper

2432 단어 react-native
설치하다.npm install react-native-swiper --save
끌어들이다
import React,{Component} from 'react';
import { View,Text,StyleSheet,Alert } from 'react-native';
import Swiper from 'react-native-swiper';

render 중:
}
     activeDot={}
     paginationStyle={{
         position:'absolute',
         top:0,
         left:0
     }}
     nextButton={}
     prevButton={}
     buttonWrapperStyle={{
         backgroundColor:'#transparent',
         flexDirection: 'row',
         position: 'absolute',
         top: 0,
         left: 0,
         flex: 1,
         paddingHorizontal: 10,
         paddingVertical: 10,
         justifyContent: 'space-between',
         alignItems: 'center'
     }}
     onIndexChanged={this.onIndexChange.bind(this)}>
 
     Hello Swiper
 
 
     Beautiful
 
 
     And simple
 


style
const styles = StyleSheet.create({
    wrapper: {
        flexGrow:1
    },
    slide1: {
        // flex: 1,
        height:300,
        justifyContent: 'center',
        alignItems: 'center',
        backgroundColor: '#9DD6EB',
    },
    slide2: {
        // flex: 1,
        height:300,
        justifyContent: 'center',
        alignItems: 'center',
        backgroundColor: '#97CAE5',
    },
    slide3: {
        // flex: 1,
        height:300,
        justifyContent: 'center',
        alignItems: 'center',
        backgroundColor: '#92BBD9',
    },
    text: {
        color: '#fff',
        fontSize: 30,
        fontWeight: 'bold',
    }
})

좋은 웹페이지 즐겨찾기