CODEWITHSUNDEEP
androidformsxamarinxamarin.formsxamarin.android
SpaceandCode
SpaceandCode

Reputation: 13

How to dynamically add/remove back button from a page that's already been constructed in XamarinForms.Android?

Our team is currently implementing some UI/UX improvements to standardize how a user saves/cancels any changes made while editing data in our app; and I've got everything working except this last issue on Android. I have a content page that displays account information (Name, address, account #, etc) using entry controls which by default have their IsReadOnly bindings set to true. However; if a user taps an 'edit' button up in the toolbar, the user is now in 'Edit Mode'; all of the entry controls IsReadOnly bindings are set to false and the user if free to make changes.

The problem: To avoid ambiguity in my save/cancel pattern, I want to dynamically remove the back button from the toolbar if the user is in 'Edit Mode', and then add it back once the user saves changes. This works perfectly fine on iOS and UWP. Android only seems to allow setting the back button ONE time at page construction using something like this:

NavigationPage.SetHasBackButton(this, false);

Android content page with back arrow present

Is there a fix/workaround on Android for hiding the back button on a content page that has already been constructed?

Currently my workaround on Android is to intercept the back button press on Android and show the user a dialog warning them they are about to lose their changes and giving them the ability to save first.

EDIT: Here is the code that works on UWP/iOS. This is in my code-behind xaml.cs of the view:

    private void EditMeterButton_Clicked(object sender, System.EventArgs e)
    {
        if (!ViewModel.IsChangeMeterVisible)
            ViewModel.HideChangeMeterIcon();

        HandleBackArrowVisibility();
    }

    private void SaveButton_Clicked(object sender, System.EventArgs e)
    {
        HandleBackArrowVisibility();
    }

    private void CancelButton_Clicked(object sender, System.EventArgs e)
    {
        HandleBackArrowVisibility();
    }

    private void HandleBackArrowVisibility()
    {
        if (ViewModel.showBackButton)
            NavigationPage.SetHasBackButton(this, true);
        else
        {
            if(Device.RuntimePlatform != Device.Android)
                NavigationPage.SetHasBackButton(this, false);               
        }
    }

Upvotes: 0

Views: 470

Answers (2)

Bas H
Bas H

Reputation: 2226

You want to Hide and Show the BackButton with ButtonClicked.

  private void Button_Clicked(object sender, EventArgs e)
    {           
        NavigationPage.SetHasBackButton(this, false);
    }

    private void Button_Clicked_1(object sender, EventArgs e)
    {
        NavigationPage.SetHasBackButton(this, true);
    }

If you want to use it Platform Specific

  private void Button_Clicked(object sender, EventArgs e)
    {

        switch (Device.RuntimePlatform)
        {
            case Device.Android:
                // do your Android assignments...
                NavigationPage.SetHasBackButton(this, false);
                break;
            default:
                // do your UWP & iOS assignments...
                NavigationPage.SetHasBackButton(this, true);
                break;
        }
    }

enter image description here

Upvotes: 1

user2153142
user2153142

Reputation: 804

Do you mean the up button (left arrow) If so you could use

toolbar.NavigationIcon = null;

Upvotes: 0

Related Questions