kylefang/react-navigation
1
0
Fork 0
mirror of https://github.com/zhigang1992/react-navigation.git synced 2026-02-09 09:13:32 +08:00
Code Issues Packages Projects Releases Wiki Activity

Merge pull request #8 from ikhilko/master

Browse Source 
Expose underlaying ScrollView methods to NavigationAwareScrollable
This commit is contained in:
Brent Vatne
2018-12-03 16:01:29 -08:00
parent c02f1e978c
commit 3e4af09528
1 changed files with 72 additions and 51 deletions
Download Patch File Download Diff File Expand all files Collapse all files

123
packages/native/src/createNavigationAwareScrollable.js
View File

@@ -3,91 +3,112 @@ import hoistStatics from 'hoist-non-react-statics';
import { withNavigation } from '@react-navigation/core';
export default function createNavigationAwareScrollable(Component: any) {
class ComponentWithNavigationScrolling extends React.PureComponent<any> {
const ComponentWithNavigationScrolling = withNavigation(
class extends React.PureComponent<any> {
static displayName = `withNavigationScrollable(${Component.displayName ||
Component.name})`;
_subscription: any;
componentDidMount() {
this._subscription = this.props.navigation.addListener(
'refocus',
() => {
const scrollableNode = this.getNode();
if (this.props.navigation.isFocused() && scrollableNode !== null) {
if (scrollableNode.scrollToTop != null) {
scrollableNode.scrollToTop();
} else if (scrollableNode.scrollTo != null) {
scrollableNode.scrollTo({ y: 0 });
}
}
}
);
}
getNode() {
if (this._scrollRef === null) {
return null;
}
if (this._scrollRef.getScrollResponder) {
return this._scrollRef.getScrollResponder();
} else if (this._scrollRef.getNode) {
return this._scrollRef.getNode();
} else {
return this._scrollRef;
}
}
componentWillUnmount() {
if (this._subscription != null) {
this._subscription.remove();
}
}
render() {
return (
<Component
ref={view => {
this._scrollRef = view;
}}
{...this.props}
/>
);
}
}
);
class NavigationAwareScrollable extends React.PureComponent<any> {
static displayName = `NavigationAwareScrollable(${Component.displayName ||
Component.name})`;
_subscription: any;
componentDidMount() {
this._subscription = this.props.navigation.addListener('refocus', () => {
const scrollableNode = this.getNode();
if (this.props.navigation.isFocused() && scrollableNode !== null) {
if (scrollableNode.scrollToTop != null) {
scrollableNode.scrollToTop();
} else if (scrollableNode.scrollTo != null) {
scrollableNode.scrollTo({ y: 0 });
}
}
});
}
_captureRef = view => {
this._innerRef = view;
this.props.onRef && this.props.onRef(view);
};
setNativeProps = (...args) => {
return this.getNode().setNativeProps(...args);
return this._innerRef.getNode().setNativeProps(...args);
};
getScrollResponder = (...args) => {
return this.getNode().getScrollResponder(...args);
return this._innerRef.getNode().getScrollResponder(...args);
};
getScrollableNode = (...args) => {
return this.getNode().getScrollableNode(...args);
return this._innerRef.getNode().getScrollableNode(...args);
};
getInnerViewNode = (...args) => {
return this.getNode().getInnerViewNode(...args);
return this._innerRef.getNode().getInnerViewNode(...args);
};
scrollTo = (...args) => {
return this.getNode().scrollTo(...args);
return this._innerRef.getNode().scrollTo(...args);
};
scrollToEnd = (...args) => {
return this.getNode().scrollToEnd(...args);
return this._innerRef.getNode().scrollToEnd(...args);
};
scrollWithoutAnimationTo = (...args) => {
return this.getNode().scrollWithoutAnimationTo(...args);
return this._innerRef.getNode().scrollWithoutAnimationTo(...args);
};
flashScrollIndicators = (...args) => {
return this.getNode().flashScrollIndicators(...args);
return this._innerRef.getNode().flashScrollIndicators(...args);
};
getNode() {
if (this._scrollRef === null) {
return null;
}
if (this._scrollRef.getScrollResponder) {
return this._scrollRef.getScrollResponder();
} else if (this._scrollRef.getNode) {
return this._scrollRef.getNode();
} else {
return this._scrollRef;
}
}
componentWillUnmount() {
if (this._subscription != null) {
this._subscription.remove();
}
}
render() {
return (
<Component
ref={view => {
this._scrollRef = view;
}}
<ComponentWithNavigationScrolling
{...this.props}
onRef={this._captureRef}
/>
);
}
}
return hoistStatics(
withNavigation(ComponentWithNavigationScrolling),
Component
);
return hoistStatics(NavigationAwareScrollable, Component);
}