UNPKG

32.9 kBTypeScriptView Raw
1/**
2 * Copyright (c) Meta Platforms, Inc. and affiliates.
3 *
4 * This source code is licensed under the MIT license found in the
5 * LICENSE file in the root directory of this source tree.
6 *
7 * @format
8 */
9
10import type * as React from 'react';
11import {Constructor} from '../../../types/private/Utilities';
12import {Insets} from '../../../types/public/Insets';
13import {ColorValue, StyleProp} from '../../StyleSheet/StyleSheet';
14import {ViewStyle} from '../../StyleSheet/StyleSheetTypes';
15import {
16 NativeSyntheticEvent,
17 NativeTouchEvent,
18} from '../../Types/CoreEventTypes';
19import {RefreshControlProps} from '../RefreshControl/RefreshControl';
20import {Touchable} from '../Touchable/Touchable';
21import {ViewProps} from '../View/ViewPropTypes';
22
23// See https://reactnative.dev/docs/scrollview#contentoffset
24export interface PointProp {
25 x: number;
26 y: number;
27}
28
29export interface ScrollResponderEvent
30 extends NativeSyntheticEvent<NativeTouchEvent> {}
31
32interface SubscribableMixin {
33 /**
34 * Special form of calling `addListener` that *guarantees* that a
35 * subscription *must* be tied to a component instance, and therefore will
36 * be cleaned up when the component is unmounted. It is impossible to create
37 * the subscription and pass it in - this method must be the one to create
38 * the subscription and therefore can guarantee it is retained in a way that
39 * will be cleaned up.
40 *
41 * @param eventEmitter emitter to subscribe to.
42 * @param eventType Type of event to listen to.
43 * @param listener Function to invoke when event occurs.
44 * @param context Object to use as listener context.
45 */
46 addListenerOn(
47 eventEmitter: any,
48 eventType: string,
49 listener: () => any,
50 context: any,
51 ): void;
52}
53
54interface ScrollResponderMixin extends SubscribableMixin {
55 /**
56 * Invoke this from an `onScroll` event.
57 */
58 scrollResponderHandleScrollShouldSetResponder(): boolean;
59
60 /**
61 * Merely touch starting is not sufficient for a scroll view to become the
62 * responder. Being the "responder" means that the very next touch move/end
63 * event will result in an action/movement.
64 *
65 * Invoke this from an `onStartShouldSetResponder` event.
66 *
67 * `onStartShouldSetResponder` is used when the next move/end will trigger
68 * some UI movement/action, but when you want to yield priority to views
69 * nested inside of the view.
70 *
71 * There may be some cases where scroll views actually should return `true`
72 * from `onStartShouldSetResponder`: Any time we are detecting a standard tap
73 * that gives priority to nested views.
74 *
75 * - If a single tap on the scroll view triggers an action such as
76 * recentering a map style view yet wants to give priority to interaction
77 * views inside (such as dropped pins or labels), then we would return true
78 * from this method when there is a single touch.
79 *
80 * - Similar to the previous case, if a two finger "tap" should trigger a
81 * zoom, we would check the `touches` count, and if `>= 2`, we would return
82 * true.
83 *
84 */
85 scrollResponderHandleStartShouldSetResponder(): boolean;
86
87 /**
88 * There are times when the scroll view wants to become the responder
89 * (meaning respond to the next immediate `touchStart/touchEnd`), in a way
90 * that *doesn't* give priority to nested views (hence the capture phase):
91 *
92 * - Currently animating.
93 * - Tapping anywhere that is not the focused input, while the keyboard is
94 * up (which should dismiss the keyboard).
95 *
96 * Invoke this from an `onStartShouldSetResponderCapture` event.
97 */
98 scrollResponderHandleStartShouldSetResponderCapture(
99 e: ScrollResponderEvent,
100 ): boolean;
101
102 /**
103 * Invoke this from an `onResponderReject` event.
104 *
105 * Some other element is not yielding its role as responder. Normally, we'd
106 * just disable the `UIScrollView`, but a touch has already began on it, the
107 * `UIScrollView` will not accept being disabled after that. The easiest
108 * solution for now is to accept the limitation of disallowing this
109 * altogether. To improve this, find a way to disable the `UIScrollView` after
110 * a touch has already started.
111 */
112 scrollResponderHandleResponderReject(): any;
113
114 /**
115 * We will allow the scroll view to give up its lock iff it acquired the lock
116 * during an animation. This is a very useful default that happens to satisfy
117 * many common user experiences.
118 *
119 * - Stop a scroll on the left edge, then turn that into an outer view's
120 * backswipe.
121 * - Stop a scroll mid-bounce at the top, continue pulling to have the outer
122 * view dismiss.
123 * - However, without catching the scroll view mid-bounce (while it is
124 * motionless), if you drag far enough for the scroll view to become
125 * responder (and therefore drag the scroll view a bit), any backswipe
126 * navigation of a swipe gesture higher in the view hierarchy, should be
127 * rejected.
128 */
129 scrollResponderHandleTerminationRequest(): boolean;
130
131 /**
132 * Invoke this from an `onTouchEnd` event.
133 *
134 * @param e Event.
135 */
136 scrollResponderHandleTouchEnd(e: ScrollResponderEvent): void;
137
138 /**
139 * Invoke this from an `onResponderRelease` event.
140 */
141 scrollResponderHandleResponderRelease(e: ScrollResponderEvent): void;
142
143 scrollResponderHandleScroll(e: ScrollResponderEvent): void;
144
145 /**
146 * Invoke this from an `onResponderGrant` event.
147 */
148 scrollResponderHandleResponderGrant(e: ScrollResponderEvent): void;
149
150 /**
151 * Unfortunately, `onScrollBeginDrag` also fires when *stopping* the scroll
152 * animation, and there's not an easy way to distinguish a drag vs. stopping
153 * momentum.
154 *
155 * Invoke this from an `onScrollBeginDrag` event.
156 */
157 scrollResponderHandleScrollBeginDrag(e: ScrollResponderEvent): void;
158
159 /**
160 * Invoke this from an `onScrollEndDrag` event.
161 */
162 scrollResponderHandleScrollEndDrag(e: ScrollResponderEvent): void;
163
164 /**
165 * Invoke this from an `onMomentumScrollBegin` event.
166 */
167 scrollResponderHandleMomentumScrollBegin(e: ScrollResponderEvent): void;
168
169 /**
170 * Invoke this from an `onMomentumScrollEnd` event.
171 */
172 scrollResponderHandleMomentumScrollEnd(e: ScrollResponderEvent): void;
173
174 /**
175 * Invoke this from an `onTouchStart` event.
176 *
177 * Since we know that the `SimpleEventPlugin` occurs later in the plugin
178 * order, after `ResponderEventPlugin`, we can detect that we were *not*
179 * permitted to be the responder (presumably because a contained view became
180 * responder). The `onResponderReject` won't fire in that case - it only
181 * fires when a *current* responder rejects our request.
182 *
183 * @param e Touch Start event.
184 */
185 scrollResponderHandleTouchStart(e: ScrollResponderEvent): void;
186
187 /**
188 * Invoke this from an `onTouchMove` event.
189 *
190 * Since we know that the `SimpleEventPlugin` occurs later in the plugin
191 * order, after `ResponderEventPlugin`, we can detect that we were *not*
192 * permitted to be the responder (presumably because a contained view became
193 * responder). The `onResponderReject` won't fire in that case - it only
194 * fires when a *current* responder rejects our request.
195 *
196 * @param e Touch Start event.
197 */
198 scrollResponderHandleTouchMove(e: ScrollResponderEvent): void;
199
200 /**
201 * A helper function for this class that lets us quickly determine if the
202 * view is currently animating. This is particularly useful to know when
203 * a touch has just started or ended.
204 */
205 scrollResponderIsAnimating(): boolean;
206
207 /**
208 * Returns the node that represents native view that can be scrolled.
209 * Components can pass what node to use by defining a `getScrollableNode`
210 * function otherwise `this` is used.
211 */
212 scrollResponderGetScrollableNode(): any;
213
214 /**
215 * A helper function to scroll to a specific point in the scrollview.
216 * This is currently used to help focus on child textviews, but can also
217 * be used to quickly scroll to any element we want to focus. Syntax:
218 *
219 * scrollResponderScrollTo(options: {x: number = 0; y: number = 0; animated: boolean = true})
220 *
221 * Note: The weird argument signature is due to the fact that, for historical reasons,
222 * the function also accepts separate arguments as an alternative to the options object.
223 * This is deprecated due to ambiguity (y before x), and SHOULD NOT BE USED.
224 */
225 scrollResponderScrollTo(
226 x?:
227 | number
228 | {
229 x?: number | undefined;
230 y?: number | undefined;
231 animated?: boolean | undefined;
232 },
233 y?: number,
234 animated?: boolean,
235 ): void;
236
237 /**
238 * A helper function to zoom to a specific rect in the scrollview. The argument has the shape
239 * {x: number; y: number; width: number; height: number; animated: boolean = true}
240 *
241 * @platform ios
242 */
243 scrollResponderZoomTo(
244 rect: {
245 x: number;
246 y: number;
247 width: number;
248 height: number;
249 animated?: boolean | undefined;
250 },
251 animated?: boolean, // deprecated, put this inside the rect argument instead
252 ): void;
253
254 /**
255 * This method should be used as the callback to onFocus in a TextInputs'
256 * parent view. Note that any module using this mixin needs to return
257 * the parent view's ref in getScrollViewRef() in order to use this method.
258 * @param nodeHandle The TextInput node handle
259 * @param additionalOffset The scroll view's top "contentInset".
260 * Default is 0.
261 * @param preventNegativeScrolling Whether to allow pulling the content
262 * down to make it meet the keyboard's top. Default is false.
263 */
264 scrollResponderScrollNativeHandleToKeyboard(
265 nodeHandle: any,
266 additionalOffset?: number,
267 preventNegativeScrollOffset?: boolean,
268 ): void;
269
270 /**
271 * The calculations performed here assume the scroll view takes up the entire
272 * screen - even if has some content inset. We then measure the offsets of the
273 * keyboard, and compensate both for the scroll view's "contentInset".
274 *
275 * @param left Position of input w.r.t. table view.
276 * @param top Position of input w.r.t. table view.
277 * @param width Width of the text input.
278 * @param height Height of the text input.
279 */
280 scrollResponderInputMeasureAndScrollToKeyboard(
281 left: number,
282 top: number,
283 width: number,
284 height: number,
285 ): void;
286
287 scrollResponderTextInputFocusError(e: ScrollResponderEvent): void;
288
289 /**
290 * `componentWillMount` is the closest thing to a standard "constructor" for
291 * React components.
292 *
293 * The `keyboardWillShow` is called before input focus.
294 */
295 componentWillMount(): void;
296
297 /**
298 * Warning, this may be called several times for a single keyboard opening.
299 * It's best to store the information in this method and then take any action
300 * at a later point (either in `keyboardDidShow` or other).
301 *
302 * Here's the order that events occur in:
303 * - focus
304 * - willShow {startCoordinates, endCoordinates} several times
305 * - didShow several times
306 * - blur
307 * - willHide {startCoordinates, endCoordinates} several times
308 * - didHide several times
309 *
310 * The `ScrollResponder` providesModule callbacks for each of these events.
311 * Even though any user could have easily listened to keyboard events
312 * themselves, using these `props` callbacks ensures that ordering of events
313 * is consistent - and not dependent on the order that the keyboard events are
314 * subscribed to. This matters when telling the scroll view to scroll to where
315 * the keyboard is headed - the scroll responder better have been notified of
316 * the keyboard destination before being instructed to scroll to where the
317 * keyboard will be. Stick to the `ScrollResponder` callbacks, and everything
318 * will work.
319 *
320 * WARNING: These callbacks will fire even if a keyboard is displayed in a
321 * different navigation pane. Filter out the events to determine if they are
322 * relevant to you. (For example, only if you receive these callbacks after
323 * you had explicitly focused a node etc).
324 */
325 scrollResponderKeyboardWillShow(e: ScrollResponderEvent): void;
326
327 scrollResponderKeyboardWillHide(e: ScrollResponderEvent): void;
328
329 scrollResponderKeyboardDidShow(e: ScrollResponderEvent): void;
330
331 scrollResponderKeyboardDidHide(e: ScrollResponderEvent): void;
332}
333
334export interface ScrollViewPropsIOS {
335 /**
336 * When true the scroll view bounces horizontally when it reaches the end
337 * even if the content is smaller than the scroll view itself. The default
338 * value is true when `horizontal={true}` and false otherwise.
339 */
340 alwaysBounceHorizontal?: boolean | undefined;
341 /**
342 * When true the scroll view bounces vertically when it reaches the end
343 * even if the content is smaller than the scroll view itself. The default
344 * value is false when `horizontal={true}` and true otherwise.
345 */
346 alwaysBounceVertical?: boolean | undefined;
347
348 /**
349 * Controls whether iOS should automatically adjust the content inset for scroll views that are placed behind a navigation bar or tab bar/ toolbar.
350 * The default value is true.
351 */
352 automaticallyAdjustContentInsets?: boolean | undefined; // true
353
354 /**
355 * Controls whether the ScrollView should automatically adjust its contentInset and
356 * scrollViewInsets when the Keyboard changes its size. The default value is false.
357 */
358 automaticallyAdjustKeyboardInsets?: boolean | undefined;
359
360 /**
361 * Controls whether iOS should automatically adjust the scroll indicator
362 * insets. The default value is true. Available on iOS 13 and later.
363 */
364 automaticallyAdjustsScrollIndicatorInsets?: boolean | undefined;
365
366 /**
367 * When true the scroll view bounces when it reaches the end of the
368 * content if the content is larger then the scroll view along the axis of
369 * the scroll direction. When false it disables all bouncing even if
370 * the `alwaysBounce*` props are true. The default value is true.
371 */
372 bounces?: boolean | undefined;
373 /**
374 * When true gestures can drive zoom past min/max and the zoom will animate
375 * to the min/max value at gesture end otherwise the zoom will not exceed
376 * the limits.
377 */
378 bouncesZoom?: boolean | undefined;
379
380 /**
381 * When false once tracking starts won't try to drag if the touch moves.
382 * The default value is true.
383 */
384 canCancelContentTouches?: boolean | undefined;
385
386 /**
387 * When true the scroll view automatically centers the content when the
388 * content is smaller than the scroll view bounds; when the content is
389 * larger than the scroll view this property has no effect. The default
390 * value is false.
391 */
392 centerContent?: boolean | undefined;
393
394 /**
395 * The amount by which the scroll view content is inset from the edges of the scroll view.
396 * Defaults to {0, 0, 0, 0}.
397 */
398 contentInset?: Insets | undefined; // zeros
399
400 /**
401 * Used to manually set the starting scroll offset.
402 * The default value is {x: 0, y: 0}
403 */
404 contentOffset?: PointProp | undefined; // zeros
405
406 /**
407 * This property specifies how the safe area insets are used to modify the content area of the scroll view.
408 * The default value of this property must be 'automatic'. But the default value is 'never' until RN@0.51.
409 */
410 contentInsetAdjustmentBehavior?:
411 | 'automatic'
412 | 'scrollableAxes'
413 | 'never'
414 | 'always'
415 | undefined;
416
417 /**
418 * When true the ScrollView will try to lock to only vertical or horizontal
419 * scrolling while dragging. The default value is false.
420 */
421 directionalLockEnabled?: boolean | undefined;
422
423 /**
424 * The style of the scroll indicators.
425 * - default (the default), same as black.
426 * - black, scroll indicator is black. This style is good against
427 * a white content background.
428 * - white, scroll indicator is white. This style is good against
429 * a black content background.
430 */
431 indicatorStyle?: 'default' | 'black' | 'white' | undefined;
432
433 /**
434 * When set, the scroll view will adjust the scroll position so that the first child
435 * that is currently visible and at or beyond minIndexForVisible will not change position.
436 * This is useful for lists that are loading content in both directions, e.g. a chat thread,
437 * where new messages coming in might otherwise cause the scroll position to jump. A value
438 * of 0 is common, but other values such as 1 can be used to skip loading spinners or other
439 * content that should not maintain position.
440 *
441 * The optional autoscrollToTopThreshold can be used to make the content automatically scroll
442 * to the top after making the adjustment if the user was within the threshold of the top
443 * before the adjustment was made. This is also useful for chat-like applications where you
444 * want to see new messages scroll into place, but not if the user has scrolled up a ways and
445 * it would be disruptive to scroll a bunch.
446 *
447 * Caveat 1: Reordering elements in the scrollview with this enabled will probably cause
448 * jumpiness and jank. It can be fixed, but there are currently no plans to do so. For now,
449 * don't re-order the content of any ScrollViews or Lists that use this feature.
450 *
451 * Caveat 2: This uses contentOffset and frame.origin in native code to compute visibility.
452 * Occlusion, transforms, and other complexity won't be taken into account as to whether
453 * content is "visible" or not.
454 */
455 maintainVisibleContentPosition?:
456 | null
457 | {
458 autoscrollToTopThreshold?: number | null | undefined;
459 minIndexForVisible: number;
460 }
461 | undefined;
462 /**
463 * The maximum allowed zoom scale. The default value is 1.0.
464 */
465 maximumZoomScale?: number | undefined;
466
467 /**
468 * The minimum allowed zoom scale. The default value is 1.0.
469 */
470 minimumZoomScale?: number | undefined;
471
472 /**
473 * Called when a scrolling animation ends.
474 */
475 onScrollAnimationEnd?: (() => void) | undefined;
476
477 /**
478 * When true, ScrollView allows use of pinch gestures to zoom in and out.
479 * The default value is true.
480 */
481 pinchGestureEnabled?: boolean | undefined;
482
483 /**
484 * Limits how often scroll events will be fired while scrolling, specified as
485 * a time interval in ms. This may be useful when expensive work is performed
486 * in response to scrolling. Values <= `16` will disable throttling,
487 * regardless of the refresh rate of the device.
488 */
489 scrollEventThrottle?: number | undefined;
490
491 /**
492 * The amount by which the scroll view indicators are inset from the edges of the scroll view.
493 * This should normally be set to the same value as the contentInset.
494 * Defaults to {0, 0, 0, 0}.
495 */
496 scrollIndicatorInsets?: Insets | undefined; //zeroes
497
498 /**
499 * When true, the scroll view can be programmatically scrolled beyond its
500 * content size. The default value is false.
501 * @platform ios
502 */
503 scrollToOverflowEnabled?: boolean | undefined;
504
505 /**
506 * When true the scroll view scrolls to top when the status bar is tapped.
507 * The default value is true.
508 */
509 scrollsToTop?: boolean | undefined;
510
511 /**
512 * When `snapToInterval` is set, `snapToAlignment` will define the relationship of the snapping to the scroll view.
513 * - `start` (the default) will align the snap at the left (horizontal) or top (vertical)
514 * - `center` will align the snap in the center
515 * - `end` will align the snap at the right (horizontal) or bottom (vertical)
516 */
517 snapToAlignment?: 'start' | 'center' | 'end' | undefined;
518
519 /**
520 * Fires when the scroll view scrolls to top after the status bar has been tapped
521 * @platform ios
522 */
523 onScrollToTop?:
524 | ((event: NativeSyntheticEvent<NativeScrollEvent>) => void)
525 | undefined;
526
527 /**
528 * The current scale of the scroll view content. The default value is 1.0.
529 */
530 zoomScale?: number | undefined;
531}
532
533export interface ScrollViewPropsAndroid {
534 /**
535 * Sometimes a scrollview takes up more space than its content fills.
536 * When this is the case, this prop will fill the rest of the
537 * scrollview with a color to avoid setting a background and creating
538 * unnecessary overdraw. This is an advanced optimization that is not
539 * needed in the general case.
540 */
541 endFillColor?: ColorValue | undefined;
542
543 /**
544 * Tag used to log scroll performance on this scroll view. Will force
545 * momentum events to be turned on (see sendMomentumEvents). This doesn't do
546 * anything out of the box and you need to implement a custom native
547 * FpsListener for it to be useful.
548 * @platform android
549 */
550 scrollPerfTag?: string | undefined;
551
552 /**
553 * Used to override default value of overScroll mode.
554
555 * Possible values:
556 * - 'auto' - Default value, allow a user to over-scroll this view only if the content is large enough to meaningfully scroll.
557 * - 'always' - Always allow a user to over-scroll this view.
558 * - 'never' - Never allow a user to over-scroll this view.
559 */
560 overScrollMode?: 'auto' | 'always' | 'never' | undefined;
561
562 /**
563 * Enables nested scrolling for Android API level 21+. Nested scrolling is supported by default on iOS.
564 */
565 nestedScrollEnabled?: boolean | undefined;
566
567 /**
568 * Fades out the edges of the scroll content.
569 *
570 * If the value is greater than 0, the fading edges will be set accordingly
571 * to the current scroll direction and position,
572 * indicating if there is more content to show.
573 *
574 * The default value is 0.
575 * @platform android
576 */
577 fadingEdgeLength?: number | undefined;
578
579 /**
580 * Causes the scrollbars not to turn transparent when they are not in use. The default value is false.
581 */
582 persistentScrollbar?: boolean | undefined;
583}
584
585export interface ScrollViewProps
586 extends ViewProps,
587 ScrollViewPropsIOS,
588 ScrollViewPropsAndroid,
589 Touchable {
590 /**
591 * These styles will be applied to the scroll view content container which
592 * wraps all of the child views. Example:
593 *
594 * return (
595 * <ScrollView contentContainerStyle={styles.contentContainer}>
596 * </ScrollView>
597 * );
598 * ...
599 * const styles = StyleSheet.create({
600 * contentContainer: {
601 * paddingVertical: 20
602 * }
603 * });
604 */
605 contentContainerStyle?: StyleProp<ViewStyle> | undefined;
606
607 /**
608 * A floating-point number that determines how quickly the scroll view
609 * decelerates after the user lifts their finger. You may also use string
610 * shortcuts `"normal"` and `"fast"` which match the underlying iOS settings
611 * for `UIScrollViewDecelerationRateNormal` and
612 * `UIScrollViewDecelerationRateFast` respectively.
613 *
614 * - `'normal'`: 0.998 on iOS, 0.985 on Android (the default)
615 * - `'fast'`: 0.99 on iOS, 0.9 on Android
616 */
617 decelerationRate?: 'fast' | 'normal' | number | undefined;
618
619 /**
620 * When true the scroll view's children are arranged horizontally in a row
621 * instead of vertically in a column. The default value is false.
622 */
623 horizontal?: boolean | null | undefined;
624
625 /**
626 * If sticky headers should stick at the bottom instead of the top of the
627 * ScrollView. This is usually used with inverted ScrollViews.
628 */
629 invertStickyHeaders?: boolean | undefined;
630
631 /**
632 * Determines whether the keyboard gets dismissed in response to a drag.
633 * - 'none' (the default) drags do not dismiss the keyboard.
634 * - 'onDrag' the keyboard is dismissed when a drag begins.
635 * - 'interactive' the keyboard is dismissed interactively with the drag
636 * and moves in synchrony with the touch; dragging upwards cancels the
637 * dismissal.
638 */
639 keyboardDismissMode?: 'none' | 'interactive' | 'on-drag' | undefined;
640
641 /**
642 * Determines when the keyboard should stay visible after a tap.
643 * - 'never' (the default), tapping outside of the focused text input when the keyboard is up dismisses the keyboard. When this happens, children won't receive the tap.
644 * - 'always', the keyboard will not dismiss automatically, and the scroll view will not catch taps, but children of the scroll view can catch taps.
645 * - 'handled', the keyboard will not dismiss automatically when the tap was handled by a children, (or captured by an ancestor).
646 * - false, deprecated, use 'never' instead
647 * - true, deprecated, use 'always' instead
648 */
649 keyboardShouldPersistTaps?:
650 | boolean
651 | 'always'
652 | 'never'
653 | 'handled'
654 | undefined;
655
656 /**
657 * Called when scrollable content view of the ScrollView changes.
658 * Handler function is passed the content width and content height as parameters: (contentWidth, contentHeight)
659 * It's implemented using onLayout handler attached to the content container which this ScrollView renders.
660 *
661 */
662 onContentSizeChange?: ((w: number, h: number) => void) | undefined;
663
664 /**
665 * Fires at most once per frame during scrolling.
666 */
667 onScroll?:
668 | ((event: NativeSyntheticEvent<NativeScrollEvent>) => void)
669 | undefined;
670
671 /**
672 * Fires if a user initiates a scroll gesture.
673 */
674 onScrollBeginDrag?:
675 | ((event: NativeSyntheticEvent<NativeScrollEvent>) => void)
676 | undefined;
677
678 /**
679 * Fires when a user has finished scrolling.
680 */
681 onScrollEndDrag?:
682 | ((event: NativeSyntheticEvent<NativeScrollEvent>) => void)
683 | undefined;
684
685 /**
686 * Fires when scroll view has finished moving
687 */
688 onMomentumScrollEnd?:
689 | ((event: NativeSyntheticEvent<NativeScrollEvent>) => void)
690 | undefined;
691
692 /**
693 * Fires when scroll view has begun moving
694 */
695 onMomentumScrollBegin?:
696 | ((event: NativeSyntheticEvent<NativeScrollEvent>) => void)
697 | undefined;
698
699 /**
700 * When true the scroll view stops on multiples of the scroll view's size
701 * when scrolling. This can be used for horizontal pagination. The default
702 * value is false.
703 */
704 pagingEnabled?: boolean | undefined;
705
706 /**
707 * When false, the content does not scroll. The default value is true
708 */
709 scrollEnabled?: boolean | undefined; // true
710
711 /**
712 * Experimental: When true offscreen child views (whose `overflow` value is
713 * `hidden`) are removed from their native backing superview when offscreen.
714 * This can improve scrolling performance on long lists. The default value is
715 * false.
716 */
717 removeClippedSubviews?: boolean | undefined;
718
719 /**
720 * When true, shows a horizontal scroll indicator.
721 */
722 showsHorizontalScrollIndicator?: boolean | undefined;
723
724 /**
725 * When true, shows a vertical scroll indicator.
726 */
727 showsVerticalScrollIndicator?: boolean | undefined;
728
729 /**
730 * When true, Sticky header is hidden when scrolling down, and dock at the top when scrolling up.
731 */
732 stickyHeaderHiddenOnScroll?: boolean | undefined;
733
734 /**
735 * Style
736 */
737 style?: StyleProp<ViewStyle> | undefined;
738
739 /**
740 * A RefreshControl component, used to provide pull-to-refresh
741 * functionality for the ScrollView.
742 */
743 refreshControl?: React.ReactElement<RefreshControlProps> | undefined;
744
745 /**
746 * When set, causes the scroll view to stop at multiples of the value of `snapToInterval`.
747 * This can be used for paginating through children that have lengths smaller than the scroll view.
748 * Used in combination with `snapToAlignment` and `decelerationRate="fast"`. Overrides less
749 * configurable `pagingEnabled` prop.
750 */
751 snapToInterval?: number | undefined;
752
753 /**
754 * When set, causes the scroll view to stop at the defined offsets. This can be used for
755 * paginating through variously sized children that have lengths smaller than the scroll view.
756 * Typically used in combination with `decelerationRate="fast"`. Overrides less configurable
757 * `pagingEnabled` and `snapToInterval` props.
758 */
759 snapToOffsets?: number[] | undefined;
760
761 /**
762 * Use in conjunction with `snapToOffsets`. By default, the beginning of the list counts as a
763 * snap offset. Set `snapToStart` to false to disable this behavior and allow the list to scroll
764 * freely between its start and the first `snapToOffsets` offset. The default value is true.
765 */
766 snapToStart?: boolean | undefined;
767
768 /**
769 * Use in conjunction with `snapToOffsets`. By default, the end of the list counts as a snap
770 * offset. Set `snapToEnd` to false to disable this behavior and allow the list to scroll freely
771 * between its end and the last `snapToOffsets` offset. The default value is true.
772 */
773 snapToEnd?: boolean | undefined;
774
775 /**
776 * An array of child indices determining which children get docked to the
777 * top of the screen when scrolling. For example passing
778 * `stickyHeaderIndices={[0]}` will cause the first child to be fixed to the
779 * top of the scroll view. This property is not supported in conjunction
780 * with `horizontal={true}`.
781 */
782 stickyHeaderIndices?: number[] | undefined;
783
784 /**
785 * When true, the scroll view stops on the next index (in relation to scroll position at release)
786 * regardless of how fast the gesture is. This can be used for horizontal pagination when the page
787 * is less than the width of the ScrollView. The default value is false.
788 */
789 disableIntervalMomentum?: boolean | undefined;
790
791 /**
792 * When true, the default JS pan responder on the ScrollView is disabled, and full control over
793 * touches inside the ScrollView is left to its child components. This is particularly useful
794 * if `snapToInterval` is enabled, since it does not follow typical touch patterns. Do not use
795 * this on regular ScrollView use cases without `snapToInterval` as it may cause unexpected
796 * touches to occur while scrolling. The default value is false.
797 */
798 disableScrollViewPanResponder?: boolean | undefined;
799
800 /**
801 * A React Component that will be used to render sticky headers, should be used together with
802 * stickyHeaderIndices. You may need to set this component if your sticky header uses custom
803 * transforms, for example, when you want your list to have an animated and hidable header.
804 * If component have not been provided, the default ScrollViewStickyHeader component will be used.
805 */
806 StickyHeaderComponent?: React.ComponentType<any> | undefined;
807}
808
809declare class ScrollViewComponent extends React.Component<ScrollViewProps> {}
810export declare const ScrollViewBase: Constructor<ScrollResponderMixin> &
811 typeof ScrollViewComponent;
812export class ScrollView extends ScrollViewBase {
813 /**
814 * Scrolls to a given x, y offset, either immediately or with a smooth animation.
815 * Syntax:
816 *
817 * scrollTo(options: {x: number = 0; y: number = 0; animated: boolean = true})
818 *
819 * Note: The weird argument signature is due to the fact that, for historical reasons,
820 * the function also accepts separate arguments as an alternative to the options object.
821 * This is deprecated due to ambiguity (y before x), and SHOULD NOT BE USED.
822 */
823 scrollTo(
824 y?:
825 | number
826 | {
827 x?: number | undefined;
828 y?: number | undefined;
829 animated?: boolean | undefined;
830 },
831 deprecatedX?: number,
832 deprecatedAnimated?: boolean,
833 ): void;
834
835 /**
836 * A helper function that scrolls to the end of the scrollview;
837 * If this is a vertical ScrollView, it scrolls to the bottom.
838 * If this is a horizontal ScrollView scrolls to the right.
839 *
840 * The options object has an animated prop, that enables the scrolling animation or not.
841 * The animated prop defaults to true
842 */
843 scrollToEnd(options?: {animated?: boolean | undefined}): void;
844
845 /**
846 * Displays the scroll indicators momentarily.
847 */
848 flashScrollIndicators(): void;
849
850 /**
851 * Returns a reference to the underlying scroll responder, which supports
852 * operations like `scrollTo`. All ScrollView-like components should
853 * implement this method so that they can be composed while providing access
854 * to the underlying scroll responder's methods.
855 */
856 getScrollResponder(): ScrollResponderMixin;
857
858 getScrollableNode(): any;
859
860 // Undocumented
861 getInnerViewNode(): any;
862
863 /**
864 * @deprecated Use scrollTo instead
865 */
866 scrollWithoutAnimationTo?: ((y: number, x: number) => void) | undefined;
867
868 /**
869 * This function sends props straight to native. They will not participate in
870 * future diff process - this means that if you do not include them in the
871 * next render, they will remain active (see [Direct
872 * Manipulation](https://reactnative.dev/docs/direct-manipulation)).
873 */
874 setNativeProps(nativeProps: object): void;
875}
876
877export interface NativeScrollRectangle {
878 left: number;
879 top: number;
880 bottom: number;
881 right: number;
882}
883
884export interface NativeScrollPoint {
885 x: number;
886 y: number;
887}
888
889export interface NativeScrollVelocity {
890 x: number;
891 y: number;
892}
893
894export interface NativeScrollSize {
895 height: number;
896 width: number;
897}
898
899export interface NativeScrollEvent {
900 contentInset: NativeScrollRectangle;
901 contentOffset: NativeScrollPoint;
902 contentSize: NativeScrollSize;
903 layoutMeasurement: NativeScrollSize;
904 velocity?: NativeScrollVelocity | undefined;
905 zoomScale: number;
906 /**
907 * @platform ios
908 */
909 targetContentOffset?: NativeScrollPoint | undefined;
910}
911
\No newline at end of file