-
Notifications
You must be signed in to change notification settings - Fork 0
/
App.js
96 lines (90 loc) · 2.81 KB
/
App.js
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
import React from 'react'
import { NavigationContainer } from '@react-navigation/native'
import { createStackNavigator } from '@react-navigation/stack'
import { createMaterialTopTabNavigator } from '@react-navigation/material-top-tabs'
import { enableScreens } from 'react-native-screens'
import Home from './src/screens/Home/Home'
import Header from './src/components/Header/Header'
import News from './src/screens/News/News'
import MyTabBar from './src/components/MyTabBar/MyTabBar'
import Live from './src/screens/Live/Live'
import Statistic from './src/screens/Statistic/Statistic'
import Blank from './src/screens/Blank/Blank'
import Detail from './src/screens/Detail/Detail'
import { timing } from 'react-native-reanimated'
enableScreens()
const App = () => {
return (
<NavigationContainer>
<MyStack />
</NavigationContainer>
)
}
export default App
const Stack = createStackNavigator()
const MyStack = () => {
return (
<Stack.Navigator
screenOptions={{
header: (props) => {
return <Header {...props} />
},
gestureEnabled: false,
transitionSpec: {
open: { animation: timing, config: { duration: 100 } },
close: { animation: timing, config: { duration: 100 } }
},
cardStyleInterpolator: ({ current: { progress } }) => {
return {
cardStyle: {
opacity: progress,
}
}
},
cardStyle:{backgroundColor: '#030610'},
}}
headerMode='float'>
<Stack.Screen name='Home' component={HomeTab} />
<Stack.Screen name='Detail' component={DetailTab} />
</Stack.Navigator>
)
}
const Tab = createMaterialTopTabNavigator()
const HomeTab = () => {
return (
<Tab.Navigator
timingConfig={{ duration: 1 }}
swipeEnabled={false}
initialRouteName='home'
backBehavior='initialRoute'
removeClippedSubviews={true}
sceneContainerStyle={{ backgroundColor: '#030610' }}
tabBarOptions={{ scrollEnabled: true }}
tabBar={(props) => <MyTabBar mode='scroll' {...props} />}>
<Tab.Screen name='home' component={Home} />
<Tab.Screen name='news' component={News} />
<Tab.Screen name='live' component={Live} />
<Tab.Screen name='statistic' component={Statistic} />
<Tab.Screen name='table' component={Blank} />
<Tab.Screen name='tickets' component={Blank} />
</Tab.Navigator>
)
}
const DetailTab = () => {
return (
<Tab.Navigator
timingConfig={{ duration: 1 }}
swipeEnabled={false}
initialRouteName='home'
backBehavior='initialRoute'
removeClippedSubviews={true}
sceneContainerStyle={{ backgroundColor: '#030610' }}
tabBarOptions={{ scrollEnabled: true }}
tabBar={(props) => <MyTabBar {...props} />}>
<Tab.Screen name='serie a' component={Detail} />
<Tab.Screen name='ucl' component={Blank} />
<Tab.Screen name='coppa italia' component={Blank} />
<Tab.Screen name='super cup' component={Blank} />
</Tab.Navigator>
)
}