UWP listview doesn't update after updating/adding an element to the MVVM collection list

Question

I am frustrated with the listview ItemSource and MVVM binding. I am binding the listview with a data model. After loading the listview, I add another item to the listview, the update is not reflected in listview, but it shows that the number of items in the list collection is increased by one. If I add the add in the list collection in the constructor, it is shown in the listview.

XAML

<Page
x:Class="App20.MainPage"
xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
xmlns:local="using:App20"
xmlns:d="http://schemas.microsoft.com/expression/blend/2008"
xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006"
mc:Ignorable="d"
Background="{ThemeResource ApplicationPageBackgroundThemeBrush}">

<Page.DataContext>
    <local:VictimsController></local:VictimsController>
</Page.DataContext>
<Grid Padding="10">
    <Grid>
        <Grid.RowDefinitions>
            <RowDefinition Height="Auto"></RowDefinition>
            <RowDefinition Height="*"></RowDefinition>
        </Grid.RowDefinitions>
        <Grid Grid.Row="0">
            <TextBlock Text="List of Victims/Trapped" HorizontalAlignment="Center" Style="{StaticResource HeaderTextBlockStyle}"/>
        </Grid>
        <Grid Grid.Row="1">
            <ListView x:Name="ls" ItemsSource="{Binding VictimList, Mode=TwoWay}">
                <ListView.HeaderTemplate>
                    <DataTemplate>
                        <Grid>
                            <Grid.ColumnDefinitions>
                                <ColumnDefinition Width="*"/>
                                <ColumnDefinition Width="*" />
                                <ColumnDefinition Width="*"/>
                            </Grid.ColumnDefinitions>
                            <TextBlock FontWeight="Bold" HorizontalAlignment="Center" Grid.Column="0"  Text="GPSLatitute" />
                            <TextBlock FontWeight="Bold" HorizontalAlignment="Center" Grid.Column="1" Text="GPSLongtitude" />
                            <TextBlock FontWeight="Bold" HorizontalAlignment="Center" Grid.Column="2" Text="Date" />
                        </Grid>
                    </DataTemplate>
                </ListView.HeaderTemplate>
                <ListView.ItemTemplate>
                    <DataTemplate>
                        <Grid>
                            <Grid.ColumnDefinitions>
                                <ColumnDefinition Width="*"/>
                                <ColumnDefinition Width="*" />
                                <ColumnDefinition Width="*"/>
                            </Grid.ColumnDefinitions>
                            <TextBlock HorizontalAlignment="Center" Grid.Column="0" Text="{Binding GPSLatitute}" />
                            <TextBlock HorizontalAlignment="Center" Grid.Column="1" Text="{Binding GPSLongtitude}" />
                            <TextBlock HorizontalAlignment="Center" Grid.Column="2" Text="{Binding Date}" />
                        </Grid>
                    </DataTemplate>
                </ListView.ItemTemplate>
            </ListView>
        </Grid>
    </Grid>
    <Button Content="Publish" VerticalAlignment="Top" 
            Height="76" Width="114" Click="Publish_Click" />
</Grid>

Controller

public class VictimsController : INotifyPropertyChanged
{
    List<VictimProfile> _victims = new List<VictimProfile>();
    public VictimsController()
    {
        //Victims.Add(new VictimProfile() { GPSLatitute = 123, GPSLongtitude = 2333 });
    }
    public List<VictimProfile> VictimList
    {
        get
        {
            return _victims;
        }
        set
        {
            _victims = value;
            OnPropertyChanged("VictimList");
        }
    }
    public void addVictim(VictimProfile profile)
    {
        _victims.Add(profile);
        OnPropertyChanged("VictimList");
    }
    public event PropertyChangedEventHandler PropertyChanged;
    public void OnPropertyChanged(string propertyName)
    {
        PropertyChanged?.Invoke(this, new PropertyChangedEventArgs(propertyName));
    }
}

Adding one item to the listview model or collection

async void client_MqttMsgPublishReceived(object sender, MqttMsgPublishEventArgs e)
    {
        string ReceivedMessage = Encoding.UTF8.GetString(e.Message);
        //convert the message to json format
        var payLoad = JsonConvert.DeserializeObject<VictimProfile>(ReceivedMessage);
        // we need this construction because the receiving code in the library and the UI with textbox run on different threads
        await Dispatcher.RunAsync(CoreDispatcherPriority.Normal, () => {
            txt.Text += ReceivedMessage;
            VictimsController model = this.DataContext as VictimsController;
            model.addVictim(payLoad); //add item to the list collection
            Debug.WriteLine("count: " + ls.Items.Count); //this shows that listview has one more item added to it, but nothing is shown in the listview
            //ls.Items.Add(payLoad);
        });
    }

The point is the list collection has the new item and the ls (listview) also has the item, but it is not shown in the listview.

Answer 1

Finally I solved it. Changing the list to observable collection has solved the problem.

 ObservableCollection<VictimProfile> _victims = new ObservableCollection<VictimProfile>();