deanmcpherson / react-native-sortable-listview

Drag drop capable wrapper of ListView for React Native
MIT License
917 stars 235 forks source link

Gaps/wrong item being hidden when drag-and-hold beyond the end of list when scrolling #135

Open chtrinh opened 6 years ago

chtrinh commented 6 years ago

This might be related to what is seen in #73.

Steps to reproduce:

  1. Drags and holds the active item beyond the end of the list.
  2. This should activate the scroll animation. (bug will only appear when items force a scroll)
  3. Item is still held and moved back up to the viewable list.
  4. Gaps and/or "off-by-one" error with the wrong item being hidden.

Reason: When the item is drag at the end of the list, the scrollView height has been changed. The rows underneath now have one less item to account for the total height (it is set to 0.01). checkTargetElement is using the old cached height value causing the "gap" to occur.

solution: When scroll is activated and the content size has changed force a 'scrollTo' new height, so that checkTargetElement can used the new values.

  handleContentSizeChange = (width, height) => {
    this.scrollContainerHeight = height;

    if (this.scrollValue > 0) {
      this.scrollTo({ y: height, animated: !this.props.disableAnimatedScrolling });
    }
  };