1.0.3 • Published 3 years ago
react-native-list-sort v1.0.3
react-native-list-sort
Simple, light-weight and smooth sortable list for react-native apps (compatible for Expo)
Getting started
npm install react-native-list-sort
Usage
import List from 'react-native-list-sort';
return (
<List
items={originalList}
renderItem={renderItem}
itemHeight={ITEM_HEIGHT} // <----- MUST MATCH THE ITEM'S STYLE HEIGHT
onOrderChange={onOrderChange}
/>
);
Examples
API
Property | Type | Required | Default |
---|---|---|---|
items | Array | yes | - |
renderItem | () => JSX.Element | yes | - |
itemHeight | Number | yes | - |
onOrderChange | (sortedList: Array) => void | yes | - |
dragableAreaSize | number | no | itemHeight |
style | style | no | - |
contentContainerStyle | style | no | - |
* dragableAreaSize enables the capability to make only part of the item draggable (default to the left part of item)
NOTE
This package uses react-native-reanimated (version 2) and react-native-gesture-handler.In case you do not have these pacakges installed please see and follow the Softare-Mansion docs:
react-native-reanimated react-native-gesture-handler
Inspiration
William Candillon - Chrome Drag-to-Sort - “Can it be done in React Native?” - season 4
License
This project is licensed under the MIT License