How to share values between pages in Tabbed page in Xamarin.Forms?

Question

While I'm in a hospital after a surgery, having a catheter and forced to calculate a fluid intake/outflow from my body with a pencil and a sheet of paper (!!!)... I got stuck on how to share values between pages at the Tabbed page in Xamarin.Forms.

I have a page - Intake/Outflow where is an Entry element & Button element for the total intake and outflow update. User can write down an amount of fluid and hit button to add this portion to the total amount of consumed fluids. Same goes for the outflow.

My second page is an overview - the Overview page. I would like to display the total amount of fluids (Intake & Outflow) on the Overview page with two labels. That is the point where I got stuck.

I've tried to bind Label.Text to property in Overview's page viewmodel but I don't know how to update the Overview viewmodel properties from code behind of the Intake/Outflow page. I've also tried to use App's properties level which was convenient for OnSleep, OnResume rutines where I store actual values from user to further use. Again, I got stuck on an update of a label located at the Overview Page from code behind of the Intake/Outflow page. In addition, I don't know how to correctly bind the properties in XAML for App.SomeProperty which could also the problem.

The sharing of viewmodel between pages is not an option for me in this particular case.

Is my logic wrong? How should I approach to this task? Could somebody share some example with the logic described above?

@Jason Could you be more specific what to send and where? I know what MessagingCenter is but never used that before. — KUTlime, Sep 18 '19 at 12:33
I can't give a good example without knowing more about what you're doing. But generally you would have your Overview page subscribe to a message, and your In/Out page would send messages whenever data was updated. — Jason, Sep 18 '19 at 14:51

Junior Jiang · Answer 1 · 2019-09-19T06:47:34.250

Is my logic wrong?

Your logic is no problem .

How should I approach to this task?

Using Preferences to save data in first page , and get data in second page when page OnAppearing method invoked .

Could somebody share some example with the logic described above?

I will recommand you to use Xamarin.Essentials: Preferences to realize it , will be sample .By the way , also need to Page notification events to help .You can update data when Page showing by using OnAppearing method .

Here is a example : PageA and PageB

PageA with a Button clicked methodto save text from Entry as follow :

private void Button_Clicked(object sender, EventArgs e)
{
     var inputText = entry.Text; //get value from Entry
     Preferences.Set("my_key", inputText);
}

PageB can get data from Preferences in OnAppearing methods as follow :

protected override void OnAppearing()
{
    base.OnAppearing();

    var myValue = Preferences.Get("my_key", "default_value");
    label.Text = myValue; // show value for Label in second page
}

Note : using Xamarin.Essentials to enable Preferences in Forms .

=============================================================================

Alternatively solution, you can use MessagingCenter as Jason said to realize it .You can refer to document to research it, here is the sample for your logic .

PageA : sending message when button clicked :

private void Button_Clicked(object sender, EventArgs e)
{
     var inputText = entry.Text; //get value from Entry
     MessagingCenter.Send<object, string>(this, "MessageKey", inputText);
}

PageB : Subscribe message in ContentPage

public SecondPage()
{
    InitializeComponent();
    MessagingCenter.Subscribe<object, string>(this, "MessageKey", (sender, arg) =>
    {
        label.Text = arg; //get value from Entry
        Console.WriteLine("get value ---" + arg);
    });
}

Note : Here Subscribe also can be invoked in OnAppearing method .

Jiang - Thanks! Nice and simple solution. I've implemeted this particular solution. — KUTlime, Sep 21 '19 at 07:41

score 1 · Accepted Answer · answered Sep 19 '19 at 03:46

Just use MessagingCenter, likes On OverviewViewModel

public OverviewViewModel(){
 MessagingCenter.Subscribe<IntakeOutflowViewModel, string>(this, "LabelChanged", (sender, label)=>{
   this.LabelValue = label; // use value of label from IntakeOutflowViewModel
})
}

And on IntakeOutflowViewModel

public ICommand ButtonCommand => new Command(()=>{
    MessagingCenter.Send<IntakeOutflowViewModel,string>(this, "LabelChanged", LabelValue);
})
public string LabelValue{...,...} // The value you bind on view

Hope it helps

How to share values between pages in Tabbed page in Xamarin.Forms?

2 Answers2