dohooo / react-native-reanimated-carousel

🎠 React Native swiper/carousel component, fully implemented using reanimated v2, support to iOS/Android/Web. (Swiper/Carousel)
https://react-native-reanimated-carousel.vercel.app
MIT License
2.74k stars 317 forks source link

Card item with a set width will not be not centered on IOS #380

Open puddinator opened 1 year ago

puddinator commented 1 year ago

Describe the bug If the renderItem item has a set width that is not the full window width, all the items will not be centered in the carousel. Strangely this only affects IOS not android.

To Reproduce Steps to reproduce the behavior:

  1. Create a carousel (should be any animation)
  2. Render an item and set a width that is not window width
  3. Open the app on IOS
  4. All the items are not centered

Expected behavior Items should be centered. Removing the set width, or setting width to window dimension solves the issue.

Versions (please complete the following information):

Smartphone (please complete the following information):

Zaccheuss commented 1 year ago

I had a similar issue where my rendered items had a set width and weren't being centered. This occurred on both iOS and Android for me.

Setting the rendered item's style to include alignSelf: 'center' fixed the issue for me.