react-native-drag-sort

Drag and drop sort control for react-native.

react-native-drag-sort

Installation

yarn add react-native-drag-sort
or
npm i react-native-drag-sort --save

Example

<DragSortableView
    dataSource={this.state.data}
    parentWidth={parentWidth}
    childrenWidth= {childrenWidth}
    childrenHeight={childrenHeight}
    marginChildrenTop={marginChildrenTop}
    onDataChange = {(data)=>{
        // delete or add data to refresh
        if (data.length != this.state.data.length) {
            this.setState({
                data: data
            })
        }
    }}
    onClickItem={(data,item,index)=>{}}
    renderItem={(item,index)=>{
        return this.renderItem(item,index)
    }}/>

API

  • dataSource: PropTypes.array.isRequired :

  • parentWidth: PropTypes.number //parent width

  • childrenHeight: PropTypes.number.isRequired, //Each item height

  • childrenWidth: PropTypes.number.isRequired,//Each item width

  • marginChildrenTop: PropTypes.number, //So the item's outermost view adds margin, you can only use this method.

  • marginChildrenBottom: PropTypes.number,

  • marginChildrenLeft : PropTypes.number,

  • marginChildrenRight : PropTypes.number,

  • sortable: PropTypes.bool, //Do not allow dragging

  • onClickItem: PropTypes.func, //click

  • onDragStart: PropTypes.func,

  • onDragEnd : PropTypes.func,

  • onDataChange : PropTypes.func, //This method is called every time the data changes.

  • renderItem : PropTypes.func.isRequired, //render item view

GitHub