From b91e83801fd5d7889c7c5a83ff25455ae78979ce Mon Sep 17 00:00:00 2001 From: Jonas Thiel Date: Wed, 14 Jun 2017 10:34:32 +0200 Subject: [PATCH 1/2] Update react-native-snap-carousel to v2.2.2 MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit * The „onScroll“ property of the underlying ScrollView was exposed in 2.1.3 * A „onScrollViewScroll“ property was introduced in 2.1.4 and deprecated in 2.2.0 * Adds vertical mode from 2.2.0 (2.2.1, 2.2.2) * Adds „scrollEndDragThrottleValue“ and „snapCallbackDebounceValue“ from 2.2.0 * The „onLayout“ property of the underlying View was exposed in 2.2.0 https://github.com/archriss/react-native-snap-carousel/blob/master/CHANGELOG.md --- types/react-native-snap-carousel/index.d.ts | 49 +++++++++++++++++-- .../react-native-snap-carousel-tests.tsx | 14 +++++- 2 files changed, 58 insertions(+), 5 deletions(-) diff --git a/types/react-native-snap-carousel/index.d.ts b/types/react-native-snap-carousel/index.d.ts index 3c34c8c230..1bdf6abeca 100644 --- a/types/react-native-snap-carousel/index.d.ts +++ b/types/react-native-snap-carousel/index.d.ts @@ -1,4 +1,4 @@ -// Type definitions for react-native-snap-carousel 2.1 +// Type definitions for react-native-snap-carousel 2.2 // Project: https://github.com/archriss/react-native-snap-carousel // Definitions by: jnbt // Definitions: https://github.com/DefinitelyTyped/DefinitelyTyped @@ -7,6 +7,7 @@ import * as React from 'react'; import { Animated, + LayoutChangeEvent, NativeSyntheticEvent, NativeScrollEvent, ScrollViewProperties, @@ -19,12 +20,24 @@ export interface CarouselProps extends React.Props { /** * Width in pixels of your slides, must be the same for all of them + * Note: Required with horizontal carousel */ - itemWidth: number; + itemWidth?: number; + /** + * Height in pixels of carousel's items, must be the same for all of them + * Note: Required with vertical carousel + */ + itemHeight?: number; /** * Width in pixels of your slider + * Note: Required with horizontal carousel */ - sliderWidth: number; + sliderWidth?: number; + /** + * Height in pixels of the carousel itself + * Note: Required with vertical carousel + */ + sliderHeight?: number; // Behavior @@ -46,18 +59,36 @@ export interface CarouselProps extends React.Props { * Index of the first item to display */ firstItem?: number; + /** + * When momentum is disabled, this throttle helps smoothing slides' snapping by + * providing a bit of inertia when touch is released. + * Note that this will delay callback's execution. + */ + scrollEndDragThrottleValue?: number; /** * Whether to implement a shouldComponentUpdate strategy to minimize updates */ shouldOptimizeUpdates?: boolean; /** - * Snapping on android is kinda choppy, especially when swiping quickly so you can disable it + * This defines the timeframe during which multiple callback calls should be + * "grouped" into a single one. + * Note that this will delay callback's execution. + */ + snapCallbackDebounceValue?: number; + /** + * Snapping on android is kinda choppy, especially when swiping quickly so you + * can disable it. + * Warning: this prop can't be changed dynamically. */ snapOnAndroid?: boolean; /** * Delta x when swiping to trigger the snap */ swipeThreshold?: number; + /* + * Layout slides vertically instead of horizontally + */ + vertical?: boolean; // Autoplay @@ -111,8 +142,18 @@ export interface CarouselProps extends React.Props { slideStyle?: ViewStyle; // Callbacks + /** + * Exposed View callback; invoked on mount and layout changes + */ + onLayout?(event: LayoutChangeEvent): void; /** + * Exposed ScrollView callback; fired while scrolling + */ + onScroll?(event: NativeSyntheticEvent): void; + + /** + * @deprecated: use onScroll instead * Callback fired while scrolling; direct equivalent of ScrollView's onScroll * Since onScroll is overriden by plugin's implementation, you should use prop onScrollViewScroll * if you need a callback while scrolling. diff --git a/types/react-native-snap-carousel/react-native-snap-carousel-tests.tsx b/types/react-native-snap-carousel/react-native-snap-carousel-tests.tsx index 815beb0656..9f0d29792a 100644 --- a/types/react-native-snap-carousel/react-native-snap-carousel-tests.tsx +++ b/types/react-native-snap-carousel/react-native-snap-carousel-tests.tsx @@ -1,5 +1,6 @@ import * as React from 'react'; import { + LayoutChangeEvent, NativeSyntheticEvent, NativeScrollEvent, StyleSheet, @@ -25,7 +26,9 @@ class SnapCarouselTest extends React.Component<{}, {}> { enableMomentum={true} keyboardDismissMode='interactive' onSnapToItem={this.onSnapToItem} - onScrollViewScroll={this.onScroll} + onScroll={this.onScroll} + onLayout={this.onLayout} + vertical={false} > { Item #1 + ); } @@ -44,6 +52,10 @@ class SnapCarouselTest extends React.Component<{}, {}> { private onScroll = (event: NativeSyntheticEvent) => { console.log("Scrolled: ", event); } + + private onLayout = (event: LayoutChangeEvent) => { + console.log("Layout: ", event); + } } const styles = StyleSheet.create({ From fe47481b6338ffbac2811461ab1f4bfcbec2c888 Mon Sep 17 00:00:00 2001 From: Jonas Thiel Date: Wed, 14 Jun 2017 10:53:58 +0200 Subject: [PATCH 2/2] Add undocumented parameters for snapToItem MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit Adds optional „fireCallback“ and „initial“ to snapToItem: https://github.com/archriss/react-native-snap-carousel/blob/v2.2.2/index.js#L585 --- types/react-native-snap-carousel/index.d.ts | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/types/react-native-snap-carousel/index.d.ts b/types/react-native-snap-carousel/index.d.ts index 1bdf6abeca..d7592ca07e 100644 --- a/types/react-native-snap-carousel/index.d.ts +++ b/types/react-native-snap-carousel/index.d.ts @@ -170,7 +170,7 @@ export interface CarouselStatic extends React.ComponentClass { currentIndex: number; startAutoplay(instantly?: boolean): void; stopAutoplay(): void; - snapToItem(index: number, animated?: boolean): void; + snapToItem(index: number, animated?: boolean, fireCallback?: boolean, initial?: boolean): void; snapToNext(animated?: boolean): void; snapToPrev(animated?: boolean): void; }