0

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

htp15
  • 51
  • 1
  • 8
  • is `Person` observable? Is the object you're modifying in the details page the same instance as the object in the CollectionView? If not you will need to do something in order to update both instances – Jason Feb 09 '23 at 15:43
  • thank you for the reply. I added the person class. – htp15 Feb 09 '23 at 15:57
  • 2
    `Person` is not [Observable](https://learn.microsoft.com/en-us/dotnet/communitytoolkit/mvvm/observableobject) so changes to its properties will not update the UI. – Jason Feb 09 '23 at 16:01
  • "If not you will need to do something in order to update both instances" - Will it have a effect when the data in the database are already changed and when I go back to the overview page I already reload the data from the database again already? I would think it should aready have the data especially when the observable collection of the view model for the overview page already has the correct data, or am I wrong? – htp15 Feb 09 '23 at 16:01
  • I don't know anything about how your page is architected or how you are passing data between pages so its impossible to say – Jason Feb 09 '23 at 16:03
  • Thanks for the answer. I added information about the viewmodels. @ewerspej does it make a difference if I already inhert the base view model from observeable object and made persons a observable collection? Would the person datatype mentioned in `observablecollection` and/or in the page on this line `` need to be also inherted from observable object? – htp15 Feb 09 '23 at 16:32
  • Ok, got it. So I need to also make the model inhert from observeable object. Thank you! – htp15 Feb 09 '23 at 16:39

0 Answers0