kylefang/react-native
1
0
Fork 0
mirror of https://github.com/zhigang1992/react-native.git synced 2026-04-19 23:40:09 +08:00
Code Issues Packages Projects Releases Wiki Activity

Support ScrollView.scrollToEnd on Android natively

Browse Source 
Summary:
This is a followup for https://github.com/facebook/react-native/pull/12088 and implements the scrolling to end on Android natively rather than sending a large scroll offset from JS.

This turned out to be an OK amount of code, and some reduction in the amount of JavaScript. The only part I'm not particularly happy about is:

```
// ScrollView always has one child - the scrollable area
int bottom = scrollView.getChildAt(0).getHeight() + scrollView.getPaddingBottom();
```

According to multiple sources (e.g. [this SO answer](http://stackoverflow.com/questions/3609297/android-total-height-of-scrollview)) it is the way to get the total size of the scrollable area, similar to`scrollView.contentSize` on iOS but more ugly and relying on the fact the ScrollView always has a single child (hopefully this won't change in future versions of Android).

An alternative is:

```
View lastChild = scrollLayout.getChildAt(scrollLayout.getChildCount() - 1);
int bottom = lastChild.getBottom() + scrollLayout.getPadd
Closes https://github.com/facebook/react-native/pull/12101

Differential Revision: D4481523

Pulled By: mkonicek

fbshipit-source-id: 8c7967a0b9e06890c1e1ea70ad573c6eceb03daf
This commit is contained in:
Martin Konicek
2017-01-30 10:15:18 -08:00
committed by Facebook Github Bot
parent 56595bf2a4
commit ad8cbb6dea
6 changed files with 59 additions and 24 deletions
Download Patch File Download Diff File Expand all files Collapse all files

6
Libraries/Components/ScrollResponder.js
View File

@@ -415,12 +415,6 @@ var ScrollResponderMixin = {
scrollResponderScrollToEnd: function(
options?: { animated?: boolean },
) {
if (Platform.OS !== 'ios') {
console.warn(
'scrollResponderScrollToEnd is not supported on this platform'
);
return;
}
// Default to true
const animated = (options && options.animated) !== false;
UIManager.dispatchViewManagerCommand(

20
Libraries/Components/ScrollView/ScrollView.js
View File

@@ -410,29 +410,15 @@ const ScrollView = React.createClass({
* Use `scrollToEnd({animated: true})` for smooth animated scrolling,
* `scrollToEnd({animated: false})` for immediate scrolling.
* If no options are passed, `animated` defaults to true.
*
* See `ScrollView#scrollToEnd`.
*/
scrollToEnd: function(
options?: { animated?: boolean },
) {
// Default to true
const animated = (options && options.animated) !== false;
if (Platform.OS === 'ios') {
this.getScrollResponder().scrollResponderScrollToEnd({
animated: animated,
});
} else if (Platform.OS === 'android') {
// On Android scrolling past the end of the ScrollView gets clipped
// - scrolls to the end.
if (this.props.horizontal) {
this.scrollTo({x: 10*1000*1000, animated: animated});
} else {
this.scrollTo({y: 10*1000*1000, animated: animated});
}
} else {
console.warn('scrollToEnd is not supported on this platform');
}
this.getScrollResponder().scrollResponderScrollToEnd({
animated: animated,
});
},
/**