Search code examples
xamarin.formssyncfusion

Xamarin forms SFListview multiselect issue


Iam using syncfusion SFListview in my xamarin forms app. I implemented multiselect of listview cell from https://help.syncfusion.com/xamarin/sflistview/selection?cs-save-lang=1&cs-lang=xaml.It works fine.But the problem iam facing is everytime we need to hold the itemcell for selection. Is it possible for multiselect that hold only for first cell and tap for all other cell?


Solution

  • Is it possible for multiselect that hold only for first cell and tap for all other cell?

    Sure can do that.If you want multiselect items,I guess that next steps will do some tasks about multiselect items.The picture below may look like the one you want.

    You can look at the content of this chapter in the share link, and the sample code it provides.

    Solution One:(Generally acceptable)

    If the project doesn't mind adding a control button outside, then this will be the quickest and easiest way.That is to add a ToolbarItems in the NavigationPage, use it to control whether you can click multiple selections without jumping to the next page.

    Add ToolbarItems :

    <ContentPage.ToolbarItems>
            <ToolbarItem x:Name="ToolbarItemsButton" Text="MultipleSelect" Clicked="Edit_Clicked"/>
    </ContentPage.ToolbarItems>
    
    <sync:SfListView x:Name="listView"
                     SelectionGesture="Hold"
                     SelectionMode="Multiple"
                     ItemTapped="ListView_ItemTapped"
                     SelectionBackgroundColor="Transparent"
                     IsStickyHeader="True" ItemSize="70">
     ...
    

    In ContentPage ,add Flag to judge SelectionMode of ListView.

    int flag = 0;
    
    private void Edit_Clicked(object sender, EventArgs e)
    {
        if(0 == flag)
        {
            listView.SelectionGesture = TouchGesture.Tap;
            ToolbarItemsButton.Text = "Done";
            flag = 1;
        }
        else
        {
            ToolbarItemsButton.Text = "MultipleSelect";
            listView.SelectionGesture = TouchGesture.Hold;
            flag = 0;
        }
    }
    

    Can judge when you can switch to the next page.

    private void ListView_ItemTapped(object sender, Syncfusion.ListView.XForms.ItemTappedEventArgs e)
    {
    
        if(0 == flag)
        {
            Navigation.PushAsync(new ContentPage());
        }
    
    }
    

    enter image description here enter image description here

    Solution Two:(Recommended)

    SfListView has a method is ItemHolding.Not using another button also can exchange the SelectionMode.

    Xaml code different is adding this method of SfListView.

    <sync:SfListView x:Name="listView"
                         SelectionGesture="Hold"
                         SelectionMode="Multiple"
                         ItemTapped="ListView_ItemTapped"
                         SelectionBackgroundColor="Transparent"
                         ItemHolding="ListView_ItemHolding" // ItemHolding
                         IsStickyHeader="True" ItemSize="70">
    

    When OnHolding can do something here:

    private void ListView_ItemHolding(object sender, ItemHoldingEventArgs e)
    {
        if (0 == flag)
        {
            listView.SelectionGesture = TouchGesture.Tap;
            ToolbarItemsButton.Text = "Done";
            flag = 1;
        }
        else
        {
            listView.SelectionGesture = TouchGesture.Hold;
            ToolbarItemsButton.Text = "MultipleSelect";
            flag = 0;
        }
    }
    

    Judge when you can switch to the next page.

    private void ListView_ItemTapped(object sender, Syncfusion.ListView.XForms.ItemTappedEventArgs e)
    {
    
        if(0 == flag)
        {
            Navigation.PushAsync(new ContentPage());
        }
    
    }
    

    Solution Three:(Not recommended here)

    Generally, for the multiple selection of the cell of the listview, we will process the template of the custom cell, such as adding a button in the template. When clicking, the item can be marked as selected, and the UI of the item can also be customized as The style when selected.