5
A simple swipeable card carousel for react native
source link: https://reactnativeexample.com/a-simple-swipeable-card-carousel-for-react-native/
Go to the source link to view the article. You can view the picture content, updated content and better typesetting reading experience. If the link is broken, please click the button below to view the snapshot at that time.
React Native Swipeable Carousel
A simple swipeable carousel created on the top of react-native-pager-view
Preview
Get started
Pre-requisites
Since this package is created on the top of react native pager view and other libraries. So first you need to install them.
yarn add react-native-size-matters react-native-pager-view react-native-svg
Installation
yarn add react-native-swipeable-carousel
Usage
import Carousel from 'react-native-swipeable-carousel';
// imagePath can get images URL or imported images.
const data = [
"https://cdn.pixabay.com/photo/2017/12/09/16/41/snow-man-3008179_1280.jpg",
"https://cdn.pixabay.com/photo/2017/12/09/16/42/snow-man-3008179_1280.jpg"
];
<Carousel
images={data}
enableGestureSwipe={true}
/>Properties
| Prop | Description | Default | Required |
|---|---|---|---|
images |
An array of images (urls or local). | None | Yes |
height |
Carousel height. | 200 |
No |
width |
Carousel width. | 400 |
No |
enableGestureSwipe |
Enable gesture swipe(left/right). | false |
No |
Peer dependencies
- react-native-pager-view
- react-native-size-matters
- react-native-svg
License
This project is licenced under the MIT License.
GitHub
Recommend
About Joyk
Aggregate valuable and interesting links.
Joyk means Joy of geeK