How to Refresh or Recall Page on Xamarin Forms

Question

So, I have this app where I can choose a car and see the car info... I'm displaying the cars like this.

I'm using the Rg.Plugins.Popup so when I click the car icon, it opens this popup with "my cars"

So now I'm facing a problem which is, when I choose a car, I want to refresh my current page so the car's info can be shown... I'm handling the car button click on this next view model:

public class MyCarViewModel : ViewModelBase
    {

        public MyCarViewModel()
        {
        }
        public MyCarViewModel(INavigation navigation)
        {
            this.Navigation = navigation;
            this.SelectedCar = null;
            GetClientCars();
        }

        private Page page { get; set; }
        private List<CarInfo> _CarList;

        public List<CarInfo> CarList
        {
            get
            {
                return _CarList;
            }

            set
            {
                _CarList = value;
                OnPropertyChanged("CarList");
            }
        }

        private CarInfo _SelectedCar;

        public CarInfo SelectedCar
        {
            get
            {
                return _SelectedCar;
            }

            set
            {
                _SelectedCar = value;
                OnPropertyChanged("SelectedCar");
                if (_SelectedCar != null)
                {
                    CarSelected(_SelectedCar);
                }

            }
        }

        public INavigation Navigation { get; set; }

        private void CarSelected(CarInfo car)
        {

            App.choosedCar = car;
            PopupNavigation.Instance.PopAllAsync();
            this.SelectedCar = null;
        }
}

And I want this View to refresh

<views:BaseMainPage 
    xmlns="http://xamarin.com/schemas/2014/forms"
    xmlns:x="http://schemas.microsoft.com/winfx/2009/xaml"
    x:Class="OficinaDigitalX.Views.CarDetails"
    xmlns:views="clr-namespace:OficinaDigitalX.Views">
    <views:BaseMainPage.Content>
        <StackLayout>
            <Label Text="{Binding VID, StringFormat='Modelo: {0:F0}'}" FontAttributes="Bold"
               FontSize="Large"/>
            <Label Text="{Binding LicencePlate, StringFormat='Matrícula: {0:F0}'}"/>
            <Label Text="{Binding Chassis, StringFormat='Chassis: {0:F0}'}"/>
            <Label Text="{Binding Km, StringFormat='Ultimos Km Registados: {0:N0}'}"/>
        </StackLayout>
    </views:BaseMainPage.Content>
</views:BaseMainPage>

and xaml.cs

public partial class CarDetails : BaseMainPage
        {

            public CarDetails(CarInfo car)
            {
                InitializeComponent();
                BindingContext = new CarDetailViewModel(this);
                App.currentPage = this;
                if (car != null)
                {
                    this.Title = "Dados de " + car.MakerandModel;
                }
                else
                {
                    this.Title = "Escolha uma Viatura";
                }
            }

        }

I'm facing a lot of issues here because my car icon is a part of my "BaseMainPage" which is extended by the other Views (so the icon can be shown on all views)...

So when I click the button, the application doesn't know its current page... I thought I might use the Navigation Stack to reload it but I don't quite know how to do this... Hope you guys can help

Solution 1

Well, essentially you do not need to refresh page or reload page, you just need to refresh the data.

since you are using OnPropertyChanged(INotifyPropertyChanged) you are half way there. instead of using List CarList use ObservableCollection CarList.

and if you deliberately want to reload the page, on dismissing the pop.up save your data and call the constructor/reinitiate the Page.

hopefully you should achieve what you are looking for.

Solution 2

I've just used MessagingCenter and I've called it with my OnPropertyChanged and this seemed to do the work! Thanks a lot!

View Model:

OnPropertyChanged("SelectedCar");
                if (_SelectedCar != null)
                {
                    CarSelected(_SelectedCar);
                    MessagingCenter.Send(this, "Hi");
                }

My other view model's constructor

MessagingCenter.Subscribe<MyCarViewModel>(this, "Hi", (sender) => {
                this.currentCar = App.choosedCar;
            });

Solution 3

I think you don't need to reload the page, you need to reload your data. Your page will be updated automatically with the databindings.

For me it looks like you're using Prism, so you could override the OnNavigatingTo Method and load the data every time the page is "opened".

Comments

[FreakyAli]

Are you using any MVVM frameworks?

[bifedefrango]

yes, it's my public class MyCarViewModel : ViewModelBase

[FreakyAli]

Can i see how you navigate between pages?

[bifedefrango]

when I click in my button this happen: PopupNavigation.Instance.PushAsync(new CarPopup()); My car popup is a view that's binded to MyCarViewModel and basicaly as you can see in a picture is a Frame that has a stack layout with my carList inside, when I click in a car, My App.choosedcar gets the new car value... but the page that's in the back always stay there (see in picture too) and in that page I have a binding to a choosedCar that in the constructor is equal to App.choosedcar So I'm using App.choosedCar as a global variable so I can use it everywhere without losing the choosedCar

[FreakyAli]

The why are setting that as the binding context of the page then?

[bifedefrango]

sorry I've correct it, I'm now using a view model

[bifedefrango]

the thing is, when I click on my car button, it opens a popup so the page doesn't change and it doesn't know that I have the popup opened... so I don't know how to "send a message" from the popup to my page since I have the popup in all of my pages... I thought maybe sending the navigation but it's not that simple...

[bifedefrango]

thanks but I can't (or I don't know to) reload the page because I don't know in what page I'm at... It's like, I know but the app doesn't xD has you can see I'm using BaseMainPage that's a Content Page with a button (my car button) and I'm implementing that in all of my pages so I can have this button in all of them and handle it the same instead of rewriting the code everytime... So as I click this button, I don't send any information about where I am at the current moment...

[bifedefrango]

So what I've tryed was creating a global variable on my App.xaml.cs and save the current page there but then I can't open a page from a string... or even if I save it as a Page I can't make a "new" navigation from a variable... I'm saving my selected car in a variable like this and I'm using in my binding like this private void CarSelected(CarInfo car) { App.choosedCar = car; }

[Jannik R.]

How do you close your popup ? Do you use the INavigationService.GoBackAsync() or do you navigate again to your page using NavigateAsync()?

[Aditya Deshpande]

Let me try to understand your problem once again. ON THE POPUP PAGE, when the user clicks on a car model , You want to hide the list and show the details of that car.?

[bifedefrango]

I'm using a property of my Rg.Plugins.Popup plugin it's await PopupNavigation.Instance.PopAllAsync();

[bifedefrango]

I have a page, (all of my pages implement basemainpage that has the car icon) and I click the icon, and a popup with my car list shows (my page is still open on the back) I choose a car and my global variable App.choosedcar is setted to the new car value, and the pop up closes, but since de page is oppened it doens't refresh the content and since I'm saving on my global variable (so I can use it on all pages too and know what car is selected) I can't have the "onpropertychanged" method:(

[bifedefrango]

the variable I'm using to get the car on the view model is setted on the constructor

[Jannik R.]

Did I see it correctly that you are using the Prism Framework for MVVM ?

[bifedefrango]

I'm kind of noob in xamarin xD It's my first project, but I guess I'm not using Prism...xb

[Jannik R.]

Is it possible that you provide a project ?

[bifedefrango]

I could provide a part of it, but I'm getting the data from the database so you wouldn't be able to see anything...

[Jannik R.]

Doesn't matter , would be much easier to help you looking at your code.

[bifedefrango]

I think I've forget to include the images in the project xD if they don't appear just add them, they're on the drawable

[Jannik R.]

Seems the RAR file is damaged