{"id":14974369,"url":"https://github.com/logisticinfotech/react-native-custom-swiper","last_synced_at":"2025-10-27T06:32:17.464Z","repository":{"id":57336423,"uuid":"159505734","full_name":"logisticinfotech/react-native-custom-swiper","owner":"logisticinfotech","description":"React Native Custom Swiper","archived":false,"fork":false,"pushed_at":"2020-01-11T05:19:45.000Z","size":16317,"stargazers_count":13,"open_issues_count":1,"forks_count":5,"subscribers_count":5,"default_branch":"master","last_synced_at":"2025-02-01T03:24:03.278Z","etag":null,"topics":["android","custom-swiper","library","logistic-infotech","mobile-application","react-native","react-native-app","react-native-swiper","swiper"],"latest_commit_sha":null,"homepage":"https://www.logisticinfotech.com/blog/custom-swiper-react-native-flatlist/","language":"JavaScript","has_issues":true,"has_wiki":null,"has_pages":null,"mirror_url":null,"source_name":null,"license":"mit","status":null,"scm":"git","pull_requests_enabled":true,"icon_url":"https://github.com/logisticinfotech.png","metadata":{"files":{"readme":"README.md","changelog":null,"contributing":null,"funding":null,"license":"LICENSE","code_of_conduct":null,"threat_model":null,"audit":null,"citation":null,"codeowners":null,"security":null,"support":null}},"created_at":"2018-11-28T13:23:38.000Z","updated_at":"2021-10-03T14:51:36.000Z","dependencies_parsed_at":"2022-09-03T08:00:33.824Z","dependency_job_id":null,"html_url":"https://github.com/logisticinfotech/react-native-custom-swiper","commit_stats":null,"previous_names":[],"tags_count":7,"template":false,"template_full_name":null,"repository_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/logisticinfotech%2Freact-native-custom-swiper","tags_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/logisticinfotech%2Freact-native-custom-swiper/tags","releases_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/logisticinfotech%2Freact-native-custom-swiper/releases","manifests_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/logisticinfotech%2Freact-native-custom-swiper/manifests","owner_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/owners/logisticinfotech","download_url":"https://codeload.github.com/logisticinfotech/react-native-custom-swiper/tar.gz/refs/heads/master","host":{"name":"GitHub","url":"https://github.com","kind":"github","repositories_count":238455169,"owners_count":19475404,"icon_url":"https://github.com/github.png","version":null,"created_at":"2022-05-30T11:31:42.601Z","updated_at":"2022-07-04T15:15:14.044Z","host_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub","repositories_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories","repository_names_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repository_names","owners_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/owners"}},"keywords":["android","custom-swiper","library","logistic-infotech","mobile-application","react-native","react-native-app","react-native-swiper","swiper"],"created_at":"2024-09-24T13:50:28.237Z","updated_at":"2025-10-27T06:32:15.834Z","avatar_url":"https://github.com/logisticinfotech.png","language":"JavaScript","funding_links":[],"categories":[],"sub_categories":[],"readme":"\u003cp align=\"left\"\u003e\n  \u003ca href=\"https://www.npmjs.com/package/react-native-custom-swiper\"\u003e\u003cimg alt=\"npm version\" src=\"https://img.shields.io/badge/npm-v1.0.16-green.svg\"\u003e\u003c/a\u003e\n  \u003ca href=\"https://www.npmjs.com/package/react-native-custom-swiper\"\u003e\u003cimg src=\"https://img.shields.io/badge/downloads-%3E1K-yellow.svg\"\u003e\u003c/a\u003e\n  \u003ca href=\"https://www.npmjs.com/package/react-native-custom-swiper\"\u003c\u003e\u003cimg src=\"https://img.shields.io/badge/license-MIT-orange.svg\"\u003e\u003c/a\u003e\n\u003c/p\u003e\n\n### React Native custom swiper using Flatlist\n\nUse images or custom views for swiping, Please refer [this blog](https://www.logisticinfotech.com/blog/custom-swiper-react-native-flatlist/) to use this library.\n\n# Installation\n\n```\nnpm i react-native-custom-swiper\n```\n\n![](RNCustomSwiper.gif)\n\n### Properties\n\n#### Basic\n\n| Prop               |                          Default                          |    Type    | Description                                     |\n| :----------------- | :-------------------------------------------------------: | :--------: | :---------------------------------------------- |\n| swipeData          |                            []                             |  `array`   | Array of data which user want to show in swiper |\n| renderSwipeItem    |                          ()=\u003e{}                           | `function` | Create element of swiper                        |\n| currentSelectIndex |                             0                             |  `number`  | Index of initial screen.                        |\n| showSwipeBtn       |                           true                            |   `bool`   | For hide or show left/right button              |\n| style              |                       Default style                       |  `object`  | Change swiper style                             |\n| onScreenChange     |                       (index) =\u003e {}                       |   `func`   | Function call when screen changed               |\n| leftButtonImage    |  Default left Arrow source {required(\"leftArrowString\")}  |  `string`  | Modify left arrow image                         |\n| rightButtonImage   | Default right Arrow source {required(\"rightArrowString\")} |  `string`  | Modify right arrow image                        |\n| containerWidth     |                       Screen width                        |  `number`  | Customize swiper screen width                   |\n| backgroundColor    |                          \"white\"                          |  `string`  | Customize swiper background color               |\n| autoplay           |                           true                            |   `bool`   | Change slide index automatically                |\n| autoplayTimeout    |                           2500                            |  `number`  | Delay between every slide (in Second)           |\n","project_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Flogisticinfotech%2Freact-native-custom-swiper","html_url":"https://awesome.ecosyste.ms/projects/github.com%2Flogisticinfotech%2Freact-native-custom-swiper","lists_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Flogisticinfotech%2Freact-native-custom-swiper/lists"}