Disabling Scrolling in Listview and Improving the Touch and Swap Between Two List Items

I'm making for the improvement of item swapping for the list view. You see, when I long-pressed that list item and using the scrollToItem(sectionIndex, itemIndex) to mangae swapping while scrolling whenever I go up or down. The problem is that the scrollToItem function has a delay until after I scrolled for 1 or 2 seconds via touch-move event. I'm resolving this kind of hiccup on how to change the direction of scrolling first before taking actions on swapping two items efficiently. Here's what I'm planning to do.

First, the following name of list items are from RESERVE 1 to RESERVE 26. They're all in exact order. Now, I'm planning to switch places between two indexes in a listview, let's say RESERVE 25 on below and RESERVE 26 on top like this:

Before swapping list item index...

• RESERVE 24
• RESERVE 25
• RESERVE 26

After swapping list item index...

• RESERVE 24
• RESERVE 26
• RESERVE 25

I decided to use a method to temporarily stop scrolling so that the scrolling direction will be according on what item from list view is dragging. There is the property or method for listview called canScroll but will only work on iPhone. Do you know how to fix it or there is an alternate reference for the Android?

Here's the first step on how to switch between two items in the listview. I created the function for the onLongpress element under the ListView tag.

/**
 * When user touch-hold an index item from the list section, it designates
 * the starting point for touching, dragging, and swapping item index. 
 */
function startSwapping(e) {
    // Initialize list item's content and info.
    console.log("Swapping start!");
    Alloy.Globals.list.setSeparatorColor('#005fff');
    item = e.itemIndex;
 
    // Settings for List Item's Properties.
    var it = $.location_section.getItemAt(item);  // --> Also "Alloy.Globals.section" since I set it to static anyways.
    it.properties.backgroundColor = '#0000EE';
    $.location_section.updateItemAt(item, it);
 
    // Enable swapping when the user successfully long-pressed an item.
    isSwapping = true;
 
    // Set starting swap index to be scrolled.
    Alloy.Globals.list.scrollToItem(0, item); // --> Also, this is used to change the scroll direction gesture according to that item you're holding while swapping.
}

Next, when the condition is passed for the onTouchmove event via element itself from the ListView tag, it will compute for the dragging the list item while changing the up-down direction of scrolling where the user will scroll up when his/her finger lifts up while swapping during the list item swapping state and vice versa.

/**
 * Button event function for item swapping. When touch-hold and drag, item
 * will be rearranged or re-sorting in new order. 
 */
function itemDrag(e) {
    if(isSwapping) {
        if(t > 1000) { // --> I use the timer condition to reduce sensitivity of swapping. I set it for 1 sec per item swap.
            // Set the background color of the list item for indications first.
            var it = $.location_section.getItemAt(item);
            it.properties.backgroundColor = '#005FFF';
 
            // Updating list item changes.
            $.location_section.updateItemAt(item, it); // --> Also "Alloy.Globals.section" since I set it to static anyways.
        }
 
        // Check direction of dragging on listview.
        if(e.y < y) {
            console.log("Dragging Up from " + y + ". Dragging is " + $.location_list_view.touchEnabled);
            swapUp();
        } else if(e.y > y) {
            console.log("Dragging Down from " + y + ". Dragging is " + $.location_list_view.touchEnabled);
            swapDown();
        }
 
        // Update direcction changes.
        Alloy.Globals.list.scrollToItem(0, item);
        y = e.y;
    } else {
        console.log("Swapping not available. Dragging is " + $.location_list_view.touchEnabled);
    }
}

Here's how the process on swapping item index.

//----------[ List Item Index Functions ]----------
 
/**
 * Sorting a specified list item index downward. 
 */
function swapDown() {
    if(y >= 0) {
        // Calculate sorting by obtaining first the list item to be relocated and set as a variable.
        if(t > 1000) {
            var n = Alloy.Globals.section.getItemAt(item); // --> Next index to be moved for the the current item's content.
            var p = Alloy.Globals.section.getItemAt(item + 1); // --> Previous index to be relocated for the item's content to be swapped.
            Alloy.Globals.section.updateItemAt(item + 1, n);
            Alloy.Globals.section.updateItemAt(item, p);
        }
 
        // Check if a sorting index has reach at the end.
        if((item < Alloy.Globals.section.getItems().length - 1) && (t > 1000)) {
            item++;
            t = 0;
        } else {
            t += 100;
        }
 
            // Scroll down to the current item moved.
            // Alloy.Globals.list.scrollToItem(0, item);
    }
}
 
/**
 * Sorting a specified list item index upward. 
 */
function swapUp() {
    if(y >= 0) {
        // Calculate sorting by obtaining first the list item to be relocated and set as a variable.
        if(t > 1000) {
            var n = Alloy.Globals.section.getItemAt(item); // --> Next index to be moved for the the current item's content.
            var p = Alloy.Globals.section.getItemAt(item - 1); // --> Previous index to be relocated for the item's content to be swapped.
            Alloy.Globals.section.updateItemAt(item - 1, n);
            Alloy.Globals.section.updateItemAt(item, p);
        }
 
        // Check if a sorting index has reach at the start. 
        if((item > 0) && (t > 1000)) {
            item--;
            t = 0;
        } else {
            t += 100;
        }
 
            // Scroll up to the current item moved.
            // Alloy.Globals.list.scrollToItem(0, item);
    }
}

Lastly, this swapping ends when the user lifts his/her finger:

/**
 * Swapping of index will be ended when a user lifts a finger. 
 */
function endSwapping(e) {
    // Display status.
    console.log("Swapping ended!");
 
    // Reset Y-coordinate for scrolling.
    y = 0;
 
    // Update list item when user ended scrolling.
    var it = $.location_section.getItemAt(item);
    it.properties.backgroundColor = 'black';
    it.properties.color = 'white';
    $.location_section.updateItemAt(item, it);
 
    // Disable swapping when finished.
    isSwapping = false;
}

These above code worked with some minor problems:

• The list item scrolls relatively instead by following from a finger when a user touch and hold an item while swapping, expecting for an effective hovering smoothly.
• I decided or looking for a solution to create a code for Android to temporarily stop scrolling of the listview due to this bug that instead for a scroll motion for swapping, when a user will scroll up if touch-dragging upward for example, it will use the normal scroll direction that normally used in devices that the user will scroll up when the finger drags downward that lasts for a delay of 1 1/2 second when keep on scrolling.
• Once done swapping for a long time, the process of swapping is still computing and moving itself even when the finger lifted up after!

Is there something needed to make item swapping gets smoother and is there something needed to recommend to fix these problems?