Xamarin Forms ListView Checkmark

Question

I'm trying to implement a ListView in Xamarin Forms. A list that we can check or choose the item that we want. I want a single item selection at a time.

My xaml file :

ListView x:Name="listview" ItemSelected="OnItemSelected" >
        <ListView.ItemTemplate>
            <DataTemplate>
                <ViewCell>
                    <StackLayout HorizontalOptions="StartAndExpand" Orientation="Horizontal">
                        <StackLayout Padding="20,0,0,0"  VerticalOptions="Center"  Orientation="Vertical">
                            <Label Text="{Binding .}" YAlign="Center" FontSize="Medium"   />
                        </StackLayout>
                    </StackLayout>
                </ViewCell>
            </DataTemplate>
        </ListView.ItemTemplate>
    </ListView>

My xaml.cs file :

    public void OnItemSelected (object sender, SelectedItemChangedEventArgs e) {
        if (e.SelectedItem == null) return; 

        // add the checkmark in the event because the item was clicked
       // be able to check the item here

        DisplayAlert("Tapped", e.SelectedItem + " row was tapped", "OK");
        ((ListView)sender).SelectedItem = null;
    }

There is a better way to do it?

I want something like this without alphabet and search menu :

score 2 · Answer 1 · answered Jun 07 '16 at 15:47

2

Take a look on this https://github.com/ricardoromo/Listview-Multiselect, I made this sample to simulate miltiselect listview.

answered Jun 07 '16 at 15:47

Ricardo Romo

1,588
12
25

score 0 · Accepted Answer · answered Jul 30 '15 at 17:18

0

You could try using XLabs checkbox or radioButton control, Here is a list of controls examples, you just need to download the package via NuGet Manager.

If you only need to check 1 item, in your tapped event make an action after item is tapped. Here's an example:

        async void FriendListView_ItemTapped(object sender, ItemTappedEventArgs e)
        {           
            var el = e.Item as ProfileItem;
            SelectedItem = el;
            if (e.Item != null)
            {
               await Navigation.PushAsync(new FriendProfile(el));
            }
            ((ListView)sender).SelectedItem = null; // de-select the row
        }

answered Jul 30 '15 at 17:18

Ingenator

222
3
9

I will accept this solution because I know that it work but I do it in an other way. – davidlebr1 Jul 31 '15 at 13:37
Would you mind posting your solution? I'm trying to solve the same problem. Thanks! I don't want to use a checkbox control because for this application, the checkbox should be completely invisible if it is not checked. – Karen Cate Sep 21 '15 at 23:09
Hi @KarenCate I don't have a solution in code. You could try using a ObservableCollection and a TwoWay bindable properties so when you tap an item in the ListView you change the state lets say bool isSelected = true/false. The part that will not be easy without custom renderer is the selected state of the viewCell like its background or something. – Ingenator Sep 24 '15 at 17:39
@karenCate you could find this usefull http://forums.xamarin.com/discussion/17885/multiselect-listviews#latest – Ingenator Sep 24 '15 at 17:48
Thanks Ingenator. I did eventually get it working. The big piece I was missing was implementing OnPropertyChanged. I was thinking that the ObservableList handled changes to the data so that when I changed an element of that list, it would propagate the changes to the screen.That's only partially true. If I were to add/subtract items from the list, those changes would be handled. However, it doesn't "observe" changes inside the items themselves. This post is helpful: http://stackoverflow.com/questions/25004275/how-do-you-do-proper-binding-and-updating-of-xamarin-forms-listview – Karen Cate Sep 28 '15 at 22:26

score 0 · Answer 3 · answered Mar 17 '18 at 20:19

I've tried the Multiselection listview in xamarin forms and I got it working for both iOS and Android.

This took me some time so I wrote a blog about the entire prototype. You can find it here :

http://androidwithashray.blogspot.com/2018/03/multiselect-list-view-using-xamarin.html

The blog gives you full info on creating the Listview with the checkbox and selecting multiple items. Hope this helps!!

Xamarin Forms ListView Checkmark

3 Answers3