Swipe the List Item off the List

[infrastructure Team]

Hi

Am not sure if you've used the Outlook app but it does a nice job of swiping emails to then allow them to be deleted (or archived).

Whilst we've implemented this functionality to some degree, the Outlook app does a good job in that once you've swiped X amount of pixels the list then auto continues the swipe until the item is moved off the edge of the screen and then removed from the list.

Is there a way we can implement this functionality using the SfListView?

Thanks

[Jayaleshwari N]

Hi Damien,  

  

Thanks for using Syncfusion products.  

  

We have checked the reported query “Want to swipe like Outlook” from our end. We have prepared the sample to achieve your requirement. To swipe an item indefinitely, you need to set the SwipeOffset property by considering the width/height of the SfListView with Orientation accordingly as like following code example.  

  

Code Example[C#]:  

  

ListView.PropertyChanged += ListView_PropertyChanged;  

  

private void ListView_PropertyChanged(object sender, System.ComponentModel.PropertyChangedEventArgs e)  

    {  

        if (e.PropertyName == "Width" && ListView.Orientation == Orientation.Vertical && ListView.SwipeOffset != ListView.Width)  

            ListView.SwipeOffset = ListView.Width;  

        else if (e.PropertyName == "Height" && ListView.Orientation == Orientation.Horizontal && ListView.SwipeOffset != ListView.Height)  

            ListView.SwipeOffset = ListView.Height;  

    }  

  

You can layout the swiping item to the whole width of the listview for right and left direction in the SwipeEnded event using SwipeOffset argument in theSwipeEndedEventArgs as like following code example.  

  

ListView.SwipeEnded += ListView_SwipeEnded;  

  

private void ListView_SwipeEnded(object sender, SwipeEndedEventArgs e)  

{  

    SwipingViewModel.ItemIndex = e.ItemIndex;  

  

    if (e.SwipeDirection == Syncfusion.ListView.XForms.SwipeDirection.Right)  

    {  

        e.SwipeOffset = ListView.Width;  

        Device.BeginInvokeOnMainThread(async () =>  

        {  

            await Task.Delay(500);  

            SwipingViewModel.InboxInfo.Remove(e.ItemData as ListViewInboxInfo);  

        });  

    }  

    else if (e.SwipeDirection == Syncfusion.ListView.XForms.SwipeDirection.Left)  

    {  

        e.SwipeOffset = ListView.Width;  

        Device.BeginInvokeOnMainThread(async () =>  

        {  

            await Task.Delay(500);  

            SwipingViewModel.InboxInfo.Remove(e.ItemData as ListViewInboxInfo);  

        });  

    }  

}  

  

For your reference we have attached the sample and you can download it form the below link.  

  

Sample: http://www.syncfusion.com/downloads/support/forum/141074/ze/ListViewsample213256711   

  

Regards,  

Jayaleshwari N 

[infrastructure Team]

This works great!

Thanks a lot for your help. I really appreciate it.

Damien

[Jayaleshwari N]

Hi Damien, 

 

Thanks for the update. Please get in touch if you would require further assistance. 

 

Regards, 

Jayaleshwari N.