JSPM

react-native-carousel-banner

1.0.3
  • ESM via JSPM
  • ES Module Entrypoint
  • Export Map
  • Keywords
  • License
  • Repository URL
  • TypeScript Types
  • README
  • Created
  • Published
  • Downloads 14
  • Score
    100M100P100Q48706F
  • License ISC

Image Carousel

Package Exports

  • react-native-carousel-banner
  • react-native-carousel-banner/index.js

This package does not declare an exports field, so the exports above have been automatically detected and optimized by JSPM instead. If any package subpath is missing, it is recommended to post an issue to the original package (react-native-carousel-banner) to support the "exports" field. If that is not possible, create a JSPM override to customize the exports field for this package.

Readme

react-native-carousel-banner

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

npm GitHub issues NPM

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