-
Notifications
You must be signed in to change notification settings - Fork 1
/
App.tsx
143 lines (123 loc) · 4.83 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
98
99
100
101
102
103
104
105
106
107
108
109
110
111
112
113
114
115
116
117
118
119
120
121
122
123
124
125
126
127
128
129
130
131
132
133
134
135
136
137
138
139
140
141
142
143
import * as React from 'react';
import { View, Text, Button } from 'react-native';
import { NavigationContainer, StackRouter } from '@react-navigation/native';
import { createStackNavigator } from '@react-navigation/stack';
import { createBottomTabNavigator } from '@react-navigation/bottom-tabs';
import Ionicons from 'react-native-vector-icons/Ionicons';
import StashStackScreen from './screens/StashStackScreen';
import StashScreen, { getDB } from './screens/StashScreen';
import ScannerScreen from './screens/ScannerScreen';
import HomeScreen from './screens/HomeScreen';
import ItemScreen from './screens/ItemScreen';
import HomeStackScreen from './screens/HomeStackScreen';
import ScannerStackScreen from './screens/ScannerStackScreen';
//import { getItemsLength } from './screens/StashScreen';
import { DrawerContent } from './screens/DrawerContent';
import { createDrawerNavigator } from '@react-navigation/drawer';
import Database from './components/Database'
import { getAll } from './screens/StashScreen';
import StatsStackScreen from './screens/StatsStackScreen';
import HelpStackScreen from './screens/HelpStackScreen';
const Drawer = createDrawerNavigator();
const Stack = createStackNavigator();
const Tab = createBottomTabNavigator();
let uniqueValue = 1
export function forceUpdate(){
uniqueValue += 1
console.log("Unique value=" + uniqueValue)
}
function DrawerHomeNavigator() {
return (
<Drawer.Navigator hideStatusBar={false} drawerContent={props => <DrawerContent {... props}/> }>
<Drawer.Screen name="HOME" component={HomeStackScreen} />
</Drawer.Navigator>
);
}
function DrawerStashNavigator(){
return (
<Drawer.Navigator hideStatusBar={false} drawerContent={props => <DrawerContent {... props}/> }>
<Drawer.Screen name="STASH" component={StashStackScreen} />
</Drawer.Navigator>
);
}
function DrawerScannerNavigator(){
return (
<Drawer.Navigator hideStatusBar={false} drawerContent={props => <DrawerContent {... props}/> }>
<Drawer.Screen name="SCAN" component={ScannerStackScreen} />
</Drawer.Navigator>
);
}
function StatsStackNavigator(){
return (
<Drawer.Navigator hideStatusBar={false} drawerContent={props => <DrawerContent {... props}/> }>
<Drawer.Screen name="STATS" component={StatsStackScreen} />
</Drawer.Navigator>
);
}
function HelpStackNavigator(){
return (
<Drawer.Navigator hideStatusBar={false} drawerContent={props => <DrawerContent {... props}/> }>
<Drawer.Screen name="HELP" component={HelpStackScreen} />
</Drawer.Navigator>
);
}
//TODO herschrijven naar een class
function App() {
const db = new Database();
return (
<NavigationContainer key={uniqueValue}>
<Tab.Navigator
screenOptions={({ route }) => ({
tabBarIcon: ({ focused, color, size }) => {
let iconName = "";
if (route.name === 'HOME') {
iconName = focused ? 'home' : 'home';
} else if (route.name === 'STASH') {
iconName = focused ? 'fast-food' : 'fast-food';
}
else if (route.name === 'SCAN') {
iconName = focused ? 'barcode' : 'barcode';
}
// You can return any component that you like here!
return <Ionicons name={iconName} size={size} color={color} />;
},
})}
tabBarOptions={{
activeBackgroundColor: '#8AB8B4',
activeTintColor: '#2F403E',
inactiveTintColor: '#5C7D7A',
keyboardHidesTabBar: true,
inactiveBackgroundColor: '#9ED2CE'
}}
>
<Tab.Screen name="HOME" component={DrawerHomeNavigator} />
<Tab.Screen name="STASH" component={DrawerStashNavigator} options={{ tabBarBadge: db.getLijstVervallen().length }} />
<Tab.Screen name="SCAN" component={DrawerScannerNavigator} />
</Tab.Navigator>
</NavigationContainer>
);
}
export default App;
/*
Before running this, you NEED to edit 2 files
1. /android/app/build.gradle:
defaultConfig {
applicationId "com.koelkastapp"
minSdkVersion rootProject.ext.minSdkVersion
missingDimensionStrategy 'react-native-camera', 'general' <-- this was added
targetSdkVersion rootProject.ext.targetSdkVersion
versionCode 1
versionName "1.0"
}
2. add the following to /android/app/src/main/AndroidManifest.xml (permissions)=
<uses-permission android:name="android.permission.CAMERA" />
<uses-permission android:name="android.permission.RECORD_AUDIO"/>
<uses-permission android:name="android.permission.READ_EXTERNAL_STORAGE" />
<uses-permission android:name="android.permission.WRITE_EXTERNAL_STORAGE" />
*/
/* help it didn't run, what now?
1. did you npm i react-native-camera?
2. did you link camera? (react-native link react-native-camera)
3. did you npm i again?
4. offer a goat
*/