-
Notifications
You must be signed in to change notification settings - Fork 0
/
App.tsx
97 lines (85 loc) · 2.93 KB
/
App.tsx
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
97
import React from 'react';
import {createStackNavigator} from '@react-navigation/stack';
import { NavigationContainer, NavigationContainerRef} from '@react-navigation/native';
import { StyleSheet, View, Image} from 'react-native';
import { Text, Button } from 'react-native-elements';
import Main from './src/screens/Main'
import Generator from './src/screens/Generator'
import Leaderboard from './src/screens/Leaderboard';
import Modal from 'react-native-modal'
import Licenses from './src/screens/Licenses';
//import { AppLoading } from 'expo';
//import Modal from 'react-native-modal'
export type RootStackParamList = {
Generator: {};
Leaderboard: {};
Main: {};
};
export const navigationRef = React.createRef<NavigationContainerRef>();
const Stack = createStackNavigator<RootStackParamList>();
interface State {
showAbout: boolean
}
interface Props {
}
export default class App extends React.Component<Props, State> {
constructor(props: Readonly<Props>) {
super(props);
this.state = {
showAbout: false
}
}
public render() {
return (
<NavigationContainer>
<Modal
isVisible={this.state.showAbout}
onBackdropPress={() => this.setState({showAbout: false})}
onBackButtonPress={() => this.setState({showAbout: false})}
>
<View style={{backgroundColor: 'white', height:'80%', width: '90%', borderRadius: 12, alignSelf: 'center'}}>
<Licenses></Licenses>
</View>
</Modal>
<Stack.Navigator initialRouteName="Main">
<Stack.Screen name="Main" component={Main} options={{
headerTitle: () =>
<Text style= {styles.headerTextStyles}>LOAF</Text>,
headerRight: () => (
<Button
title="About"
type="outline"
titleStyle={{fontFamily:'Nathaniel19-Regular', fontSize:14}}
onPress={() => this.setState({showAbout: true})}
buttonStyle={{marginRight:18}}
/>)}} />
<Stack.Screen name="Generator" component={Generator} options={{headerTitle: () =>
<Text style= {styles.headerTextStyles}>Generator</Text>, headerBackTitleStyle:styles.backHeaderTextStyle}} />
<Stack.Screen name="Leaderboard" component={Leaderboard} options={{headerTitle: () =>
<Text style= {styles.headerTextStyles}>Leaderboard</Text>, headerBackTitleStyle:styles.backHeaderTextStyle}} />
</Stack.Navigator>
</NavigationContainer>
)
}
}
const styles = StyleSheet.create({
container: {
flex: 1,
backgroundColor: '#fff',
alignItems: 'center',
justifyContent: 'center',
},
logo: {
width: 80,
},
headerTextStyles: {
fontFamily:'Nathaniel19-Regular',
color: 'black',
fontWeight: '800',
fontSize: 20
},
backHeaderTextStyle: {
fontFamily:'Nathaniel19-Regular',
fontSize: 18
}
});