Xamarin Forms App Shell OnPropertyChanged not updating for FlyoutHeader view

Question

I am binding a text property from a viewmodel into a the FlyoutHeader view of the App Shell slide out menu

All the update events fire correctly when the app is initialised, however there is a page the user may go in order to update their information

The problem I have is when you navigate to this page and execute the update, the FlyoutHeader view isn't updating in response to the viewmodel

Is there something specific to the slide out menu that means once it is loaded it then it doesn't change in response to onpropertychanged ... ? Doesn't seem right

From AppShell xaml

<Shell.FlyoutHeader>
    <views:FlyoutHeader />
</Shell.FlyoutHeader>

From Flyoutheader code behind

    private LocationsViewModel _vm;

    public FlyoutHeader()
    {
        InitializeComponent();

        this.BindingContext = new LocationsViewModel();
    }

    protected override void OnBindingContextChanged()

    {

        _vm = BindingContext as LocationsViewModel;


        _vm.PropertyChanged += _vm_PropertyChanged;

        _vm.SetUserLocation();

    }

User navigates to 'change location' page via a button in FlyoutHeader view, called like so

            await Shell.Current.GoToAsync("changelocation");

In my debug log I can see that the binding object 'user' in the LocationsViewModel does trigger OnPropertyChanged in response to a change made on this page, but then going 'back' and opening the flyoutmenu nothing has changed and I can see the PropertyChanged didn't fire for that view?

I thought the whole point of OnPropertyChanged binding was even with the view loaded an update occurs to cause the view to respond?

Why exactly do you need that OnBindingContextChanged there? — FreakyAli
It allows me to associate events with _vm_PropertyChanged which is where I have some code to update the appropriate label with the new value. Granted in this situation what I'm using it for is very simple and perhaps binding that label in XAML would mean I didn't need it but is there something about it that ought not to work? — Journeyman1234
I took out the code (apart from this.BindingContext =) and bound the label to the text property in XAML but the same result, it doesn't update when you go to the other page and make a change via the viewmodel (I put a debug message on that other page confirming that the label text updates in the context of the page you change it on). Hence wondering if this is something specific to how Flyout works — Journeyman1234
Well, what I understand from your comments is that when you make a change from somewhere else in your current view model it is not working even though the property changed is fired? If that is the case are you sure that it is the same instance of your VM? — FreakyAli
Happy to help if that works for you let me know and I will add an answer! — FreakyAli

FreakyAli FreakyAli · Accepted Answer · 2020-02-07T12:21:46

The issue is basically because you are creating multiple instances of the same ViewModel, So the thing is you are trying to change a header that is bound to a property in your ViewModel, which is then bound to you View, so for your View to reflect the change that you made in your ViewModel it ought to have the instance of the ViewModel that is bound to it if that makes sense!

Doing this will solve your issue

Good luck!

Xamarin Forms App Shell OnPropertyChanged not updating for FlyoutHeader view

1 Answers