Skip to content

Commit 16c9e5b

Browse files
siddhantsonifacebook-github-bot
siddhantsoni
authored andcommitted
Fix: Added scroll Bounds check in scrollToOffset method in RCTScrollView on iOS
Summary: <!-- Thank you for sending the PR! We appreciate you spending the time to work on these changes. Help us understand your motivation by explaining why you decided to make this change. You can learn more about contributing to React Native here: http://facebook.github.io/react-native/docs/contributing.html Happy contributing! --> The scrollToOffset method of RCTScrollView for iOS does not include bound check for the scroll offset provided to the method. This can cause the whole view to scroll out of screen if the offset provided is greater than the bounds of the View. The same does not happen on Android, where the scroll halts once the last item of the scrollView is in the viewport. I have added bounds check so the offset resets to the MaxOffset which makes sure the view does not scroll out of the viewport. The issue can be observed in the following snack: https://snack.expo.io/H1363Uo8f ![ezgif com-optimize 1](https://user-images.githubusercontent.com/16662518/36068270-2437ae88-0ef7-11e8-96dd-819b4ae0fd67.gif) To test my changes I ran the code provided in the snack above with the react-native dependency pointing to my branch. As can be see in the video attached below, the scroll halts once it hits the end of the ScrollView even if the scroll offset provided is higher than the bounds of the ScrollView. It also does not scroll up for negative scroll offset. ![ezgif com-optimize](https://user-images.githubusercontent.com/16662518/36068130-9ae4f918-0ef3-11e8-8728-af7b2888bdb8.gif) [IOS] [BUGFIX] [ScrollView] - Added bounds check to prevent ScrollView from scrolling to an offset which is out of bounds of the ScrollView for iOS. Closes facebook#17927 Differential Revision: D7014466 Pulled By: shergin fbshipit-source-id: a817738d08e1057a4c70f43373132f88fa1461c4
1 parent 59c7b2c commit 16c9e5b

File tree

1 file changed

+3
-0
lines changed

1 file changed

+3
-0
lines changed

React/Views/ScrollView/RCTScrollView.m

+3
Original file line numberDiff line numberDiff line change
@@ -575,6 +575,9 @@ - (void)scrollToOffset:(CGPoint)offset
575575
- (void)scrollToOffset:(CGPoint)offset animated:(BOOL)animated
576576
{
577577
if (!CGPointEqualToPoint(_scrollView.contentOffset, offset)) {
578+
CGFloat maxOffsetX = _scrollView.contentSize.width - _scrollView.bounds.size.width + _scrollView.contentInset.right;
579+
CGFloat maxOffsetY = _scrollView.contentSize.height - _scrollView.bounds.size.height + _scrollView.contentInset.bottom;
580+
offset = CGPointMake(MAX(0, MIN(maxOffsetX, offset.x)), MAX(0, MIN(maxOffsetY, offset.y)));
578581
// Ensure at least one scroll event will fire
579582
_allowNextScrollNoMatterWhat = YES;
580583
[_scrollView setContentOffset:offset animated:animated];

0 commit comments

Comments
 (0)