I configured this collection view in a .net maui page as overview of all persons data:
<CollectionView BackgroundColor="Transparent"
ItemsSource="{Binding Persons}"
SelectionMode="None">
<CollectionView.EmptyView>
...
</CollectionView.EmptyView>
<CollectionView.ItemTemplate>
<DataTemplate x:DataType="model:Person">
<Grid Padding="10">
<Frame HeightRequest="100">
<Frame.GestureRecognizers>
<TapGestureRecognizer CommandParameter="{Binding .}"
Command="{Binding Source={RelativeSource AncestorType={x:Type viewmodel:PersonViewModel}}, Path=GoToPersonDetailsCommand}"/>
</Frame.GestureRecognizers>
<Grid Padding="0"
ColumnDefinitions="*,Auto"
RowDefinitions="*,*">
<Label Grid.Column="0"
Grid.RowSpan="2"
Text="{Binding FirstName}"/>
<Label Grid.Column="1"
Text="{Binding LastName}" />
<Label Grid.Column="1"
Grid.Row="2"
Text="{Binding UserName}" />
</Grid>
</Frame>
</Grid>
</DataTemplate>
</CollectionView.ItemTemplate>
</CollectionView>
The person class look like this:
namespace TestProject.Models;
public partial class Person
{
public string Id { get; set; }
public string FirstName{ get; set; }
public string LastName{ get; set; }
public string UserName{ get; set; }
}
The view model for the overview page looks like this:
public partial class PersonViewModel : BaseViewModel
{
private readonly PersonService _personService;
private readonly IConnectivity _connectivity;
public ObservableCollection<Person> Persons { get; } = new();
public PersonViewModel(PersonService personService, IConnectivity connectivity)
{
Title = "Person";
_personService = personService;
_connectivity = connectivity;
}
...
[RelayCommand]
async Task GetPersons()
{
if (IsBusy) return;
try
{
if (_connectivity.NetworkAccess != NetworkAccess.Internet)
{
await Shell.Current.DisplayAlert("Internet issues",
$"Check your internet and try again!", "OK");
return;
}
IsBusy = true;
var persons = await _personService.GetPersons();
if (Persons.Count != 0)
Persons.Clear();
foreach (var person in persons)
Persons.Add(person);
}
catch (Exception ex)
{
Debug.WriteLine(ex);
await Shell.Current.DisplayAlert("Error!", $"Unable to get accounts: {ex.Message}", "OK");
}
finally
{
IsBusy = false;
IsRefreshing = false;
}
}
}
And the base view model like this:
public partial class BaseViewModel : ObservableObject
{
...
}
If I refresh the page or the page is opened the first time the GetPersons Command is run and loads the data using an external API.
When I now change the first name of a person in the person details page come back to the overview page and refresh the view the observable collection (Accounts) in the view model is updated (I can see the change in the observable collection during the debugging) with the new name but not the collection view.
What am I doing wrong? Any help is appreciated.
Edit1: Add the model class.
Edit2: Add the view model and data loading information.
Edit3: Information to BaseViewModel