Xamarin.Forms : Get tapped item in List-view for Xamarin forms

List-view support selected item and taped item event, but what about double tapped swipe etc.

Let's do some code


  1.  We need Data Model Class for binding listview
  2.  public class Item  
       {  
         public int id { get;set; }  
         public string Name { get; set; }  
         public decimal Rate { get; set; }  
       }  
       public class ItemRepo  
       {  
         public ItemRepo()  
         {  
           CreateItem();  
         }  
          public ObservableCollection<Item> Items { get; set; }  
         public void CreateItem()  
         {  
           Items = new ObservableCollection<Item>();  
           Items.Add(new Item() {id=1, Name = "A-104",Rate = 50 });  
           Items.Add(new Item() {id=2, Name = "B-104", Rate = 55 });  
           Items.Add(new Item() {id=3, Name = "B-806", Rate = 70 });  
           Items.Add(new Item() {id=4, Name = "B-107", Rate = 95 });  
           Items.Add(new Item() {id=5, Name = "A-105", Rate = 80 });  
           Items.Add(new Item() {id=6, Name = "A-106", Rate = 72 });  
           Items.Add(new Item() {id=7, Name = "C-188", Rate = 32 });  
           Items.Add(new Item() {id=8, Name = "C-194", Rate = 58 });  
           Items.Add(new Item() {id=9, Name = "D-897", Rate = 88 });  
           Items.Add(new Item() {id=10, Name = "D-968", Rate = 60 });  
         }  
       }  
    
  3. We use view-cell to generate gestures because other cell doesn't support it.but technically view-cell also doesn't support this. so we will put stack-layout into view-cell. and we write gestures for stack-layout (you can use any layout).Let's create list-view page. 
  • XAML
  •  <ContentPage.Content>  
         <StackLayout VerticalOptions="FillAndExpand" HorizontalOptions="FillAndExpand">  
            <ListView x:Name="ItemList">  
             <ListView.ItemTemplate>  
               <DataTemplate>  
                 <ViewCell >  
                   <StackLayout VerticalOptions="FillAndExpand" HorizontalOptions="FillAndExpand" >  
                     <StackLayout.GestureRecognizers >  
                     <TapGestureRecognizer NumberOfTapsRequired="2" Tapped="TapGestureRecognizer_Tapped" CommandParameter="{Binding id}" />  
                     </StackLayout.GestureRecognizers>  
                     <Label x:Name="lblName" Text="{Binding Name}"  />  
                   </StackLayout>  
                 </ViewCell>  
               </DataTemplate>  
               </ListView.ItemTemplate>  
           </ListView>  
         </StackLayout>  
       </ContentPage.Content>  
    
  • C#
  •  public partial class MainPage : ContentPage  
       {  
         ItemRepo ItemRepo = null;  
          public MainPage()  
         {  
           InitializeComponent();  
           ItemRepo = new ItemRepo();  
           ItemList.ItemsSource = ItemRepo.Items;  
         }  
          private void TapGestureRecognizer_Tapped(object sender, EventArgs e)  
         {  
           Item SelectedItem = ItemRepo.Items.FirstOrDefault(itm => itm.id == Convert.ToInt32(((TappedEventArgs)e).Parameter.ToString()));  
           if (SelectedItem != null)  
           {  
             DisplayAlert("Alert", "Name : " +SelectedItem.Name + " , Rate : " + SelectedItem.Rate, "OK");  
           }  
         }  
       }  
    




it ( try , code , like , comment , share)

Comments