Added TicTacToe

App.js

@@ -26,6 +26,10 @@ import MovieFinder from './src/screens/MovieFinder/MovieFinder';
 import HexColorGeneratorScreen from "./src/screens/HexColorGenerator/HexColorGeneratorScreen";
 import QRCodeGenerator from "./src/screens/QRGenerator/QRGenerator";
 import RecipeFinder from "./src/screens/RecipeFinder/RecipeFinder";
+import TicTacToe from "./src/screens/TicTacToe/TicTacToe";
+import Icons from "./src/screens/TicTacToe/components/Icons";
+
+
 export default function App() {
   const Stack = createNativeStackNavigator();
   return (
@@ -101,6 +105,11 @@ export default function App() {
           component={RecipeFinder}
           options={{headerShown: false }}
         />
+        <Stack.Screen
+          name="Tic Tac Toe"
+          component={TicTacToe}
+          options={{ headerShown: true, animation: "slide_from_right" }}
+        />
       </Stack.Navigator>
     </NavigationContainer>
   );

README.md

@@ -32,11 +32,14 @@
     </tr>
 <tr>
     <th>QR Scanner</th>
-    <th>QR Generator</th></tr>
+    <th>QR Generator</th>
+    <th>Tic Tac Toe</th>
+    </tr>
   <tr>
     <tr>
     <td><img src="./output/qr_scanner.jpg" width=250></td>
     <td><img src="./output/qr_generator.jpg" width=250></td>
+    <td><img src="./output/TicTacToe.jpg" width=250></td>
   </tr>
 </table>
 

package.json

@@ -25,12 +25,14 @@
     "react-native": "0.72.10",
     "react-native-fast-image": "^8.6.3",
     "react-native-gesture-handler": "~2.12.0",
+    "react-native-paper": "^5.12.3",
     "react-native-qrcode-svg": "^6.3.1",
     "react-native-reanimated": "~3.3.0",
     "react-native-safe-area-context": "4.6.3",
     "react-native-screens": "~3.22.0",
     "react-native-svg": "^15.3.0",
     "react-native-toast-message": "^2.2.0",
+    "react-native-vector-icons": "^10.1.0",
     "react-native-view-shot": "^3.8.0"
   },
   "devDependencies": {

src/screens/Home/home.js

@@ -135,6 +135,15 @@ export default function Home() {
             >
               Recipe Finder
             </Text>
+            <Text
+              style={styles.button}
+              onPress={() => {
+                console.log("Button to Tic-Tac-Toe List is Pressed!");
+                navigation.navigate("Tic Tac Toe");
+              }}
+            >
+              Tic Tac Toe
+            </Text>
           </Pressable>
         </View>
       </View>