UWP Gridview Binding to ObservableCollection and clearing values

问题

so I am creating a GridView in a UWP app which is bound to an ObservableCollection.

XAML:

<Page.Resources>
    <CollectionViewSource
            x:Name="ListSource"
            Source="{x:Bind model.ShowList}"
            IsSourceGrouped="false"
            />
</Page.Resources>
...
<Page>
    <GridView x:Name="lvListSource" ItemsSource="{Binding Source={StaticResource ListSource}}" SelectedIndex="-1" Grid.Row="2" HorizontalContentAlignment="Center" SelectionChanged="lvEpisodeListSource_SelectionChanged">
                <GridView.ItemTemplate>
                    <DataTemplate x:DataType="local:PageInput">
                        <TextBlock Name="AlbumBlock" Foreground="Black" FontWeight="Normal" FontSize="15" Margin="5,0,5,0"
                                    Text="{x:Bind Name}" HorizontalAlignment="Left" VerticalAlignment="Center" Width="100"/>
                    </DataTemplate>
                </GridView.ItemTemplate>
            </GridView>
</page>

C#:

public MainCategoryModel model;
public MainPage()
{
    model = new MainCategoryModel();
    this.InitializeComponent();
}

protected override void OnNavigatedTo(NavigationEventArgs e)
{
    //initialize model data in code and stuff comes out correctly
    //model.Clear() give unknown error here
    model.Add(new PageInput() {...});
    lvListSource.ItemsSource = model.myList;
}

public class MainCategoryModel
{
    public ObservableCollection<PageInput> myList { get; set; }

    public MainCategoryModel()
    {
        myList = new ObservableCollection<PageInput>();
    }

    public void AddShow(PageInput show)
    {
        myList.Insert(0, show);
    }

    public void Clear()
    {
        myList.Clear();
    }
}

The ObservableCollection initializes properly and the page loads perfectly fine when I only add items to the collection. The problem is, I would like to update this ObservableCollection the GridView is bound to every time the OnNavigatedTo function is called. This includes removing items from the collection. Every time I either remove items or try to Clear the ObservableCollection the page fails to load with an unknown error. Is there a way to modify and remove values from an Observable Collection that is already bound to?

As a side problem, If I don't re-set the ItemsSource property at the end of OnNavigatedTo, the SelectionChanged event is called immediately after adding values to the Collection since it is set in XAML. Is there a way to have the SelectionChanged event not call when items are added to a GridView?

回答1:

x:Bind is OneTime by default, you need to set it Mode=OneWay to get the layout updates

   protected override void OnNavigatedTo(NavigationEventArgs e)
   {
       //initialize model data in code and stuff comes out correctly

      lvEpisodeListSource.ItemsSource = model.myList;
   }

kills your binding, update model.myList and let the binding do the job, don't set ItemsSource from code this way if you want it to be binded

edit:

copied and run your code (which wasn't pleasant experience because you didn't make it clean) and I don't undersand why there is such mess with the Binding and x:Bind in your code, why don't you just bind the collection like that?

<GridView x:Name="lvListSource" ItemsSource="{x:Bind model.myList, Mode=OneWay}" ....

edit2:

my code:

public class MainCategoryModel
{
    public ObservableCollection<PageInput> myList { get; set; }

    public MainCategoryModel()
    {
        myList = new ObservableCollection<PageInput>();
    }

    public void AddShow(PageInput show)
    {
        myList.Insert(0, show);
    }

    public void Clear()
    {
        myList.Clear();
    }
}

<Page>
(........)
    <GridView x:Name="lvListSource" ItemsSource="{x:Bind model.myList, Mode=OneWay}" SelectedIndex="-1" Grid.Row="2" HorizontalContentAlignment="Center">
    <GridView.ItemTemplate>
        <DataTemplate x:DataType="local:PageInput">
            <TextBlock Name="AlbumBlock" Foreground="Black" FontWeight="Normal" FontSize="15" Margin="5,0,5,0"
                                Text="{x:Bind Name}" HorizontalAlignment="Left" VerticalAlignment="Center" Width="100"/>
        </DataTemplate>
    </GridView.ItemTemplate>
</GridView>

public sealed partial class MainPage : Page
{
    public MainCategoryModel model;
    public MainPage()
    {
        model = new MainCategoryModel();
        this.InitializeComponent();
    }

    protected override void OnNavigatedTo(NavigationEventArgs e)
    {
        model.Clear();
        model.myList.Add(new PageInput() {Name = "testName"});
    }

}

and made by quess:

public class PageInput
{
    public string Name { get; set; }
}

try to run and check it

回答2:

Clearing a data object object that XAML code is bound to gives Unknown error when Page caching is turned on. Disabling page caching allows you to clear objects correctly.

this.NavigationCacheMode = NavigationCacheMode.Disabled;

Here's an example that's already in the community

来源：https://stackoverflow.com/questions/41022646/uwp-gridview-binding-to-observablecollection-and-clearing-values

标签

gridview

uwp