how to access function name in react native

I'm not sure what you mean "without inserting the TrackScreen into the bottom button", if you mean without adding it to the components of the navigator you can just add it like it's a normal component like this, notice the component after the TouchableOpacity:

import React, { Component } from 'react';
import { StyleSheet, Text, View,  TextInput, TouchableOpacity, Image, ImageBackground, Alert} from 'react-native';import { Button } from 'react-native-elements';
import { Icon, Input } from 'react-native-elements'
import { NavigationContainer } from '@react-navigation/native';
import { createBottomTabNavigator } from '@react-navigation/bottom-tabs';
import { createNativeStackNavigator } from '@react-navigation/native-stack';
import Track from './src/component/Track';
const styles = require('./assets/css/style'); 
function TrackScreen({ navigation }){ 
return ( 
<View style={{ flex: 1, justifyContent: 'center', alignItems: 'center' }}>
<Text>Page Track</Text>    
</View>
);
}
function HomeScreen({navigation}) {
return ( 
<View style={styles.container}>
<ImageBackground source={require('./assets/images/bg/489.jpg')} resizeMode="cover" style={{flex:1,justifyContent:'center'}}>

      <TouchableOpacity onPress={()=>{ navigation.navigate('Track')}} style={{position:'absolute',top:20,left:20}}>
        <View style={{padding:10,backgroundColor:'#0da3aa',borderRadius:20}}>
          <Image style={{resizeMode:'contain',width:50,height:50}} source={require('./assets/images/trackicon.png')} />          
        </View>
        <Text style={{textAlign:'center',fontWeight:'bold',fontSize:18}}>Track</Text>
      </TouchableOpacity>
      <TrackScreen />
    </ImageBackground>
  </View> 
  );
}