meliorence/react-native-snap-carousel

Multiple active items in each screen

Open

#102 opened on Jul 26, 2017

View on GitHub
 (46 comments) (10 reactions) (0 assignees)JavaScript (10,045 stars) (2,223 forks)batch import
*featurehelp wantedreact-native bug

Description

Would it be possible to have multiple items at one slide just like Apple Music:

Would the right approach be to change data such that all elements are grouped with two elements in each group and then print the two elements side-by-side when rendering each item?

However, Airbnb has the same feature where no items are active, but you can only scroll such that two elements are always visible. Can the same behaviour be achieved with the right size options with react-native-snap-carousel?

Contributor guide

Tech stack
javascriptreact
Domain
mobile
Issue type
feature
DifficultyEstimated implementation difficulty for a new contributor, from 1 for very small changes to 5 for expert-level work.
3
Estimated timeA rough time range for an experienced contributor to investigate, implement, test, and prepare a pull request.
1-2 days
Activity statusHow available the issue appears right now: fresh, active, stale, blocked, or waiting on maintainer input.
stale
ClarityHow clearly the issue explains the expected change, acceptance criteria, and next step.
mostly clear
Prerequisites
React Native basicsUnderstanding of carousel component
Newbie friendlinessA 1-100 score estimating how approachable this issue is for first-time contributors.
35
Research direction
Review the discussion in issue #102 for proposed approaches. The goal is to display multiple items per slide, similar to Apple Music. Examine the component's rendering logic in the source file (e.g., Carousel.js) to understand how items are currently laid out. Consider modifying the data to group items in pairs and adjusting the slider dimensions. Also explore the Airbnb style behavior where no items are active but two are always visible. Check if the existing props or layout options can achieve this without major refactoring.