FILTERING SFLISTVIEW USING MVVM PATTERN

[Bamame]

Hi,
Do you have a sample project showing how to filter an SFListView using MVVM pattern. The page will have a SearchBar which will determine the filter criteria. I saw an example in your documentation but it wasn't using MVVM.
Thanks.

[Dinesh Babu Yadav]

Hi Bamame, 

 

Thanks for contacting Syncfusion support.  

  

We have prepared sample using SfListView with filtering in MVVM pattern and attached the sample in following link. Please find the sample for your reference.  

  

Sample: http://www.syncfusion.com/downloads/support/forum/144704/ze/Filtering-1307017618  

  

To know more about filtering, please refer our UG documentation.  

  

UG Link: https://help.syncfusion.com/xamarin/sflistview/filtering    

 

Please let us know if you require further assistance. 

 

Regards, 

Dinesh Babu Yadav 

[Bamame]

Thanks Dinesh for the sample project. I saw the UG link but that wasn't what I was looking for. I will go through the project and let you know if I have any questions.

Thanks again!

[Dinesh Babu Yadav]

Hi Bamame, 

 

Thanks for the update. We will wait to hear from you. 

 

Regards, 

Dinesh Babu Yadav 

[Paul Parkins]

Whilst this might work it's not a great example of MVVM code as the OnTextChanged implementation within the view model, relies on the specific view you have provided, which is not good MVVM practise. It expects the sender to be a grid, and to find the first child to be a searchbar., and the second child to be the list.

In my case I programmatically know what I want the filter to be, but need some way of setting the Datasource.Filter and triggering RefreshFilter ideally via binding to the view model, rather than the view model (or code behind) code using direct access of the view's listview.

It seems that although Datasource can be referenced in the xaml view, Datasource.Filter cannot.

[Lakshmi Natarajan]

Hi Paul, 

 

Thank you for using Syncfusion products. 

 

We have checked the reported query “Filter items using MVVM” from our side. We would like to inform you that you can achieve your requirement using MVVM, by binding the SfListView.DataSource property. Please refer to the following code snippets for more reference, 

 

ViewModel: Create DataSource property in the ViewModel and add filter predicate in the FilterCommand execute method. 

public class SortingFilteringViewModel : INotifyPropertyChanged 

{ 

    private string searchText = null; 

 

    public ObservableCollection<TaskInfo> Items { get; set; } 

    public Command<object> FilterCommand { get; set; } 

    public DataSource FilterDataSource { get; set; } 

         

    public SortingFilteringViewModel() 

    { 

        FilterCommand = new Command<object>(OnTextChanged); 

        FilterDataSource = new DataSource(); 

        FilterDataSource.Source = Items; 

 

        AddItemDetails(); 

    } 

 

    private void OnTextChanged(object obj) 

    { 

        searchText = obj as string; 

 

        if (FilterDataSource != null) 

        { 

            FilterDataSource.Filter = FilterContacts; 

            FilterDataSource.RefreshFilter(); 

        } 

    } 

 

    private bool FilterContacts(object obj) 

    { 

        var taskInfo = obj as TaskInfo; 

        return (taskInfo.Title.ToLower().Contains(searchText.ToLower()) 

            || taskInfo.Description.ToLower().Contains(searchText.ToLower())); 

    } 

} 

 

 

XAML: Bind the ViewModel DataSource property to the SfListView.DataSource property. 

<sync:SfListView x:Name="listView" 

                ItemsSource="{Binding Items}"  

                DataSource="{Binding FilterDataSource}" 

                Grid.Row="1" 

                SelectionMode="None" 

                ItemSpacing="0,5,0,5" 

                BackgroundColor="#F0F0F0" 

                ItemSize="120"> 

 

 

We have prepared a filter sample using MVVM and attached in the following link, 

Sample: https://www.syncfusion.com/downloads/support/directtrac/general/ze/144704-868704341 

 

Also, you can achieve the requirement using Behavior. Please refer to our documentation regarding the same, 

KB link: https://www.syncfusion.com/kb/11478/how-to-filter-xamarin-forms-listview-sflistview-using-mvvm 

 

Please let us know if you need further assistance. 

 

Regards, 

Lakshmi Natarajan