Accessibility issue: Voice over read out order for flatlist is incorrect

Voice over read out for Items which are rendered using flatlist is not in right order. issue can be reproduced only in IOS and in android it works fine. I have multiple interactive elements within column. imagine columns containing favorite icon, image, multiline text and add button. Expected behavior: it should first read out rollback icon, image, multiline text and add button from column 1 and then the same from 2nd column. Actual behavior: currently it is reading following order rollback icon (column 1 ) --> rollback icon (column 2) --> image (column 1 ) --> image(column 2)---> multiline text (column 1 ) --> multiline text(column 2) --> add button(column 1) --> add button(column 2)

import React from 'react';
import {
  StyleSheet,
  View,
  Text,
    Image,
    TouchableOpacity,
    SafeAreaView,
    FlatList,
    Dimensions,
} from 'react-native';

    const data = [
        { key: 'Apple', price:'$1.91 each' },
        { key: 'Organic Bananas, bunch', price:'$2.91/LB' },
        { key: 'Banana Babies', price:'$2.91 avg price' },
        { key: 'meat',price:'$20.91' },
        { key: 'Eggs' , price:'$12.91 avg price'},
        { key: 'Fish' , price:'$7.91 avg price'},
        { key: 'Green Apples', price:'$9.91 avg price' },
        { key: 'fresh fruits', price:'$6.91 avg price'},
        { key: 'Ice cream', price:'$2.91 avg price' }
    ];

    const numColumns=2;
class App extends React.Component{
    renderItem=({item,index})=>{
        return(
            <View style={styles.item}>
                <TouchableOpacity
                    style={styles.button}
                    onPress={this.onPress}
                     accessible={false}
                >
                    <Text style={styles.itemText1}>Rollback</Text>
                </TouchableOpacity>
                <View accessible={true}
                      accessibilityLabel="This is Demo Image">
                    <Image
                        style={{width: 75, height: 75}}
                        source={{uri: 'https://reactnative.dev/img/tiny_logo.png'}}/>
                </View>

                <Text  style={styles.itemText}>{item.key}</Text>
                <TouchableOpacity>
                    <Text style = {styles.button}>
                        ADD
                    </Text>
                </TouchableOpacity>
                <Text style={styles.itemText}>{item.price}</Text>
            </View>
        )
    };
    render(){
        return(
            <SafeAreaView style={styles.container1}>
            <FlatList
                data={data}
                style={styles.container}
                renderItem={this.renderItem}
                numColumns={numColumns}
            />
            </SafeAreaView>
        );
    }
}

const styles = StyleSheet.create({
  container: {
      flex:1,
      marginVertical:20,
  },
    container1: {
        flex: 1,
    },
  item: {
      backgroundColor:"grey",
      alignItems:'center',
      justifyContent:'center',
      flex:1,
      margin:1,
      height:Dimensions.get('window').width/numColumns,
  },
  itemText: {
    color:'#fff',
      paddingTop:5,
  },
    itemText1: {
       flexDirection:'row',
        color:'red',
        paddingBottom:4,
        justifyContent:'flex-end'
    },
    imageThumbnail: {
        justifyContent: 'center',
        alignItems: 'center',
        height: 100,
    },
    button: {
        backgroundColor: '#DDDDDD',
        margin:4
    },
});

export default App;