ScrollView
封装 ScrollView 平台的组件，同时提供与触摸锁定 "responder" 系统的集成。
¥Component that wraps platform ScrollView while providing integration with touch locking "responder" system.
请记住，ScrollView 必须具有有界高度才能工作，因为它们将无界高度子级包含到有界容器中（通过滚动交互）。为了限制 ScrollView 的高度，要么直接设置视图的高度（不鼓励），要么确保所有父视图都有限制高度。忘记将 {flex: 1} 传输到视图堆栈可能会导致此处出现错误，元素检查器可以快速调试这些错误。
¥Keep in mind that ScrollViews must have a bounded height in order to work, since they contain unbounded-height children into a bounded container (via a scroll interaction). In order to bound the height of a ScrollView, either set the height of the view directly (discouraged) or make sure all parent views have bounded height. Forgetting to transfer {flex: 1} down the view stack can lead to errors here, which the element inspector makes quick to debug.
尚不支持其他包含的响应者阻止此滚动视图成为响应者。
¥Doesn't yet support other contained responders from blocking this scroll view from becoming the responder.
<ScrollView> 与 <FlatList> - 使用哪一个？
¥<ScrollView> vs <FlatList> - which one to use?
ScrollView 一次渲染所有的 React 子组件，但这有一个性能缺点。
¥ScrollView renders all its react child components at once, but this has a performance downside.
想象一下，你有一个很长的要显示的项目列表，可能有几个屏幕的内容。一次性为所有内容创建 JS 组件和原生视图（其中大部分甚至可能不会显示）将导致渲染速度变慢并增加内存使用量。
¥Imagine you have a very long list of items you want to display, maybe several screens worth of content. Creating JS components and native views for everything all at once, much of which may not even be shown, will contribute to slow rendering and increased memory usage.
这就是 FlatList 发挥作用的地方。FlatList 在项目即将出现时延迟渲染它们，并删除滚动到屏幕外的项目以节省内存和处理时间。
¥This is where FlatList comes into play. FlatList renders items lazily, when they are about to appear, and removes items that scroll way off screen to save memory and processing time.
如果你想在项目之间渲染分隔符、多列、无限滚动加载或它支持的任何数量的其他开箱即用功能，FlatList 也很方便。
¥FlatList is also handy if you want to render separators between your items, multiple columns, infinite scroll loading, or any number of other features it supports out of the box.
示例
¥Example
参考
¥Reference
属性
¥Props
视图属性
继承 视图属性。
¥Inherits View Props.
StickyHeaderComponent
将用于渲染粘性标头的 React 组件应与 stickyHeaderIndices 一起使用。如果你的粘性标题使用自定义转换，你可能需要设置此组件，例如，当你希望列表具有动画且可隐藏的标题时。如果未提供组件，则将使用默认的 ScrollViewStickyHeader 组件。
¥A React Component that will be used to render sticky headers, should be used together with stickyHeaderIndices. You may need to set this component if your sticky header uses custom transforms, for example, when you want your list to have an animated and hidable header. If a component has not been provided, the default ScrollViewStickyHeader component will be used.
| 类型 |
|---|
| 组件、元素 |
alwaysBounceHorizontal iOS
如果为 true，则滚动视图在到达末尾时会水平弹起，即使内容小于滚动视图本身。
¥When true, the scroll view bounces horizontally when it reaches the end even if the content is smaller than the scroll view itself.
| 类型 | 默认 |
|---|---|
| bool | true 时 horizontal={true}false 否则 |
alwaysBounceVertical iOS
如果为 true，则滚动视图在到达末尾时会垂直弹跳，即使内容小于滚动视图本身。
¥When true, the scroll view bounces vertically when it reaches the end even if the content is smaller than the scroll view itself.
| 类型 | 默认 |
|---|---|
| bool | false 时 vertical={true}true 否则 |
automaticallyAdjustContentInsets iOS
控制 iOS 是否应自动调整位于导航栏或选项卡栏/工具栏后面的滚动视图的内容插图。
¥Controls whether iOS should automatically adjust the content inset for scroll views that are placed behind a navigation bar or tab bar/toolbar.
| 类型 | 默认 |
|---|---|
| bool | true |
automaticallyAdjustKeyboardInsets iOS
控制当键盘更改其大小时，ScrollView 是否应自动调整其 contentInset 和 scrollViewInsets。
¥Controls whether the ScrollView should automatically adjust its contentInset and scrollViewInsets when the Keyboard changes its size.
| 类型 | 默认 |
|---|---|
| bool | false |
automaticallyAdjustsScrollIndicatorInsets iOS
控制 iOS 是否应自动调整滚动指示器插图。参见 Apple 的 有关属性的文件。
¥Controls whether iOS should automatically adjust the scroll indicator insets. See Apple's documentation on the property.
| 类型 | 默认 |
|---|---|
| bool | true |
bounces iOS
如果为 true，则如果内容沿滚动方向的轴大于滚动视图，则滚动视图在到达内容末尾时会弹起。当 false 时，即使 alwaysBounce* 属性是 true，它也会禁用所有弹跳。
¥When true, the scroll view bounces when it reaches the end of the content if the content is larger than the scroll view along the axis of the scroll direction. When false, it disables all bouncing even if the alwaysBounce* props are true.
| 类型 | 默认 |
|---|---|
| bool | true |
bouncesZoom iOS
当 true 时，手势可以驱动缩放超过最小/最大，并且缩放将在手势结束时动画到最小/最大值，否则缩放将不会超过限制。
¥When true, gestures can drive zoom past min/max and the zoom will animate to the min/max value at gesture end, otherwise the zoom will not exceed the limits.
| 类型 | 默认 |
|---|---|
| bool | true |
canCancelContentTouches iOS
当 false 时，一旦跟踪开始，如果触摸移动，将不会尝试拖动。
¥When false, once tracking starts, won't try to drag if the touch moves.
| 类型 | 默认 |
|---|---|
| bool | true |
centerContent iOS
当 true 时，当内容小于滚动视图边界时，滚动视图自动将内容居中；当内容大于滚动视图时，该属性不起作用。
¥When true, the scroll view automatically centers the content when the content is smaller than the scroll view bounds; when the content is larger than the scroll view, this property has no effect.
| 类型 | 默认 |
|---|---|
| bool | false |
contentContainerStyle
这些样式将应用于封装所有子视图的滚动视图内容容器。示例：
¥These styles will be applied to the scroll view content container which wraps all of the child views. Example:
return (
<ScrollView contentContainerStyle={styles.contentContainer}>
</ScrollView>
);
...
const styles = StyleSheet.create({
contentContainer: {
paddingVertical: 20
}
});
| 类型 |
|---|
| View 样式 |
contentInset iOS
滚动视图内容从滚动视图边缘插入的量。
¥The amount by which the scroll view content is inset from the edges of the scroll view.
| 类型 | 默认 |
|---|---|
目的：{top: number, left: number, bottom: number, right: number} | {top: 0, left: 0, bottom: 0, right: 0} |
contentInsetAdjustmentBehavior iOS
此属性指定如何使用安全区域插入来修改滚动视图的内容区域。适用于 iOS 11 及更高版本。
¥This property specifies how the safe area insets are used to modify the content area of the scroll view. Available on iOS 11 and later.
| 类型 | 默认 |
|---|---|
enum('automatic', 'scrollableAxes', 'never', 'always') | 'never' |
contentOffset
用于手动设置起始滚动偏移。
¥Used to manually set the starting scroll offset.
| 类型 | 默认 |
|---|---|
| 观点 | {x: 0, y: 0} |
decelerationRate
一个浮点数，用于确定用户抬起手指后滚动视图减速的速度。你还可以使用字符串快捷方式 "normal" 和 "fast"，它们分别与 UIScrollViewDecelerationRateNormal 和 UIScrollViewDecelerationRateFast 的底层 iOS 设置匹配。
¥A floating-point number that determines how quickly the scroll view decelerates after the user lifts their finger. You may also use string shortcuts "normal" and "fast" which match the underlying iOS settings for UIScrollViewDecelerationRateNormal and UIScrollViewDecelerationRateFast respectively.
-
'normal'在 iOS 上为 0.998，在 Android 上为 0.985。¥
'normal'0.998 on iOS, 0.985 on Android. -
'fast'，iOS 上为 0.99，Android 上为 0.9。¥
'fast', 0.99 on iOS, 0.9 on Android.
| 类型 | 默认 |
|---|---|
枚举（'fast'，'normal'），数字 | 'normal' |
directionalLockEnabled iOS
如果为 true，ScrollView 将在拖动时尝试锁定为仅垂直或水平滚动。
¥When true, the ScrollView will try to lock to only vertical or horizontal scrolling while dragging.
| 类型 | 默认 |
|---|---|
| bool | false |
disableIntervalMomentum
如果为 true，则无论手势有多快，滚动视图都会停止在下一个索引处（相对于释放时的滚动位置）。当页面小于水平 ScrollView 的宽度或垂直 ScrollView 的高度时，这可以用于分页。
¥When true, the scroll view stops on the next index (in relation to scroll position at release) regardless of how fast the gesture is. This can be used for pagination when the page is less than the width of the horizontal ScrollView or the height of the vertical ScrollView.
| 类型 | 默认 |
|---|---|
| bool | false |
disableScrollViewPanResponder
当 true 时，ScrollView 上的默认 JS 平移响应器将被禁用，并且对 ScrollView 内部触摸的完全控制将留给其子组件。如果启用 snapToInterval，这尤其有用，因为它不遵循典型的触摸模式。不要在没有 snapToInterval 的常规 ScrollView 用例上使用此选项，因为它可能会导致滚动时发生意外触摸。
¥When true, the default JS pan responder on the ScrollView is disabled, and full control over touches inside the ScrollView is left to its child components. This is particularly useful if snapToInterval is enabled, since it does not follow typical touch patterns. Do not use this on regular ScrollView use cases without snapToInterval as it may cause unexpected touches to occur while scrolling.
| 类型 | 默认 |
|---|---|
| bool | false |
endFillColor Android
有时，滚动视图占用的空间比其内容填充的空间还要多。在这种情况下，此属性将用颜色填充滚动视图的其余部分，以避免设置背景并造成不必要的过度绘制。这是一般情况下不需要的高级优化。
¥Sometimes a scrollview takes up more space than its content fills. When this is the case, this prop will fill the rest of the scrollview with a color to avoid setting a background and creating unnecessary overdraw. This is an advanced optimization that is not needed in the general case.
| 类型 |
|---|
| color |
fadingEdgeLength Android
淡出滚动内容的边缘。
¥Fades out the edges of the the scroll content.
如果该值大于 0，则将根据当前滚动方向和位置设置淡入淡出边缘，指示是否有更多内容要显示。
¥If the value is greater than 0, the fading edges will be set accordingly to the current scroll direction and position, indicating if there is more content to show.
| 类型 | 默认 |
|---|---|
| number | 0 |
horizontal
当 true 时，滚动视图的子级水平排列在行中，而不是垂直排列在列中。
¥When true, the scroll view's children are arranged horizontally in a row instead of vertically in a column.
| 类型 | 默认 |
|---|---|
| bool | false |
indicatorStyle iOS
滚动指示器的样式。
¥The style of the scroll indicators.
-
'default'与black相同。¥
'default'same asblack. -
'black'，滚动指示器为black。这种样式适合浅色背景。¥
'black', scroll indicator isblack. This style is good against a light background. -
'white'，滚动指示器为white。这种样式很适合深色背景。¥
'white', scroll indicator iswhite. This style is good against a dark background.
| 类型 | 默认 |
|---|---|
enum('default', 'black', 'white') | 'default' |
invertStickyHeaders
粘性标题是否应粘在 ScrollView 的底部而不是顶部。这通常与反向滚动视图一起使用。
¥If sticky headers should stick at the bottom instead of the top of the ScrollView. This is usually used with inverted ScrollViews.
| 类型 | 默认 |
|---|---|
| bool | false |
keyboardDismissMode
确定键盘是否因拖动而消失。
¥Determines whether the keyboard gets dismissed in response to a drag.
-
'none'、拖动时不要关闭键盘。¥
'none', drags do not dismiss the keyboard. -
'on-drag'，当拖动开始时键盘消失。¥
'on-drag', the keyboard is dismissed when a drag begins.
仅限 iOS
¥iOS Only
-
'interactive'，键盘通过拖动交互地解除，并与触摸同步移动，向上拖动取消解除。在 Android 上，这不受支持，它将具有与'none'相同的行为。¥
'interactive', the keyboard is dismissed interactively with the drag and moves in synchrony with the touch, dragging upwards cancels the dismissal. On Android this is not supported and it will have the same behavior as'none'.
| 类型 | 默认 |
|---|---|
enum('none', 'on-drag') Android enum( 'none', 'on-drag', 'interactive') iOS | 'none' |
keyboardShouldPersistTaps
确定键盘在点击后何时保持可见。
¥Determines when the keyboard should stay visible after a tap.
-
'never'当键盘弹起时，点击焦点文本输入之外的区域会关闭键盘。发生这种情况时，子级们将无法接受水龙头。¥
'never'tapping outside of the focused text input when the keyboard is up dismisses the keyboard. When this happens, children won't receive the tap. -
'always'，键盘不会自动关闭，滚动视图不会捕获点击，但滚动视图的子级可以捕获点击。¥
'always', the keyboard will not dismiss automatically, and the scroll view will not catch taps, but children of the scroll view can catch taps. -
'handled'，当滚动视图的子级处理（或由祖级捕获）点击时，键盘不会自动关闭。¥
'handled', the keyboard will not dismiss automatically when the tap was handled by children of the scroll view (or captured by an ancestor). -
false，已弃用，使用'never'代替¥
false, deprecated, use'never'instead -
true，已弃用，使用'always'代替¥
true, deprecated, use'always'instead
| 类型 | 默认 |
|---|---|
enum('always', 'never', 'handled', false, true) | 'never' |
maintainVisibleContentPosition
设置后，滚动视图将调整滚动位置，以便当前可见且位于或超出 minIndexForVisible 的第一个子项不会更改位置。这对于双向加载内容的列表非常有用，例如 聊天线程，其中传入的新消息可能会导致滚动位置跳转。值 0 很常见，但其他值（例如 1）可用于跳过加载旋转器或不应保持位置的其他内容。
¥When set, the scroll view will adjust the scroll position so that the first child that is currently visible and at or beyond minIndexForVisible will not change position. This is useful for lists that are loading content in both directions, e.g. a chat thread, where new messages coming in might otherwise cause the scroll position to jump. A value of 0 is common, but other values such as 1 can be used to skip loading spinners or other content that should not maintain position.
可选的 autoscrollToTopThreshold 可用于在调整前用户处于顶部阈值内时，调整后内容自动滚动到顶部。这对于类似聊天的应用也很有用，在这些应用中，你希望看到新消息滚动到位，但如果用户已经向上滚动了一段距离，并且滚动一堆消息会造成破坏，则不会。
¥The optional autoscrollToTopThreshold can be used to make the content automatically scroll to the top after making the adjustment if the user was within the threshold of the top before the adjustment was made. This is also useful for chat-like applications where you want to see new messages scroll into place, but not if the user has scrolled up a ways and it would be disruptive to scroll a bunch.
注意事项 1：启用此功能后，对滚动视图中的元素重新排序可能会导致跳跃和卡顿。它可以修复，但目前没有计划这样做。目前，不要对使用此功能的任何 ScrollView 或列表的内容重新排序。
¥Caveat 1: Reordering elements in the scrollview with this enabled will probably cause jumpiness and jank. It can be fixed, but there are currently no plans to do so. For now, don't re-order the content of any ScrollViews or Lists that use this feature.
注意事项 2：这在原生代码中使用 contentOffset 和 frame.origin 来计算可见性。关于内容是否为 "visible"，不会考虑遮挡、变换和其他复杂性。
¥Caveat 2: This uses contentOffset and frame.origin in native code to compute visibility. Occlusion, transforms, and other complexity won't be taken into account as to whether content is "visible" or not.
| 类型 |
|---|
目的：{minIndexForVisible: number, autoscrollToTopThreshold: number} |
maximumZoomScale iOS
允许的最大缩放比例。
¥The maximum allowed zoom scale.
| 类型 | 默认 |
|---|---|
| number | 1.0 |
minimumZoomScale iOS
允许的最小缩放比例。
¥The minimum allowed zoom scale.
| 类型 | 默认 |
|---|---|
| number | 1.0 |
nestedScrollEnabled Android
为 Android API 级别 21+ 启用嵌套滚动。
¥Enables nested scrolling for Android API level 21+.
| 类型 | 默认 |
|---|---|
| bool | false |
onContentSizeChange
当 ScrollView 的可滚动内容视图发生变化时调用。
¥Called when scrollable content view of the ScrollView changes.
处理函数将接收两个参数：内容宽度和内容高度 (contentWidth, contentHeight)。
¥The handler function will recieve two parameters: the content width and content height (contentWidth, contentHeight).
它是使用附加到此 ScrollView 渲染的内容容器的 onLayout 处理程序来实现的。
¥It's implemented using onLayout handler attached to the content container which this ScrollView renders.
| 类型 |
|---|
| function |
onMomentumScrollBegin
当动量滚动开始时调用（当 ScrollView 开始滑动时发生滚动）。
¥Called when the momentum scroll starts (scroll which occurs as the ScrollView starts gliding).
| 类型 |
|---|
| function |
onMomentumScrollEnd
当动量滚动结束时调用（当 ScrollView 滑行到停止时发生滚动）。
¥Called when the momentum scroll ends (scroll which occurs as the ScrollView glides to a stop).
| 类型 |
|---|
| function |
onScroll
滚动期间每帧最多触发一次。该事件具有以下形状（所有值都是数字）：
¥Fires at most once per frame during scrolling. The event has the following shape (all values are numbers):
{
nativeEvent: {
contentInset: {bottom, left, right, top},
contentOffset: {x, y},
contentSize: {height, width},
layoutMeasurement: {height, width},
zoomScale
}
}
| 类型 |
|---|
| function |
onScrollBeginDrag
当用户开始拖动滚动视图时调用。
¥Called when the user begins to drag the scroll view.
| 类型 |
|---|
| function |
onScrollEndDrag
当用户停止拖动滚动视图并且滚动视图停止或开始滑动时调用。
¥Called when the user stops dragging the scroll view and it either stops or begins to glide.
| 类型 |
|---|
| function |
onScrollToTop iOS
点击状态栏后滚动视图滚动到顶部时触发。
¥Fires when the scroll view scrolls to top after the status bar has been tapped.
| 类型 |
|---|
| function |
overScrollMode Android
用于覆盖 overScroll 模式的默认值。
¥Used to override default value of overScroll mode.
可能的值：
¥Possible values:
-
'auto'- 仅当内容足够大以进行有意义的滚动时，才允许用户过度滚动此视图。¥
'auto'- Allow a user to over-scroll this view only if the content is large enough to meaningfully scroll. -
'always'- 始终允许用户过度滚动此视图。¥
'always'- Always allow a user to over-scroll this view. -
'never'- 切勿允许用户过度滚动此视图。¥
'never'- Never allow a user to over-scroll this view.
| 类型 | 默认 |
|---|---|
enum('auto', 'always', 'never') | 'auto' |
pagingEnabled
如果为 true，则滚动视图在滚动时将停止在滚动视图大小的倍数处。这可用于水平分页。
¥When true, the scroll view stops on multiples of the scroll view's size when scrolling. This can be used for horizontal pagination.
| 类型 | 默认 |
|---|---|
| bool | false |
persistentScrollbar Android
导致滚动条在不使用时不会变成透明。
¥Causes the scrollbars not to turn transparent when they are not in use.
| 类型 | 默认 |
|---|---|
| bool | false |
pinchGestureEnabled iOS
当 true 时，ScrollView 允许使用捏合手势来放大和缩小。
¥When true, ScrollView allows use of pinch gestures to zoom in and out.
| 类型 | 默认 |
|---|---|
| bool | true |
refreshControl
RefreshControl 组件，用于为 ScrollView 提供下拉刷新功能。仅适用于垂直 ScrollView（horizontal 属性必须是 false）。
¥A RefreshControl component, used to provide pull-to-refresh functionality for the ScrollView. Only works for vertical ScrollViews (horizontal prop must be false).
参见 RefreshControl。
¥See RefreshControl.
| 类型 |
|---|
| element |
removeClippedSubviews
实验：当 true 时，离屏子视图（其 overflow 值为 hidden）会在离屏时从其原生支持超级视图中删除。这可以提高长列表的滚动性能。
¥Experimental: When true, offscreen child views (whose overflow value is hidden) are removed from their native backing superview when offscreen. This can improve scrolling performance on long lists.
| 类型 | 默认 |
|---|---|
| bool | false |
scrollEnabled
当为 false 时，视图无法通过触摸交互滚动。
¥When false, the view cannot be scrolled via touch interaction.
请注意，视图始终可以通过调用 scrollTo 来滚动。
¥Note that the view can always be scrolled by calling scrollTo.
| 类型 | 默认 |
|---|---|
| bool | true |
scrollEventThrottle
限制滚动时触发滚动事件的频率，以毫秒为单位的时间间隔指定。当响应滚动执行昂贵的工作时，这可能很有用。值≤16 将禁用节流，无论设备的刷新率如何。
¥Limits how often scroll events will be fired while scrolling, specified as a time interval in ms. This may be useful when expensive work is performed in response to scrolling. Values ≤ 16 will disable throttling, regardless of the refresh rate of the device.
| 类型 | 默认 |
|---|---|
| number | 0 |
scrollIndicatorInsets iOS
滚动视图指示器从滚动视图边缘插入的量。通常应将其设置为与 contentInset 相同的值。
¥The amount by which the scroll view indicators are inset from the edges of the scroll view. This should normally be set to the same value as the contentInset.
| 类型 | 默认 |
|---|---|
目的：{top: number, left: number, bottom: number, right: number} | {top: 0, left: 0, bottom: 0, right: 0} |
scrollPerfTag Android
用于记录此滚动视图上的滚动性能的标签。将强制打开动量事件（请参阅 sendMomentumEvents）。这不会做任何开箱即用的事情，你需要实现一个自定义的原生 FpsListener 才能发挥作用。
¥Tag used to log scroll performance on this scroll view. Will force momentum events to be turned on (see sendMomentumEvents). This doesn't do anything out of the box and you need to implement a custom native FpsListener for it to be useful.
| 类型 |
|---|
| string |
scrollToOverflowEnabled iOS
当 true 时，滚动视图可以通过编程方式滚动到超出其内容大小。
¥When true, the scroll view can be programmatically scrolled beyond its content size.
| 类型 | 默认 |
|---|---|
| bool | false |
scrollsToTop iOS
当 true 时，当点击状态栏时，滚动视图滚动到顶部。
¥When true, the scroll view scrolls to top when the status bar is tapped.
| 类型 | 默认 |
|---|---|
| bool | true |
showsHorizontalScrollIndicator
当 true 时，显示水平滚动指示器。
¥When true, shows a horizontal scroll indicator.
| 类型 | 默认 |
|---|---|
| bool | true |
showsVerticalScrollIndicator
当 true 时，显示垂直滚动指示器。
¥When true, shows a vertical scroll indicator.
| 类型 | 默认 |
|---|---|
| bool | true |
snapToAlignment iOS
当设置 snapToInterval 时，snapToAlignment 将定义捕捉到滚动视图的关系。
¥When snapToInterval is set, snapToAlignment will define the relationship of the snapping to the scroll view.
可能的值：
¥Possible values:
-
'start'将按扣对齐在左侧（水平）或顶部（垂直）。¥
'start'will align the snap at the left (horizontal) or top (vertical). -
'center'将按扣对齐在中心。¥
'center'will align the snap in the center. -
'end'将按扣对齐在右侧（水平）或底部（垂直）。¥
'end'will align the snap at the right (horizontal) or bottom (vertical).
| 类型 | 默认 |
|---|---|
enum('start', 'center', 'end') | 'start' |
snapToEnd
与 snapToOffsets 配合使用。默认情况下，列表末尾算作捕捉偏移。将 snapToEnd 设置为 false 可禁用此行为并允许列表在其末尾和最后一个 snapToOffsets 偏移之间自由滚动。
¥Use in conjunction with snapToOffsets. By default, the end of the list counts as a snap offset. Set snapToEnd to false to disable this behavior and allow the list to scroll freely between its end and the last snapToOffsets offset.
| 类型 | 默认 |
|---|---|
| bool | true |
snapToInterval
设置后，会使滚动视图停止在 snapToInterval 值的倍数处。这可用于对长度小于滚动视图的子项进行分页。通常与 snapToAlignment 和 decelerationRate="fast" 结合使用。覆盖配置较少的 pagingEnabled 属性。
¥When set, causes the scroll view to stop at multiples of the value of snapToInterval. This can be used for paginating through children that have lengths smaller than the scroll view. Typically used in combination with snapToAlignment and decelerationRate="fast". Overrides less configurable pagingEnabled prop.
| 类型 |
|---|
| number |
snapToOffsets
设置后，会使滚动视图停止在定义的偏移处。这可用于对长度小于滚动视图的各种大小的子项进行分页。通常与 decelerationRate="fast" 结合使用。覆盖配置较少的 pagingEnabled 和 snapToInterval 属性。
¥When set, causes the scroll view to stop at the defined offsets. This can be used for paginating through variously sized children that have lengths smaller than the scroll view. Typically used in combination with decelerationRate="fast". Overrides less configurable pagingEnabled and snapToInterval props.
| 类型 |
|---|
| 数字数组 |
snapToStart
与 snapToOffsets 配合使用。默认情况下，列表的开头算作捕捉偏移。将 snapToStart 设置为 false 可禁用此行为，并允许列表在其起始位置和第一个 snapToOffsets 偏移之间自由滚动。
¥Use in conjunction with snapToOffsets. By default, the beginning of the list counts as a snap offset. Set snapToStart to false to disable this behavior and allow the list to scroll freely between its start and the first snapToOffsets offset.
| 类型 | 默认 |
|---|---|
| bool | true |
stickyHeaderHiddenOnScroll
当设置为 true 时，向下滚动列表时粘性标题将隐藏，向上滚动时它将停靠在列表顶部。
¥When set to true, sticky header will be hidden when scrolling down the list, and it will dock at the top of the list when scrolling up.
| 类型 | 默认 |
|---|---|
| bool | false |
stickyHeaderIndices
子项索引数组，确定滚动时哪些子项停靠在屏幕顶部。例如，传递 stickyHeaderIndices={[0]} 将导致第一个子项固定在滚动视图的顶部。你还可以使用 [x,y,z] 来使多个项目在顶部时粘住。不支持此属性与 horizontal={true} 结合使用。
¥An array of child indices determining which children get docked to the top of the screen when scrolling. For example, passing stickyHeaderIndices={[0]} will cause the first child to be fixed to the top of the scroll view. You can also use like [x,y,z] to make multiple items sticky when they are at the top. This property is not supported in conjunction with horizontal={true}.
| 类型 |
|---|
| 数字数组 |
zoomScale iOS
滚动视图内容的当前比例。
¥The current scale of the scroll view content.
| 类型 | 默认 |
|---|---|
| number | 1.0 |
方法
¥Methods
flashScrollIndicators()
flashScrollIndicators();
暂时显示滚动指示器。
¥Displays the scroll indicators momentarily.
scrollTo()
scrollTo(
options?: {x?: number, y?: number, animated?: boolean} | number,
deprecatedX?: number,
deprecatedAnimated?: boolean,
);
使用平滑的动画立即滚动到给定的 x、y 偏移量。
¥Scrolls to a given x, y offset, either immediately, with a smooth animation.
示例：
¥Example:
scrollTo({x: 0, y: 0, animated: true})
注意：奇怪的函数签名是由于以下事实：由于历史原因，该函数还接受单独的参数作为选项对象的替代。由于不明确（y 位于 x 之前），此方法已被弃用，并且不应使用。
¥Note: The weird function signature is due to the fact that, for historical reasons, the function also accepts separate arguments as an alternative to the options object. This is deprecated due to ambiguity (y before x), and SHOULD NOT BE USED.
scrollToEnd()
scrollToEnd(options?: {animated?: boolean});
如果这是一个垂直的 ScrollView 滚动到底部。如果这是水平 ScrollView 则向右滚动。
¥If this is a vertical ScrollView scrolls to the bottom. If this is a horizontal ScrollView scrolls to the right.
使用 scrollToEnd({animated: true}) 进行平滑的动画滚动，使用 scrollToEnd({animated: false}) 进行立即滚动。如果未传递任何选项，则 animated 默认为 true。
¥Use scrollToEnd({animated: true}) for smooth animated scrolling, scrollToEnd({animated: false}) for immediate scrolling. If no options are passed, animated defaults to true.