react-native-table-component freeze first column & first row in scrollable table

Desired State

I'm using react-native-table-component, a basic component to render tables in React Native. I need to freeze the first column and first row in the table so they remain in view when scrolling. Specifically, I need the first column to remain fixed when scrolling horizontally and scroll with the rest of the data in the row when scrolling vertically.

I need the first row to function the same way. Remain fixed when scrolling vertically and when scrolling horizontally, I should scroll with the corresponding column.

Issue

I can get to my desired state for the first row but I can't do the same for the first column in the same table.

Code

render(){
    return(

    <View style={styles.tableContainer}>
    <ScrollView horizontal={true}>
     <View>
       <Table style={styles.tableHead}>

         <Row
          style={styles.header}
          textStyle={styles.text}
          data={this.props.tableHead}
          widthArr={this.props.columnWidth}
        />

       </Table>
       <ScrollView style={styles.dataWrapper}>

        <TableWrapper style={styles.tableBody}>
          <Col 
            style={styles.title} 
            textStyle={styles.text}
            data={this.props.tableTitle} 
            heightArr={[28,28]}  
        />
          <Rows 
            style={styles.row} 
            textStyle={styles.text}
            data={this.dataFormat()} 
            widthArr={this.props.columnWidth} 

            />
        </TableWrapper>
       </ScrollView>
     </View>
   </ScrollView>
  </View>
    )
}

Additional Information I don't need to use react-native-table-component but I'd like to if possible since I've already done a lot of work to style it and format the data I've inserted.

Thanks in advance for your help!