root.js 1.7 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566
  1. import React from 'react';
  2. import {
  3. Animated,
  4. Easing,
  5. StyleSheet,
  6. } from 'react-native';
  7. import {
  8. createAppContainer, createStackNavigator,
  9. } from 'react-navigation';
  10. import Welcome from './pages/Welcome';
  11. import HomePage from './pages/Desktop/Index';
  12. const styles = StyleSheet.create({
  13. iconFont: {
  14. fontFamily: 'iconfont',
  15. fontSize: 24,
  16. color: '#757575'
  17. },
  18. iconFontFocused: {
  19. fontFamily: 'iconfont',
  20. fontSize: 24,
  21. color: '#2b90ea'
  22. }
  23. })
  24. const AppNavigator = createStackNavigator(
  25. {
  26. Welcome: {screen: Welcome},
  27. Main: {screen: HomePage},
  28. },
  29. {
  30. headerMode: 'none',
  31. mode: 'modal',
  32. navigationOptions: {
  33. gesturesEnabled: false,
  34. },
  35. transitionConfig: () => ({
  36. transitionSpec: {
  37. duration: 300,
  38. easing: Easing.out(Easing.poly(4)),
  39. timing: Animated.timing,
  40. },
  41. screenInterpolator: sceneProps => {
  42. const {layout, position, scene} = sceneProps
  43. const {index} = scene
  44. const height = layout.initHeight
  45. const translateY = position.interpolate({
  46. inputRange: [index - 1, index, index + 1],
  47. outputRange: [height, 0, 0],
  48. })
  49. const opacity = position.interpolate({
  50. inputRange: [index - 1, index - 0.99, index],
  51. outputRange: [0, 1, 1],
  52. })
  53. return {opacity, transform: [{translateY}]}
  54. },
  55. }),
  56. }
  57. );
  58. export const RootNavigator = createAppContainer(AppNavigator);
  59. export default RootNavigator;