Wrong drag offset after changing ListHeaderComponent's height

"react-native": "0.61.5",
"react-native-draggable-flatlist": "2.1.2"

<DraggableFlatList
   //... 
   ListHeaderComponent={this.props.HeaderComponent}
   ListHeaderComponentStyle={styles.header}
   //...
/>

const styles = StyleSheet.create({
   header: {
      paddingTop: 72,
      paddingHorizontal: '13%',
      marginBottom: 36,
   },
   //...
});

HeaderComponent is a some view. After some async actions (~3 sec after did mount) HeaderComponent’s height will be changed. DraggableFlatList will get wrong offset while any element is dragging (wrong hovering position), so looks like it’s not recalculated.

Any suggestions?

[computerjazz]

yep, whenever layoutInvalidationKey changes all items and offsets will be remeasured.

[computerjazz]

Thanks for the example, I see the issue now. You can invalidate current measurements by setting a new key, so in this case you can force a recalculation by updating your keyExtractor with visible – something like:

keyExtractor={(item, index) => `draggable-item-${item.key}-${this.state.visible}`}

https://snack.expo.io/@computerjazz/swipetodelete-pkg-header-resize-bug