👨‍💻 react-native-image-carousel-slider

version 1.0.9

BUILD SETUP

1
2## Installation
3
4npm install react-native-image-carousel-slider --save
5
6
7

USAGE

1
2import CarouselDisplay from react-native-image-carousel-slider
3const image = ['https://www.bradykesner.com/wp-content/uploads/2016/11/clingmans-dome-sunset-smoky-mountain-national-park-1030x687.jpg',
4'https://www.nps.gov/blri/learn/nature/images/Bear-Trap-Gap-MP-428-robert-Stevens-web.jpg?maxwidth=1200&maxheight=1200&autorotate=false',
5'https://static.rootsrated.com/image/upload/s--U0wjV1dP--/t_rr_large_traditional/kzw1j2a9jcad36x6ytof.jpg'
6]
7class App extends Component {
8    state={
9        active:0
10    }
11     handleMovements = ({nativeEvent}) => {
12    const slide = Math.ceil(
13      nativeEvent.contentOffset.x / nativeEvent.layoutMeasurement.width,
14    );
15    if (slide !== this.state.active) {
16      this.setState({
17        active: slide,
18      });
19    }
20  };
21    render(){
22        return(
23            <CarouselDisplay 
24            screen={'DisplayFullImages'} 
25          fixedData={carDetails[1].image}
26          screenNavigation={this.props.navigation}
27          active={this.state.active}
28          handleMovements={this.handleMovements}
29        />
30
31       
32        )
33    }
34}

Current API(Property)

Property	Type	Description
screen	PropTypes.string	(optional)Screen Navigation and will passing property 'detailImage' as array
fixedData	PropTypes.array	(required) Array Of Image
screenNavigation	PropTypes.function	(optional) navigation function
active	PropTypes.number	display active image that choosed
handleMovements	PropTypes.object	Native Event

Project Documentation

• Author Account

1Arwy Syahputra Siregar
2github.com/arwysyah
3

Copyright ©

by Arwy Syahputra Siregar