[REGRESSION] Use LayoutAnimation instead of Transition API (#1338)
This commit is contained in:
parent
fcb420a773
commit
0a8404d723
15
app/index.js
15
app/index.js
|
@ -19,7 +19,6 @@ import { defaultHeader, onNavigationStateChange } from './utils/navigation';
|
||||||
import { loggerConfig, analytics } from './utils/log';
|
import { loggerConfig, analytics } from './utils/log';
|
||||||
import Toast from './containers/Toast';
|
import Toast from './containers/Toast';
|
||||||
import RocketChat from './lib/rocketchat';
|
import RocketChat from './lib/rocketchat';
|
||||||
import LayoutAnimation from './utils/layoutAnimation';
|
|
||||||
|
|
||||||
useScreens();
|
useScreens();
|
||||||
|
|
||||||
|
@ -313,14 +312,12 @@ export default class Root extends React.Component {
|
||||||
render() {
|
render() {
|
||||||
return (
|
return (
|
||||||
<Provider store={store}>
|
<Provider store={store}>
|
||||||
<LayoutAnimation>
|
<App
|
||||||
<App
|
ref={(navigatorRef) => {
|
||||||
ref={(navigatorRef) => {
|
Navigation.setTopLevelNavigator(navigatorRef);
|
||||||
Navigation.setTopLevelNavigator(navigatorRef);
|
}}
|
||||||
}}
|
onNavigationStateChange={onNavigationStateChange}
|
||||||
onNavigationStateChange={onNavigationStateChange}
|
/>
|
||||||
/>
|
|
||||||
</LayoutAnimation>
|
|
||||||
</Provider>
|
</Provider>
|
||||||
);
|
);
|
||||||
}
|
}
|
||||||
|
|
15
app/share.js
15
app/share.js
|
@ -11,7 +11,6 @@ import sharedStyles from './views/Styles';
|
||||||
import { isNotch, isIOS } from './utils/deviceInfo';
|
import { isNotch, isIOS } from './utils/deviceInfo';
|
||||||
import { defaultHeader, onNavigationStateChange } from './utils/navigation';
|
import { defaultHeader, onNavigationStateChange } from './utils/navigation';
|
||||||
import RocketChat from './lib/rocketchat';
|
import RocketChat from './lib/rocketchat';
|
||||||
import LayoutAnimation from './utils/layoutAnimation';
|
|
||||||
|
|
||||||
const InsideNavigator = createStackNavigator({
|
const InsideNavigator = createStackNavigator({
|
||||||
ShareListView: {
|
ShareListView: {
|
||||||
|
@ -85,14 +84,12 @@ class Root extends React.Component {
|
||||||
onLayout={this.handleLayout}
|
onLayout={this.handleLayout}
|
||||||
>
|
>
|
||||||
<Provider store={store}>
|
<Provider store={store}>
|
||||||
<LayoutAnimation>
|
<AppContainer
|
||||||
<AppContainer
|
ref={(navigatorRef) => {
|
||||||
ref={(navigatorRef) => {
|
Navigation.setTopLevelNavigator(navigatorRef);
|
||||||
Navigation.setTopLevelNavigator(navigatorRef);
|
}}
|
||||||
}}
|
onNavigationStateChange={onNavigationStateChange}
|
||||||
onNavigationStateChange={onNavigationStateChange}
|
/>
|
||||||
/>
|
|
||||||
</LayoutAnimation>
|
|
||||||
</Provider>
|
</Provider>
|
||||||
</View>
|
</View>
|
||||||
);
|
);
|
||||||
|
|
|
@ -1,44 +1,10 @@
|
||||||
import React from 'react';
|
import { LayoutAnimation } from 'react-native';
|
||||||
import { Transition, Transitioning } from 'react-native-reanimated';
|
|
||||||
import PropTypes from 'prop-types';
|
|
||||||
|
|
||||||
import debounce from './debounce';
|
import debounce from './debounce';
|
||||||
import { isIOS } from './deviceInfo';
|
import { isIOS } from './deviceInfo';
|
||||||
import sharedStyles from '../views/Styles';
|
|
||||||
|
|
||||||
const transition = (
|
|
||||||
<Transition.Together>
|
|
||||||
<Transition.In type='fade' />
|
|
||||||
<Transition.Out type='fade' />
|
|
||||||
<Transition.Change interpolation='easeInOut' />
|
|
||||||
</Transition.Together>
|
|
||||||
);
|
|
||||||
|
|
||||||
const TRANSITION_REF = React.createRef();
|
|
||||||
|
|
||||||
export const animateNextTransition = debounce(() => {
|
export const animateNextTransition = debounce(() => {
|
||||||
if (isIOS) {
|
if (isIOS) {
|
||||||
TRANSITION_REF.current.animateNextTransition();
|
LayoutAnimation.easeInEaseOut();
|
||||||
}
|
}
|
||||||
}, 200, true);
|
}, 200, true);
|
||||||
|
|
||||||
const LayoutAnimation = ({ children }) => {
|
|
||||||
if (isIOS) {
|
|
||||||
return (
|
|
||||||
<Transitioning.View
|
|
||||||
style={sharedStyles.root}
|
|
||||||
transition={transition}
|
|
||||||
ref={TRANSITION_REF}
|
|
||||||
>
|
|
||||||
{children}
|
|
||||||
</Transitioning.View>
|
|
||||||
);
|
|
||||||
}
|
|
||||||
return children;
|
|
||||||
};
|
|
||||||
|
|
||||||
LayoutAnimation.propTypes = {
|
|
||||||
children: PropTypes.node
|
|
||||||
};
|
|
||||||
|
|
||||||
export default LayoutAnimation;
|
|
||||||
|
|
Loading…
Reference in New Issue