ネイティブカードのカルーセル表示に反応しますか？

Question

このような種類のビューをReact Nativeでどのように実現することができますか、またはこの問題に役立つ可能性のあるコンポーネントがありますか？

私はF8 2016アプリでも、水平スクロールで遷移とカルーセルのようなビューを達成する方法を探しています。

Answer 1

ScrollViewとすると、iOSではpaging enabled、AndroidではViewPagerAndroidとなります。

オープンソースアプリであることF8、 あなたはそれは実際に使っているものです見ることができます。 https://github.com/fbsamples/f8app/blob/master/js/common/ViewPager.js

をこのコンポーネントは、すべてのページをレンダリングします。

あなただけのメモリを節約するために、レンダリング可視および左右のページを持っているしたい場合は、それをしない、その上に構築された別のコンポーネントがあります：

：利用可能なさまざまな他の同様の実装があります https://github.com/fbsamples/f8app/blob/master/js/common/Carousel.js

• https://js.coach/react-native?search=carousel
• https://js.coach/react-native?search=swiper

しかし私はそれにいくつかの問題があったので、https://github.com/leecade/react-native-swiperを推薦していません。

Answer 2

質問は古いですが、同僚と私は最近、この特定のニーズに答えるコンポーネントを作成しなければならないことを知っています。オープンソース化が終わったので、試してみるのはあなたのすべてです：react-native-snap-carousel。

プラグインは現在、FlatList（バージョン> = 3.0.0）の上に構築されており、膨大な数のアイテムを処理するのに最適です。また、プレビュー（あなたが後にした効果）、スナップ効果、視差画像、RTLのサポート、および多くを提供します。

showcaseをご覧になると、これで達成できることを把握できます。私たちは常にそれを改善しようとしているので、あなたの経験をプラグインと共有するのをためらってください。

---

編集：two new layoutsバージョン3.6.0（火口のような効果を持つカードの効果と他のスタックを有するもの）に導入されています。楽しい！