UWP best way to use x:Bind and filter ObservableCollection

Question

I have an UWP application.

One view with a pivot control.

One associated ViewModel.

One model like this :

class Model
{
    public int Category { get; set; }
}

In the ViewModel, there is an ObservableCollection of model "model" like :

public ObservableCollection<Model> models = new ObservableCollection<Model>();

I want to display models in the pivot controls with each model by category in pivotitem. For example, PivotItem 1 will countain all models with category 1, PivotItem 2 will countain all models with category 2, etc...

a solution would be to create new ObservableCollection for each models filtered by category but this solution remains a little heavy in my opinion. To do for example :

public ObservableCollection<Model> modelCategory1 = models.Where(x => x.category == 1) [...]

That's why I was wondering if there was not a solution directly from XAML to filter.

EDIT:

In he view, in Pivot, i have 5 pivotitems each containing one ListView

<Pivot>
    <PivotItem>
        <ListView ItemsSource="{x:Bind ViewModel.Models}" />
    </PivotItem>
    <PivotItem>
        <ListView ItemsSource="{x:Bind ViewModel.Models}" />
    </PivotItem>
    <PivotItem>
        <ListView ItemsSource="{x:Bind ViewModel.Models}" />
    </PivotItem>
    <PivotItem>
        <ListView ItemsSource="{x:Bind ViewModel.Models}" />
    </PivotItem>
    <PivotItem>
        <ListView ItemsSource="{x:Bind ViewModel.Models}" />
    </PivotItem>
</Pivot>

EDIT 2 :

According to this Can I filter a collection from xaml? and this : [UWP]CollectionViewSource Filter? i can't filter from a CollectionViewSource from UWP, so i guess i have to create new ObservableCollection that will contains Filter result like :

private ObservableCollection<Model> _modelsCategory1; 
public ObservableCollection<Model> ModelsCategory1
{ 
    get { return _modelsCategory1; } 
    set { _modelsCategory1= value; NotifyPropertyChanged(); 
}

and :

var cat1 = from fobjs in Models 
         where fobjs.Category == 1 
         select fobjs;
ModelsCategory1  = new ObservableCollection<Model>(cat1);

If you are using data binding, you will need another property in your Model class for your pivot header to bind to. — Monish Koyott, Dec 13 '17 at 14:11

score 0 · Answer 1 · edited Dec 13 '17 at 14:27

0

Do this in your existing code to bind the Category property to the ListViewItem,

<PivotItem>
    <ListView ItemsSource="{x:Bind ViewModel.Models}">
        <ListView.ItemTemplate>
            <DataTemplate x:DataType="data:Model">
                <TextBlock Text="{x:Bind Category}"/>
            </DataTemplate>
        </ListView.ItemTemplate>
    </ListView>
</PivotItem>

edited Dec 13 '17 at 14:27

Vijay Nirmal

5,239
4
26
59

answered Dec 13 '17 at 14:25

Monish Koyott

374
1
4
20

this will display all categories in my list, my problem is to display members in ViewModel.Models depending of the category in each PivotItem : the first PivotItem will display only models that match "ViewModel.Models where category == 1", the second PivotItem will display only models that match "ViewModel.Models where category == 2", etc... – ArthurCPPCLI Dec 13 '17 at 14:55

UWP best way to use x:Bind and filter ObservableCollection

1 Answers1