ionic-team / ionic-v3

The repo for Ionic 3.x. For the latest version of Ionic, please see https://github.com/ionic-team/ionic
Other
128 stars 85 forks source link

bug: Dragging when Reordering doesn't auto-scroll down #237

Open ionitron-bot[bot] opened 5 years ago

ionitron-bot[bot] commented 5 years ago

Original issue by @juanitotaveras on 2017-08-28T16:00:46Z

Type: bug

Ionic Version: 3.x

Platform: mobile webview

Expected Behavior: When I need to drag an item to the end of the list, which goes below the viewing area, the page should scroll down so I can find the position in the list where I want to place my item. Similarly, the screen should scroll up if I want to drag the item to a position above the viewing area.

Actual Behavior: The screen does not scroll down upon nearing the edge of the screen with the item you are dragging. The screen scrolls up when nearing the top edge if you are not already at the top of the list, but it scrolls all the way to the top and does not let you insert an element into the middle of the list.

Attempted Fix: I have attempted to install the Dragula module, but it does not have an autoscroll implementation. I attempted using dom-autoscroller to remedy this, but I was not able to get it to scroll the window. I then wrote a function that drags the item if it's at the edge of the screen (detected using Dragula's method .out()) and the object position is at the bottom half of the screen. It looks fine on my computer, but not good on touchscreen devices. It registers a regular scroll up as if you're trying to move your item, and it's not easy to add a delay to register the drag. This behavior was exhibited on two touchscreen devices.

Suggested Fix: The already included Reorder feature does what I want it to do except for autoscrolling. I have looked at the sourcecode on GitHub and can see that some sort of scrolling is implemented in ionic/src/components/item/item-reorder-gesture.ts, but have not figured out how to modify it yet.

The current scrolling needs to be modified so it can call a setInterval when the top or bottom edge is detected to scroll up or down around 3% of the screen and continue to do so while the dragged item is still on the edge and we're not at the perimeter of the content area.

Sahil624 commented 5 years ago

Any fix or workaround for this issue. I don't want to upgrade app to v4 as it might break things and we don't have much time. :(

ihorbond commented 2 years ago

was this ever fixed ? running into the same problem

jsBiztech commented 2 years ago

is there any update on this issue @mlynch @manucorporat ?

shrihans commented 2 years ago

I am also looking for the solution of this issue. Please update if there is any solution.

muhammad-gul-dm commented 2 years ago

I have a big list and an item from the bottom I want to put it at first so that list should auto-scroll.