Weird Behavior of Draggable Flatlist

[taatiq882]

code:

const dataArray = [{key:0, num:0,  backgroundColor:"green"}, {key:1, num:1,  backgroundColor:"yellow"},{key:2, item:2, backgroundColor:"blue"}];
const [data, setData] = useState(dataArray);


  const renderItem1 = ({item,drag,isActive}) =>{ 
    return(
        <TouchableOpacity
          key={item.key}
      
          onLongPress={drag}
          disabled={isActive}
          style={{height:50, backgroundColor:item.backgroundColor}}
        >
          <Text style={styles.text}>{item.key}</Text>
        </TouchableOpacity>
    );
  }

        <DraggableFlatList 
        data={data}
        renderItem={renderItem1}
        keyExtractor={(item)=>{
          item.key}}
        onDragEnd={({data})=>{
            setData(data)
        }}/>

https://user-images.githubusercontent.com/30371302/170826841-7c323247-97b2-475b-bf9c-82953cee4b64.MP4

Platform & Dependencies

• react-native-draggable-flatlist version:
• Platform:
• React Native or Expo version: 0.67.3
• Reanimated version: 2.6.0
• React Native Gesture Handler version: 2.3.2

[haveneersrobin]

Seems like you are missing some parts of your code? Is it wrapped in a ScrollView or another FlatList maybe ?