# leecade/react-native-swiper

**Attribution required: if you use, quote, or summarise this content, you must credit and link back to [awesome-repositories.com](https://awesome-repositories.com/repository/leecade-react-native-swiper).**

10,490 stars · 2,304 forks · JavaScript · MIT

## Links

- GitHub: https://github.com/leecade/react-native-swiper
- awesome-repositories: https://awesome-repositories.com/repository/leecade-react-native-swiper.md

## Description

react-native-swiper is a cross-platform mobile carousel component that provides a swipeable interface for cycling through content panels. It supports both horizontal and vertical transitions and includes a visual pagination system using customizable indicators like dots or numbers to track the user's position.

The component features a lazy-loading mechanism that defers the rendering of off-screen content to reduce memory usage and improve initial load times. It supports infinite looping, automated slide transitions via a timer, and programmatic navigation control to move the slider to specific indices.

The library handles slide change event tracking through callbacks and provides interactive controls for manual navigation. These capabilities cover the implementation of mobile galleries, onboarding screen flows, and rotating content sliders.

## Tags

### User Interface & Experience

- [Content Sliders](https://awesome-repositories.com/f/user-interface-experience/content-sliders.md) — Provides a swipeable interface for navigating sequences of content panels horizontally or vertically. ([source](https://github.com/leecade/react-native-swiper#readme))
- [Carousel Components](https://awesome-repositories.com/f/user-interface-experience/carousel-components.md) — A cross-platform swipeable slider for mobile apps supporting automatic scrolling and multiple transition directions.
- [Carousels](https://awesome-repositories.com/f/user-interface-experience/carousels.md) — Implements a rotating content slider for React Native with automatic transitions and custom styling.
- [Pagination Indicators](https://awesome-repositories.com/f/user-interface-experience/pagination-indicators.md) — Ships customizable pagination indicators such as dots or numbers to show the current slide position. ([source](https://github.com/leecade/react-native-swiper/blob/master/index.js.flow))
- [Scroll-Based Pagination](https://awesome-repositories.com/f/user-interface-experience/scroll-based-pagination.md) — Uses a scrollable container to manage the layout and movement of slide content panels.
- [Interval Timers](https://awesome-repositories.com/f/user-interface-experience/animation-and-motion-systems/configuration-utility-helpers/animation-properties/interval-timers.md) — Utilizes interval timers to programmatically trigger slide transitions for an automated rotating effect.
- [Carousel Transition Effects](https://awesome-repositories.com/f/user-interface-experience/carousel-transition-effects.md) — Supports automated slide advancement on a timer to create a rotating carousel effect. ([source](https://github.com/leecade/react-native-swiper#readme))
- [Content Carousels](https://awesome-repositories.com/f/user-interface-experience/content-display-components/content-carousels.md) — Provides a content carousel that supports infinite looping back to the first item. ([source](https://github.com/leecade/react-native-swiper/blob/master/ROADMAP.md))
- [Media Galleries](https://awesome-repositories.com/f/user-interface-experience/media-galleries.md) — Enables the creation of swipeable image galleries and product showcases.
- [Navigation Controls](https://awesome-repositories.com/f/user-interface-experience/navigation-controls.md) — Includes interactive buttons and title displays for manual slide navigation and position tracking. ([source](https://github.com/leecade/react-native-swiper/blob/master/index.d.ts))
- [Onboarding Flows](https://awesome-repositories.com/f/user-interface-experience/onboarding-flows.md) — Facilitates building swipeable welcome screens to guide new users through app features one page at a time.
- [Programmatic Section Navigation](https://awesome-repositories.com/f/user-interface-experience/programmatic-section-navigation.md) — Offers API calls to programmatically move the slider to a specific index with custom animations. ([source](https://github.com/leecade/react-native-swiper/blob/master/CHANGELOG.md))
- [Windowed Rendering](https://awesome-repositories.com/f/user-interface-experience/virtual-rendering/rendering-optimizations/windowed-rendering.md) — Optimizes memory usage by rendering only the active slide and a minimal buffer of adjacent items. ([source](https://github.com/leecade/react-native-swiper#readme))
- [Windowed Rendering](https://awesome-repositories.com/f/user-interface-experience/windowed-rendering.md) — Implements a lazy-loading mechanism that renders only the active slide and its immediate neighbors.

### Part of an Awesome List

- [Index Navigation](https://awesome-repositories.com/f/awesome-lists/devtools/carousel-and-gallery/index-navigation.md) — Tracks the active slide via a numeric index to synchronize the content and navigation UI.
- [UI Components](https://awesome-repositories.com/f/awesome-lists/devtools/ui-components.md) — A popular component for creating image or content carousels.

### Programming Languages & Runtimes

- [Component](https://awesome-repositories.com/f/programming-languages-runtimes/dynamic-class-creation/class-loading-mechanisms/lazy-loading/component.md) — Implements a mechanism to defer the rendering of off-screen content to improve initial load times and memory usage.

### Software Engineering & Architecture

- [Index Looping](https://awesome-repositories.com/f/software-engineering-architecture/human-in-the-loop-workflows/index-looping.md) — Implements infinite cycling by wrapping the slide index back to zero after the final item.