search

meliorence / react-native-snap-carousel

Swiper/carousel component for React Native featuring previews, multiple layouts, parallax images, performant handling of huge numbers of items, and more. Compatible with Android & iOS.
BSD 3-Clause "New" or "Revised" License
10.36k stars 2.29k forks source link

Show Both of Next and Previous Cards in "Stack Of Cards" layout #561

Open AlirezaAzizi145 opened 5 years ago

AlirezaAzizi145 commented 5 years ago

Hello guys. how can i create Something Like this in react-native-snap-carousel?

i think if we can show both of next and previous cards in "Stack of Cards" layout we can create it but i dont know how

tonylibra commented 5 years ago

I have the same problem. I did a quick experiment on the example project in the repo, and I found that zIndex cannot be an animation property.

AlirezaAzizi145 commented 5 years ago

snap_carousel i need to move this card behind the active card like left side

tonylibra commented 5 years ago

This is what I have, because of the zIndex cannot be animated Screen Shot 2019-08-05 at 09 15 30

AlirezaAzizi145 commented 5 years ago

@bd-arc any solution?

bd-arc commented 5 years ago

@AlirezaAzizi145 I've written extensively about it in the dedicated doc.

I encourage you to read everything related to the caveats since some of the workaround suggestions might fit your use case.

AlirezaAzizi145 commented 5 years ago

@bd-arc yes. i played with elevation instead z-index but still i have a problem

AlirezaAzizi145 commented 5 years ago

@bd-arc no solution? no sample?

AlirezaAzizi145 commented 5 years ago

@tonylibra Can You Find Any Solution? I Really Need This Carousel Style

bd-arc commented 5 years ago

@AlirezaAzizi145 You will probably need to rely on a custom PanResponder for that instead of on this plugin since the zIndex property can't be animated — RN limitation.

AlirezaAzizi145 commented 5 years ago

@tonylibra if you find any solution i will be grateful to send me the soulution

sebastijandumancic commented 5 years ago

This is shown like this in the example gif. Is there a prop to do this? Thanks!

bd-arc commented 5 years ago

@sebastijandumancic I don't recall any gif displaying one card on top of the ones before as well as the ones after.

Can you please share the link of the image you're referring to?

sebastijandumancic commented 5 years ago

@bd-arc Sorry, I was thinking about standard horizontal scroll which shows a bit of previous and next slide. I've achieved it using item width prop.

naveedulaziz commented 4 years ago

If anybody find any solution please share it with me. I also have to make something similar

yesw6a commented 4 years ago

I have the same problem. I did a quick experiment on the example project in the repo, and I found that zIndex cannot be an animation property.

Do you have any experienced code or demo?

dohooo commented 3 years ago

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