Как создать список Dragabble в React Native?

В моем собственном приложении для реакции с expo у меня есть задача включить переупорядочивание элементов в списке (путем перетаскивания / перемещения). Я попробовал с помощью "React Native Draggable FlatList"("https://www.npmjs.com/package/response-native-draggable-flatlist"), и я получил список, но он не перетаскивается, т.е. я не мог изменить положение каждого элемента в списке. Тот же код, который я скопировал. Мой код:

list.js

   import React, { Component } from "react";
   import { View, TouchableOpacity, Text } from "react-native";
   import DraggableFlatList from "react-native-draggable-flatlist";

   const exampleData = [...Array(20)].map((d, index) => ({
         key: `item-${index}`, // For example only -- don't use index as your key!
         label: index,
         backgroundColor: `rgb(${Math.floor(Math.random() * 255)}, ${index *
    5}, ${132})`
   }));

  class Example extends Component {
  state = {
  data: exampleData
  };

  renderItem = ({ item, index, drag, isActive }) => {
  return (
  <TouchableOpacity
    style={{
      height: 100,
      backgroundColor: isActive ? "blue" : item.backgroundColor,
      alignItems: "center",
      justifyContent: "center"
    }}
    onLongPress={drag}
  >
    <Text
      style={{
        fontWeight: "bold",
        color: "white",
        fontSize: 32
      }}
    >
      {item.label}
    </Text>
  </TouchableOpacity>
);
};

render() {
return (
  <View style={{ flex: 1 }}>
    <DraggableFlatList
      data={this.state.data}
      renderItem={this.renderItem}
      keyExtractor={(item, index) => `draggable-item-${item.key}`}
      onDragEnd={({ data }) => this.setState({ data })}
    />
  </View>
  );
  }
  }

  export default Example;

и пользовательский интерфейс такой:

Прокручивается весь список, но каждый элемент нельзя перетащить. Как сделать этот список перетаскиваемым? Любая помощь?

0 ответов