title: How to navigate to the next screen on TouchableOpacity click
body: <p>I'm making an app, I've still only made the splash screen. But, I want to know how to navigate to the next screen on a touchable opacity click. I don't want to navigate by creating a specific function for the pages. I want to navigate by importing the page.</p>
  <p>I have shown my code below.</p>
  <pre><code>import React from 'react';
  import { Image, StyleSheet, TouchableOpacity, Text, View } from 'react-native';
  
  import { AppLoading } from 'expo';
  import { useFonts } from 'expo-font';
  
  const src2 = {
    uri: &quot;https://o.remove.bg/downloads/e6dc1218-7a94-4c86-a3b9-6baed9ee6c63/images-removebg-preview.png&quot;
  }
  
  const src = {
    uri: &quot;https://o.remove.bg/downloads/7ce84ac7-f275-434c-a294-11a8b2e56e2b/pngtree-halo-victory-light-effect-png-image_1727940-removebg-preview.png&quot;
  }
  
  function Levels({ navigation }) {
    return (
      &lt;levels /&gt;
    );
  }
  
  export default props =&gt; {
      
    let [fontsLoaded] = useFonts({
      'Sketch 3D': 'https://dafonttop.com/wp-data/s/870/1870/file/sketch-3d.regular.otf',
    });
    if (!fontsLoaded) {
      return &lt;AppLoading /&gt;;
    } else {
      return (
        &lt;View style={styles.container}&gt;
          &lt;Text style={styles.title}&gt;My app&lt;/Text&gt;
          &lt;TouchableOpacity style={styles.button}&gt;
            &lt;Text style={styles.buttonText}&gt;Start&lt;/Text&gt;
          &lt;/TouchableOpacity&gt;
        &lt;/View&gt;
      );
    }
  };
  
  const styles =  StyleSheet.create({
    container: {
      flex: 1,
      backgroundColor: &quot;#CFA240&quot;,
      alignItems: &quot;center&quot;,
      justifyContent: &quot;center&quot;,
    },
    title: {
      fontFamily: &quot;Sketch 3D&quot;,
      fontSize: 50,
      color: &quot;#fff&quot;,
      position: &quot;absolute&quot;,
      top: 150
    },
    glow: {
      position: &quot;absolute&quot;,
      top: 45,
      left: 20,
      width: 200,
      height: 200,
    },
    mop: {
      top: 45,
      left: 10,
      height: 225,
      width: 225,
    }, 
    images: {
      position: &quot;absolute&quot;,
      top: 220,
    },
    button: {
      position: &quot;absolute&quot;,
      bottom: 150,
      padding: 15,
      borderRadius: 16,
      borderColor: &quot;#fff&quot;,
      borderWidth: 2,
      backgroundColor: &quot;#CFA240&quot;,
      borderStyle: &quot;dashed&quot;,
      elevation: 10,
    },
    buttonText: {
      fontFamily: &quot;Sketch 3D&quot;,
      color: &quot;#fff&quot;,
      fontSize: 25,
    }
  })
  
  </code></pre>
  <p>PS I have to go to the next screen by importing the file</p>
  <p>Thank you.</p>