react native - get visible text on screen

i am trying to create a book page layout where i have buttons for next and previous page.

For that i need to know how many words does the page fits, to know which text to show on the next page. or, what text is visible on the page to know what to put in next page. any idea how to do that ? or different ideas ?

tried to search for event in the scroll view , to know when its scrollable , but couldn't tried to check text component , but it didn't help.

page structure:

<View style={styles.fullWidth}>
    <TopBar backEvent={onBackClickLocal} />
    {/* <ScrollView> */}
      <Text style={styles.bookText}>
        {exampleText}
      </Text>
    {/* </ScrollView> */}
    <View style={styles.pageArrowsSection}>
      <TouchableOpacity style={styles.previousPageArrowContainer} >
        <Ionicons name="arrow-back" size={32} color="green" />
      </TouchableOpacity>
      <View style={styles.bookPageNumber}>
        <Text>
          2/50
        </Text>
      </View>
      <TouchableOpacity style={styles.nextPageArrowContainer}>
        <Ionicons name="arrow-forward" size={32} color="green" />
      </TouchableOpacity>
    </View>
  </View> 

any idea ?

thnx alot