How do I style my json data on screen in form of table?

I have a screen where my data is displayed. I want to display in the form of table (The data at the bottom of screen)as shown below in screenshot.

Right now my screen looks like:

I want it to look like this:

The data next to the close, high etc is some json data that I fetched from api.

My class:

let movie = ( <View  style={styles.bottomdata}><Text style={styles.text} key={item.name}>      {item.name}</Text><Text style={styles.text} key={item.open}>      OPEN {item.open}</Text><Text style={styles.text} key={item.close}>      CLOSE{item.close}</Text><Text style={styles.text} key={item.volumes}>      VOLUME{item.volumes}</Text><Text style={styles.text} key={item.low}>     LOW {item.low}</Text><Text style={styles.text} key={item.high}>      HIGH{item.high}</Text></View>)  return (<TouchableWithoutFeedback onPress={Keyboard.dismiss}><View style={styles.container}><View>{movie}</View></View></TouchableWithoutFeedback>   );}const styles = StyleSheet.create({  text: {    color: "black",    backgroundColor: "white",  },  bottomdata:  {      marginTop:400,      backgroundColor:"black",  }});

The movie is the data displayed on the screen. How do I design it like that? And, at the top it is just the symbol name (same as at the bottom) and close and high values. How can I design my screen like that? I am able to fetch the data but not sure how to design it like that.