Последний элемент ScrollView перемещается вверх, когда один из элементов над ним удален - PullRequest
Новая
       47

Последний элемент ScrollView перемещается вверх, когда один из элементов над ним удален

0 голосов
/ 13 сентября 2018

В ScrollView у меня есть список элементов (высота элемента = 60 пикселей).
Я реализовал пролистывание для удаления (анимируя marginBottom элемента от 0 до -60).
Все круто

Однако у меня возникает проблема рендеринга, когда ScrollView прокручивается до самого нижнего .

enter image description here

Expectation:

  • Прокрутка до самого низа
  • Удалить элемент (скажем, предыдущий)
  • Ожидайте увидеть все элементы выше все это спустится вниз, чтобы заполнить пустой пробел. Последний элемент не должен двигаться.

Reality:

  • Прокрутка до самого дна
  • Удалить элемент (скажем, предыдущий)
  • Все элементы выше все это перемещаются, чтобы заполнить пустой пробел , но так же, как и последний, в результате чего сразу после него образуется небольшое пустое пространство. Обратите внимание, что макет исправлен (это небольшое пустое пространство исчезает), как только я пытаюсь прокрутить.

Код ScrollView: 

_deleteContact(contactId: number) {
    Animated.timing(this.state['marginBottom' + contractId], {toValue: -60}).start();
}

_renderRows = () => {
    return this.state.contacts.map(contact => (
        <Animated.View key={contact.id} style={{flex: 1, flexDirection: 'row', marginBottom: this.state['marginBottom' + contact.id]}}>
            <ContactComponent contact={contact} onDelete={() => this._deleteContact(contact.id)}/>
        </Animated.View>
    ));
};

render() {
    return (
        <ScrollView styles={{flex: 1}}>
            {this._renderRows()}
        </ScrollView>
    )
}
...