How to use react-native-snap-carousel - 10 common examples

To help you get started, we’ve selected a few react-native-snap-carousel examples, based on popular ways it is used in public projects.

Secure your code as it's written. Use Snyk Code to scan source code in minutes - no build needed - and fix issues immediately.

github jolocom / smartwallet-app / src / ui / landing / components / landing.tsx View on Github external
private scrollInterpolator(index: number, carouselProps: CarouselProps) {
    const range = [1, 0, -1]
    const inputRange = getInputRangeFromIndexes(range, index, carouselProps)
    return { inputRange, outputRange: range }
  }
github TrustTheBoy / react-native-component-redux / src / equipment / animations.js View on Github external
function scrollInterpolator2(index, carouselProps) {
    const range = [2, 1, 0, -1];
    const inputRange = getInputRangeFromIndexes(range, index, carouselProps);
    const outputRange = range;

    return { inputRange, outputRange };
}
function animatedStyles2(index, animatedValue, carouselProps) {
github archriss / react-native-snap-carousel / example / src / utils / animations.js View on Github external
function scrollInterpolator2 (index, carouselProps) {
    const range = [2, 1, 0, -1];
    const inputRange = getInputRangeFromIndexes(range, index, carouselProps);
    const outputRange = range;

    return { inputRange, outputRange };
}
function animatedStyles2 (index, animatedValue, carouselProps) {
github archriss / react-native-snap-carousel / example / src / utils / animations.js View on Github external
function scrollInterpolator3 (index, carouselProps) {
    const range = [2, 1, 0, -1];
    const inputRange = getInputRangeFromIndexes(range, index, carouselProps);
    const outputRange = range;

    return { inputRange, outputRange };
}
function animatedStyles3 (index, animatedValue, carouselProps) {
github TrustTheBoy / react-native-component-redux / src / equipment / animations.js View on Github external
function scrollInterpolator4(index, carouselProps) {
    const range = [1, 0, -1];
    const inputRange = getInputRangeFromIndexes(range, index, carouselProps);
    const outputRange = range;

    return { inputRange, outputRange };
}
function animatedStyles4(index, animatedValue, carouselProps) {
github archriss / react-native-snap-carousel / example / src / utils / animations.js View on Github external
function scrollInterpolator4 (index, carouselProps) {
    const range = [1, 0, -1];
    const inputRange = getInputRangeFromIndexes(range, index, carouselProps);
    const outputRange = range;

    return { inputRange, outputRange };
}
function animatedStyles4 (index, animatedValue, carouselProps) {
github TrustTheBoy / react-native-component-redux / src / equipment / animations.js View on Github external
function scrollInterpolator1(index, carouselProps) {
    const range = [3, 2, 1, 0, -1];
    const inputRange = getInputRangeFromIndexes(range, index, carouselProps);
    const outputRange = range;

    return { inputRange, outputRange };
}
function animatedStyles1(index, animatedValue, carouselProps) {
github archriss / react-native-snap-carousel / example / src / utils / animations.js View on Github external
function scrollInterpolator1 (index, carouselProps) {
    const range = [3, 2, 1, 0, -1];
    const inputRange = getInputRangeFromIndexes(range, index, carouselProps);
    const outputRange = range;

    return { inputRange, outputRange };
}
function animatedStyles1 (index, animatedValue, carouselProps) {
github TrustTheBoy / react-native-component-redux / src / equipment / animations.js View on Github external
function scrollInterpolator3(index, carouselProps) {
    const range = [2, 1, 0, -1];
    const inputRange = getInputRangeFromIndexes(range, index, carouselProps);
    const outputRange = range;

    return { inputRange, outputRange };
}
function animatedStyles3(index, animatedValue, carouselProps) {
github jolocom / smartwallet-app / src / ui / documents / components / documents.tsx View on Github external
import React from 'react'
import { View, StyleSheet, Dimensions, ScrollView } from 'react-native'
import {
  DocumentCard,
  DOCUMENT_CARD_WIDTH,
} from 'src/ui/documents/components/documentCard'
import { DocumentViewToggle } from 'src/ui/documents/components/documentViewToggle'
import { ExpiredDocumentsOverview } from 'src/ui/documents/components/expiredDocumentsOverview'
import { DocumentDetails } from './documentDetails'
const Carousel = require('react-native-snap-carousel').default
import { JolocomTheme } from 'src/styles/jolocom-theme'
import { DecoratedClaims } from 'src/reducers/account'

interface Props {
  openExpiredDetails: (document: DecoratedClaims) => void
  expiredDocuments: DecoratedClaims[]
  validDocuments: DecoratedClaims[]
}

interface State {
  activeDocumentIndex: number
  showingValid: boolean
}

const styles = StyleSheet.create({
  mainContainer: {

react-native-snap-carousel

Swiper/carousel component for React Native with previews, multiple layouts, parallax images, performant handling of huge numbers of items, and more. Compatible with Android & iOS.

BSD-3-Clause
Latest version published 4 years ago

Package Health Score

58 / 100
Full package analysis