react-native-carousel-banner

a cross-platform (iOS, Android, Web) react native carousel component

react-native-carousel-banner is a React Native component for building a cross-platform carousel.

Highlighted Features:

1. Cross Platform - uniform behaviors among iOS, Android and Web
2. Loop Cycle - support head-to-tail / tail-to-head loop cycle
3. Auto Play - auto play with smooth transition

Install

yarn add react-native-carousel-banner

Usage

a minimally-configured carousel

import Carousel from 'react-native-carousel-banner';

const DATA = [
  '/images/0.jpg',
  '/images/1.jpg',
  '/images/2.jpg',
];


<Carousel data={DATA} roundedSize={5} />

Props

Basic Props

Prop	Type	Default	Description
data	string[]	[]	the item data
height	number	170	height of image
roundedSize	number	0	borderRadius of image
autoplay	boolean	true	determine whether the auto play mode is enabled or not
autoplayInterval	number	5000	delay between item transitions in milliseconds
dotColor	string	#f97316	index dot backgroundColor
onChange	function	null	callback of index changed

Props of onChange

Prop	Type	Default	Description
currentIndex	number	0	the current page number
total	number	0	the total number of pages

License

MIT