Removing last item from carousel results in an empty space (Android)

[danvickers]

Is this a bug report, a feature request, or a question?

Bug report

Have you followed the required steps before opening a bug report?

• [x] I have read the guidelines regarding bug report.
• [x] I have reviewed the documentation in its entirety, including the dedicated documentations :books:.
• [x] I have searched for existing issues and made sure that the problem hasn't already been reported.
• [x] I am using the latest plugin version.
• [x] I am following the issue template closely in order to produce a useful bug report.

Have you made sure that it wasn't a React Native bug?

Yes as far as possible.

Is the bug specific to iOS or Android? Or can it be reproduced on both platforms?

Android

Is the bug reproducible in a production environment (not a debug one)?

Yes - it presents in a live version of our app

Environment

react-native-snap-carousel: 3.8.4 react-native@0.60.5 Android 9

Expected Behavior

When removing the last item from the data I expected the carousel to display the next available item as it does with start and middle list items and as it does on iOS.

Actual Behavior

An empty space is displayed

Reproducible Demo

https://snack.expo.io/@danjvee/react-native-snap-carousel-item-remove-bug---android

Steps to Reproduce

1. Preview the code on Android
2. Scroll right to the last item in the carousel.
3. Tap the item delete button
4. Observe the empty space

[DiegoMac95]

I have the same issue, a quick workaround I used was scrolling to the previous item after deleting.

[askemeline]

Hi, I have the same problem, can you explain more your solution @DiegoMac95 please

[ghost]

Hello, we have the same issue here, could you provide us any detailed informations ?

[DiegoMac95]

@askemeline When I delete an element from the carousel, I also use snapToPrev method to scroll to the previous element, manually doing what the carousel does in iOS, that deletes the empty space.

[askemeline]

Thanks for your response but I don't really understand when you use it without the onPress. I would like that android do it automatically when I delete the last element :/

[DiegoMac95]

@askemeline that's why you need to add the reference like this

<Carousel
  // LIKE THIS
  ref={(c) => { this._carousel = c; }}
/>

// now you can call it wherever you have access to the reference of the carousel
deleteAndSnap = () => {
     deleteElement();
     this._carousel.snapToPrev(); 
}

You don't actually need to use 'onPress', you can call the method anywhere in your component using that reference

[askemeline]

Thanks for your answer but I have still the bug :/

[askemeline]

My bad, is working, many thanks @DiegoMac95 :)

[AlexReusC]

What can I do if I have enableSnap={false}?

[dohooo]

Sorry, please allow me to advertise for my open source library! ~ I think this library react-native-reanimated-carousel will solve your problem. It is a high performance and very simple component, complete with React-Native reanimated 2

[wnikola]

Any updates on this? Still facing this issue.