We use cookies to give you the best experience on our website. If you continue to browse, then you agree to our privacy policy and cookie policy. (Last updated on: June 24, 2019).
Unfortunately, activation email could not send to your email. Please try again.
Syncfusion Feedback

Drag and drop

Thread ID:

Created:

Updated:

Platform:

Replies:

143454 Mar 20,2019 05:05 PM UTC Apr 15,2019 12:06 PM UTC Xamarin.Forms 9
loading
Tags: SfCarousel
Jonasz Makulak
Asked On March 20, 2019 05:28 PM UTC

Hi,

I'm working on something similar to KanbanBoard.
I have SfCarousel, and inside it I've got SfListView.
Is there any possibility to move element from one ListView to another?

Maybe there are other controls thac can I use to achive my goal? (No, SfKanban is not answer) ;)

Dhanasekar R [Syncfusion]
Replied On March 26, 2019 05:16 AM UTC

Hi Jonasz, 
 
Greetings from Syncfusion. 
 
As per the current implementation of SfCarousel, we don’t have support to drag and drop the any element from one view to another view. We will validate the possibilities with SfListView control and let you know. 
 
Regards, 
Dhanasekar 


Deivaselvan Y [Syncfusion]
Replied On March 26, 2019 12:47 PM UTC

Hi Jonasz,  
  
Currently, SfListView does not have support for drag and drop an item from one listview to another. We have already considered it as an feature and added it into our feature request list. You can track the progress of the reported feature from the below link.     
     

Note: The date for implementation of requested feature is tentative and it will be included in any of our upcoming release.  
  
  
We would like to let you know that you can achieve your requirement in the sample level using the ItemDragging event of the listview. Based on the bounds value of the listview you can remove and add the dragging item from one collection to another.  
  
Code Example XAML:  
<ContentPage>  
    <Grid>  
        <syncfusion:SfListView x:Name="ToDoListView"  
                               ItemsSource="{Binding ToDoList}"  
                               DragStartMode="OnHold,OnDragIndicator">  
        </syncfusion:SfListView>  
        <syncfusion:SfListView x:Name="WorkDoneListView"  
                               ItemsSource="{Binding NewList}"  
                               DragStartMode="OnHold,OnDragIndicator">  
        </syncfusion:SfListView>  
    </Grid>  
</ContentPage>  
  
C#:  
private async void WorkDoneListView_ItemDragging(object sender, ItemDraggingEventArgs e)  
{  
    var position = new Point();  
    var xPosition = e.Position.X;  
    double yPosition = e.Position.Y;  
    position.X = xPosition;  
    position.Y = yPosition;  
    if (e.Action == DragAction.Dragging)  
    {  
        if (this.ToDoListView.Bounds.Contains(position))  
            this.ToDoListView.BackgroundColor = Color.Red;  
        else  
            this.ToDoListView.BackgroundColor = Color.White;  
    }  
    if (e.Action == DragAction.Drop)  
    {  
        if (this.ToDoListView.Bounds.Contains(position))  
        {  
            var item = e.ItemData as ToDoItem;  
            await Task.Delay(100);  
            viewModel.NewList.Remove(item);  
            viewModel.ToDoList.Add(item);  
            item.IsDone = false;  
        }  
        this.ToDoListView.BackgroundColor = Color.White;  
    }  
}  
  
private async void ToDoListView_ItemDragging(object sender, ItemDraggingEventArgs e)  
{  
    var position = new Point();  
    var xPosition = e.Position.X;  
    double yPosition = e.Position.Y;  
    position.X = xPosition;  
    position.Y = yPosition;  
  
    if (e.Action == DragAction.Dragging)  
    {  
        if (this.WorkDoneListView.Bounds.Contains(position))  
            this.WorkDoneListView.BackgroundColor = Color.Red;  
        else  
            this.WorkDoneListView.BackgroundColor = Color.White;  
    }  
    if (e.Action == DragAction.Drop)  
    {  
        if (this.WorkDoneListView.Bounds.Contains(position))  
        {  
            var item = e.ItemData as ToDoItem;  
            await Task.Delay(100);  
            viewModel.ToDoList.Remove(item);  
            viewModel.NewList.Add(item);  
            item.IsDone = true;  
        }  
        this.WorkDoneListView.BackgroundColor = Color.White;  
    }  
}  
  
Please find the sample from the below link.  
  
  
Note: ListViewItem is added in the container so item does not come out from it.  
  
Regards,  
Deivaselvan 


Jonasz Makulak
Replied On April 3, 2019 05:17 PM UTC

Is there any possibility to make selected item follow user finger?
In ListView area it is nice, and item follows finger, but when user moves finger over the source list view it is not. 

Dinesh Babu Yadav [Syncfusion]
Replied On April 4, 2019 12:17 PM UTC

Hi Jonasz, 
 
Query 1: Selected Item should follow user finger 
 
We would like to let you know that the Drag and Drop action in SfListView would be performed based on the gestures position only and it is irrespective of item. So, we regret to let you know that you could not able to move the selected item when touch finger is in other position. 
 
Query 2: Item is not visible when it is dragged into another listview. 
 
 By default, SfListView does not support to drag and drop the item between two listview. However, to achieve the requirement, we customized the listview at the sample level by removing the item from one listview and added into the another listview based on the touch position and did manual calculation accordingly. So, it behaves as like the reported which we have already updated in the previous update. 
 
Regards, 
Dinesh Babu Yadav  


Jonasz Makulak
Replied On April 5, 2019 03:28 PM UTC

Thank You for answer, I've got one more problem.

I've got SfListView inside SfCarousel. When I'm trying to drag item (only reorder, I'm not trying to move from one list to another) Sfcarousel returns to its first state - for example, when I want to reorder items from 3rd column SfCarousel always back to 1st column.

Do You have solution for this?

Gnana Priya Namasivayam [Syncfusion]
Replied On April 8, 2019 05:51 PM UTC

Hi Jonasz, 

We are currently checking on the reported query from our side. We will validate and provide further details on or before April 10, 2019. We will appreciate your patience until then. 

Regards, 
Gnana Priya N 


Gnana Priya Namasivayam [Syncfusion]
Replied On April 10, 2019 01:00 PM UTC

Hi Jonasz, 
  
Thanks for your patience. 
We have checked the reported query with Sflistview inside sfcarousel page from our side. While drag and drop, items didn’t seem to re-order as mentioned in tested sample. Meanwhile, can you please explain your use case in detail to analyze better and provide appropriate solution at our end. We have attached the tested sample form your reference, please refer the sample form below. 


Can you please check with the above sample whether you are getting the reported issue in our sample also. If not, please revert us back with the issue reproducible sample so that we could able to analyzed your query better. 

Regards, 
Gnana Priya N 


Jonasz Makulak
Replied On April 10, 2019 02:49 PM UTC

I'm sorry, I forgot to say, that it is necessary to set ViewMode="Linear".



Muneesh Kumar G [Syncfusion]
Replied On April 15, 2019 12:06 PM UTC

Hi Jonasz, 
 
Thanks for your update,  
 
We have checked modified the sample with SfTabView Control to achieve your requirement with ViewMode as Linear. Please have the sample from the below link, 
 
 
Please check with the sample and let us know if you have any concern. 
 
Thanks, 
Muneesh Kumar G. 


CONFIRMATION

This post will be permanently deleted. Are you sure you want to continue?

Sorry, An error occured while processing your request. Please try again later.

Please sign in to access our forum

This page will automatically be redirected to the sign-in page in 10 seconds.

Warning Icon You are using an outdated version of Internet Explorer that may not display all features of this and other websites. Upgrade to Internet Explorer 8 or newer for a better experience.Close Icon

Live Chat Icon For mobile
Live Chat Icon