React Native Sortable Grid

screenshot of React Native Sortable Grid

Drag-drop-sortable grid view for react native

Overview:

The react-native-sortable-grid is a package that allows for the creation of draggable grids in React Native applications. It provides features for users to arrange items within the grid, adjust grid styling, and handle item interactions effortlessly.

Features:

  • Custom Styles: Override or complement the native style of the sortable grid by providing custom styles.
  • Flexible Grid Height: Adjust the grid's height dynamically as rows become empty or fill up based on content.
  • Prevent Dragging Outside Grid: Users are restricted from dragging items outside the grid for a more controlled interaction.
  • Block Transition Duration: Set the duration for the transition of a passive block when the active block takes its place.
  • Items Per Row: Define the number of items to be placed on a single row in the grid.
  • Drag Activation Threshold: Specify the time duration a user must hold a block before it becomes active for dragging.
  • Delete Mode Functionality: Enable item deletion mode and define callback functions for drag and item deletion events.

Summary:

The react-native-sortable-grid package provides a convenient solution for implementing draggable grids in React Native applications. With features like custom styling, flexible grid height adjustment, and drag activation thresholds, developers can create interactive and user-friendly grid layouts. Additionally, the package offers functionalities for smooth item transitions, defining items per row, and managing delete mode within the grid. Whether it's arranging content or handling item interactions, the react-native-sortable-grid simplifies the process of creating dynamic grid components.