Különbségek

A kiválasztott változat és az aktuális verzió közötti különbségek a következők.

--- oktatas:telefon:react_native:navigacio:react_navigation [2024/01/21 13:23] – [Native Stack telepítés] admin
+++ oktatas:telefon:react_native:navigacio:react_navigation [2024/01/21 13:41] (aktuális) – eltávolítva admin
@@ Sor 1: / Sor 1: @@
-[[oktatas:telefon:react_native:navigacio|< Navigáció]]
-====== Expo - React Navigation ======
-  * **Szerző:** Sallai András
-  * Copyright (c) 2024, Sallai András
-  * Licenc: [[https://creativecommons.org/licenses/by-sa/4.0/|CC Attribution-Share Alike 4.0 International]]
-  * Web: https://szit.hu
-===== Native Stack =====
-==== Projekt létrehozása ====
-  npx create-expo-app app01
-  cd app01
-  npx expo install react-dom react-native-web @expo/webpack-config
-==== Probléma fixálása ====
-<code javascript app.sjon>
-{
-  "expo": {
-    "web": {
-      "bundler": "metro"
-    }
-  }
-}
-</code>
-  npx expo install @expo/metro-runtime
-==== Native Stack telepítés ====
-  npm install @react-navigation/native-stack
-==== Minőségbiztosítás példa ====
-<code javascript App.js>
-import { Button, View, Text } from 'react-native';
-import { NavigationContainer } from '@react-navigation/native';
-import { createNativeStackNavigator } from '@react-navigation/native-stack';
-function HomeScreen({ navigation }) {
-  return (
-    <View style={{ flex: 1, alignItems: 'center', justifyContent: 'center' }}>
-      <Text>Minőség</Text>
-      <Button
-        title="Kezdés"
-        onPress={() => navigation.navigate('Subject')}
-      />
-    </View>
-  );
-}
-function SubjectScreen({ navigation }) {
-  return (
-    <View style={{ flex: 1, alignItems: 'center', justifyContent: 'center' }}>
-      <Button
-        title="Tanárok"
-        onPress={() => navigation.navigate('Teacher')}
-      />
-      <Button title="Vissza" onPress={() => navigation.goBack()} />
-    </View>
-  );
-}
-function TeacherScreen({ navigation }) {
-  return (
-    <View style={{ flex: 1, alignItems: 'center', justifyContent: 'center' }}>
-      <Button
-        title="Kérdések"
-        onPress={() => navigation.navigate('Questions')}
-      />
-      <Button title="Vissza" onPress={() => navigation.goBack()} />
-    </View>
-  );
-}
-function QuestionsScreen({ navigation }) {
-  return (
-    <View style={{ flex: 1, alignItems: 'center', justifyContent: 'center' }}>
-      <Button title="Vissza" onPress={() => navigation.goBack()} />
-    </View>
-  );
-}
-const Stack = createNativeStackNavigator();
-function QualityStack() {
-  return (
-    <Stack.Navigator>
-      <Stack.Screen name="Home" component={HomeScreen} />
-      <Stack.Screen name="Teacher" component={TeacherScreen} />
-      <Stack.Screen name="Subject" component={SubjectScreen} />
-      <Stack.Screen name="Questions" component={QuestionsScreen} />
-    </Stack.Navigator>
-  );
-}
-export default function App() {
-  return (
-    <NavigationContainer>
-      <QualityStack />
-    </NavigationContainer>
-  );
-}
-</code>