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. Image for the cookie policy date

SfListView - Scroll to last item added - MVVM

Is it possible to automatically scroll to the last item added to a listview in a mvvm setup? My requirement is to make sure that the last item added in my vertical listview is always visible. Behavior?

3 Replies

GP Gnana Priya Namasivayam Syncfusion Team March 6, 2019 12:19 PM UTC

Hi Øystein, 
Thanks for using Syncfusion product. 
We have checked the reported query from our side. We would like to let you know that you can scroll the listview to newly added item in MVVM pattern as mentioned below. We have prepared the sample based on your requirement, please find the sample from below. 
   <Button Text="Add Item" Command="{Binding TapCommand}" CommandParameter="{x:Reference listView}"/> 
public class ContactsViewModel : INotifyPropertyChanged 
  public Command<object> TapCommand { get; set; } 
  public ContactsViewModel() 
    contactsinfo = new ObservableCollection<Contacts>(); 
    TapCommand = new Command<object>(OnTapped); 
   private void OnTapped(object obj) 
     listView = obj as SfListView; 
     Contacts newContact = new Contacts(); 
     newContact.ContactName = "Jonas"; 
     int newIndex = listView.DataSource.DisplayItems.IndexOf(newContact); 
     listView.LayoutManager.ScrollToRowIndex(newIndex, true); 
Please let us know whether sample meets your requirement. 
Gnana Priya N 

ØG Øystein Günther March 6, 2019 02:18 PM UTC

Hi Gnana,

Thank you so much for providing a sample on how to accomplish this. 
What actually did the trick was your: listView.LayoutManager.ScrollToRowIndex(newIndex, true); 
As opposed to what I had: listView.ScrollTo(<object>, Syncfusion.ListView.XForms.ScrollToPosition.MakeVisible, true); 

However, your sample is based on sending a reference of the ListView into the ViewModel. Wouldn't you say that this violates the MVVM pattern?
In my opinion a ViewModel should never access a UI element.

Not quite sure about how to go about it, but what I had in mind was a View with two ListViews, let's say A and B.
ListView A is on the left side and serves as kind of like "select an object from the list". When the user selects an object from list A, I was thinking that this would trigger a "ListViewA_ItemTapped" event in a connected behavior. This event would then execute a command in the ViewModel that adds the object to list B. When that task is complete, the "behavior" event would then perform the ScrollToRowIndex() method on B, in order to always have the last item added visible. Your thoughts?

SP Subburaj Pandian Veluchamy Syncfusion Team March 7, 2019 10:08 AM UTC

Hi Øystein,  
Thank you for the update. 
We would like to let you know that you cannot pass the ItemIndex as a parameter to ScrollTo method, inorder to pass the added item index you can use ScrollToRowIndex method which scrolls the view to added item. Meanwhile, If you have any issue to use listview in ViewModel then you can also write `Behavior` for listview to achieve your requirement as you mentioned.  
Please find the sample in which we have added items and accessed listview in Behavior class, attached sample for your reference. 
To know more about difference between ScrollTo and ScrollToRowIndex method, you can refer the following user guide documentation link. 
Please let us know, if you have any query. 
Subburaj Pandian V

Live Chat Icon For mobile
Up arrow icon