Search code examples
listviewxamarin.formsexpandablelistviewlistviewitem

Add checkmark image on ItemSelected - ListView - Xamarin Forms


I would like to add a checkmark image when an item is selected .see below

enter image description here

I tried forcing the IsChecked to true , just to see the img . but nothing seems to work

xaml

                <ListView x:Name="EmployeeView" ItemSelected="EmployeeView_ItemTapped"
            ItemsSource="{Binding Employees}">
    <ListView.ItemTemplate>
      <DataTemplate>
           <ViewCell>
          <StackLayout>
       <Image Source="calendar" IsVisible="{Binding IsChecked}"/>
       <Label Text="{Binding name}" />

           </StackLayout>
                </ViewCell>
      </DataTemplate>
    </ListView.ItemTemplate>
  </ListView>

C#

 ObservableCollection<Employee> employees = new ObservableCollection<Employee>();
 public ObservableCollection<Employee> Employees { get { return employees; } }

EmployeeView.ItemsSource = employees;

            // ObservableCollection allows items to be added after ItemsSource
            // is set and the UI will react to changes
            employees.Add(new Employee { name = "Rob Finnerty" });
            employees.Add(new Employee { name = "Bill Wrestler" });
            employees.Add(new Employee { name = "Dr. Geri-Beth Hooper" });
            employees.Add(new Employee { name = "Dr. Keith Joyce-Purdy" });
            employees.Add(new Employee { name = "Sheri Spruce" });
            employees.Add(new Employee { name = "Burt Indybrick" , IsChecked=true });




void EmployeeView_ItemTapped(object sender, Xamarin.Forms.SelectedItemChangedEventArgs e)
        {
            if (e.SelectedItem != null)
            {
                var index = (Employee)e.SelectedItem;
                index.IsChecked = true;
            }

Solution

  • if every image is the same, just hardcode the source instead of binding it. Instead, bind the IsVisible property

    <Image Source="checkmark.png" IsVisible="{Binding IsChecked}" x:Name="tickimage">
    

    then in the handler (be sure your model implements INotifyPropertyChanged)

    void Handle_ItemSelected(object sender, Xamarin.Forms.SelectedItemChangedEventArgs e){
    
      if (e.SelectedItem != null)
      {
        var index = (ImagesModel)e.SelectedItem;
        index.IsChecked = true;
      }
    }