Added Screen component and other pages

This commit is contained in:
bobbert committed 2025-10-24 21:45:55 +01:00
1 parent 1c4e1ea49e
commit 5345bd120b
10 files changed
+109 -85

No files matched your search

+23 -2
View File
@@ -1,6 +1,9 @@
import { NavigationContainer } from "@react-navigation/native";
import { createNativeStackNavigator } from "@react-navigation/native-stack";
import ModuleListScreen from "./src/components/screens/ModuleListScreen";
import ModuleModifyScreen from "./src/components/screens/ModuleModifyScreen";
import ModuleViewScreen from "./src/components/screens/ModuleViewScreen";
import ModuleAddScreen from "./src/components/screens/ModuleAddScreen";
const Stack = createNativeStackNavigator();
@@ -12,18 +15,36 @@ export const App = () => {
return (
<NavigationContainer>
<Stack.Navigator
initialRouteName='ModuleListScreen'
initialRouteName='ModuleAddScreen'
screenOptions= {{
headerStyle: { backgroundColor: "black" },
headerTintColor: "white"
}}
>
<Stack.Screen
name="ModuleListScreen"
component={ModuleListScreen}
options={{ title: 'List Modules' }}
/>
<Stack.Screen
name="ModuleAddScreen"
component={ModuleAddScreen}
options={{ title: 'Add Modules' }}
/>
<Stack.Screen
name="ModuleViewScreen"
component={ModuleViewScreen}
options={{ title: 'View Modules' }}
/>
<Stack.Screen
name="ModuleModifyScreen"
component={ModuleModifyScreen}
options={{ title: 'Modify Modules' }}
/>
</Stack.Navigator>
</NavigationContainer>
+26
View File
@@ -0,0 +1,26 @@
import { StatusBar } from "expo-status-bar";
import { StyleSheet, View } from "react-native";
const Screen = ({children}) => {
// Initialisation -------------
// State ----------------------
// Handlers -------------------
// View -----------------------
return (
<View style={styles.screen}>
{children}
<StatusBar style="light" />
</View>
);
};
const styles = StyleSheet.create({
screen: {
flex: 1,
backgroundColor: "#fff",
alignItems: "center",
justifyContent: "center",
},
});
export default Screen;
-22
View File
@@ -1,22 +0,0 @@
export default function add() {
// Initialisation ...............
// State ........................
// Handlers .....................
// View .........................
return (
<View style={styles.container}>
<Text>activity 1 complete on week 1 yay!</Text>
<StatusBar style="auto" />
</View>
);
}
const styles = StyleSheet.create({
container: {
flex: 1,
backgroundColor: "#fff",
alignItems: "center",
justifyContent: "center",
},
});
-17
View File
@@ -1,17 +0,0 @@
export default function list() {
return (
<View style={styles.container}>
<Text>activity 1 complete on week 1 yay!</Text>
<StatusBar style="auto" />
</View>
);
}
const styles = StyleSheet.create({
container: {
flex: 1,
backgroundColor: "#fff",
alignItems: "center",
justifyContent: "center",
},
});
-17
View File
@@ -1,17 +0,0 @@
export default function modify() {
return (
<View style={styles.container}>
<Text>activity 1 complete on week 1 yay!</Text>
<StatusBar style="auto" />
</View>
);
}
const styles = StyleSheet.create({
container: {
flex: 1,
backgroundColor: "#fff",
alignItems: "center",
justifyContent: "center",
},
});
+19
View File
@@ -0,0 +1,19 @@
import { StatusBar } from "expo-status-bar";
import { StyleSheet, Text, View } from "react-native";
export const ModuleAddScreen = () => {
// Initialisation -------------
// State ----------------------
// Handlers -------------------
// View -----------------------
return (
<Screen style={styles.container}>
<Text>Add</Text>
<StatusBar style="auto" />
</Screen>
);
};
const styles = StyleSheet.create({});
export default ModuleAddScreen;
+3 -10
View File
@@ -7,20 +7,13 @@ export const ModuleListScreen = () => {
// Handlers -------------------
// View -----------------------
return (
<View style={styles.container}>
<Screen style={styles.container}>
<Text>List</Text>
<StatusBar style="auto" />
</View>
</Screen>
);
};
const styles = StyleSheet.create({
container: {
flex: 1,
backgroundColor: "#fff",
alignItems: "center",
justifyContent: "center",
},
});
const styles = StyleSheet.create({});
export default ModuleListScreen;
@@ -0,0 +1,19 @@
import { StatusBar } from "expo-status-bar";
import { StyleSheet, Text, View } from "react-native";
export const ModuleModifyScreen = () => {
// Initialisation -------------
// State ----------------------
// Handlers -------------------
// View -----------------------
return (
<Screen style={styles.container}>
<Text>Modify</Text>
<StatusBar style="auto" />
</Screen>
);
};
const styles = StyleSheet.create({});
export default ModuleModifyScreen;
@@ -0,0 +1,19 @@
import { StatusBar } from "expo-status-bar";
import { StyleSheet, Text, View } from "react-native";
export const ModuleViewScreen = () => {
// Initialisation -------------
// State ----------------------
// Handlers -------------------
// View -----------------------
return (
<Screen style={styles.container}>
<Text>View</Text>
<StatusBar style="auto" />
</Screen>
);
};
const styles = StyleSheet.create({});
export default ModuleViewScreen;
-17
View File
@@ -1,17 +0,0 @@
export default function view() {
return (
<View style={styles.container}>
<Text>activity 1 complete on week 1 yay!</Text>
<StatusBar style="auto" />
</View>
);
}
const styles = StyleSheet.create({
container: {
flex: 1,
backgroundColor: "#fff",
alignItems: "center",
justifyContent: "center",
},
});