将新项目添加到 ObservableCollection 后，ListView 不会立即更新

Question

I am learning Xamarin.Forms and I have created a new project with Visual Studio 2019, using the Master-Detail project template. I am using UWP (as I want to make a Windows 10 app).

Why does the list view not show up immediately after I add the new item? Is this caused by slowness in the event/message passing, or is there an animation that is slowing it down on purpose?

In this sample, everything is happening in a local ObservableCollection , and there are only a few items in it, so I expect it to be able to display the change immediately.

Example:

The code is generated by Visual Studio, I can provide it, but I haven't really made any change.

EDIT: Since I suspect this is related to the events generated by the ObservableCollection and the bindings in the ListView, I tried the following change, which worked:

MessagingCenter.Subscribe<NewItemPage, Item>(this, "AddItem", async (obj, item) =>
{
    var newItem = item as Item;
    Items.Add(newItem);
    await DataStore.AddItemAsync(newItem);
});

To:

MessagingCenter.Subscribe<NewItemPage, Item>(this, "AddItem", async (obj, item) =>
{
    var newItem = item as Item;
    var tmp = new ObservableCollection<Item>();
    foreach (var i in Items)
    {
        tmp.Add(i);
    }
    tmp.Add(newItem);
    Items = tmp;
    OnPropertyChanged(nameof(Items));
    await DataStore.AddItemAsync(newItem);
});

Of course, this is inefficient and not ideal but might help someone else figure out what is going on in the original version. Behaviour after the change:

Answer 1

In UWP the views for the navigation back stack are not kept in memory to conserve it, so when you navigate to another page and back, the previous page is reconstructed. In this case however, the reason why it "fades" in is animation, that is built into the default NavigationPageRenderer in UWP.

The animation is occurring here in the code , it should be possible to disable the animation by setting the isAnimated flag to false on the right place, but I don't have my dev device with me right now so I can't test it.

Update

It seems that this is really a problem with the UWP implementation of either ListView or MasterDetailPage .

Workaround

Adding a small delay to the message handler subscription fixes the issue:

MessagingCenter.Subscribe<NewItemPage, Item>(this, "AddItem", async (obj, item) =>
{
    await Task.Delay(100);
    var newItem = item as Item;
    Items.Add(newItem);
    await DataStore.AddItemAsync(newItem);
});

I have reported the problem on GitHub as an issue .

Answer 2

If you are really using Xamarin.Forms , with the Master-Detail template, and if you " would like [the page] to show up as quick as possible, without going through a "white fade " phase", you should go to the Views.NewItemPage.xaml.cs file and change the Save_Clicked event handler as follows:

await Navigation.PopModalAsync(animated: false);

By doing this, the "fade" animation is not presented, and instead you are pop back to the previous page immediately.