Forum Xamarin.Forms
We are excited to announce that the Xamarin Forums are moving to the new Microsoft Q&A experience. Q&A is the home for technical questions and answers at across all products at Microsoft now including Xamarin!

We encourage you to head over to Microsoft Q&A for .NET for posting new questions and get involved today.

How to show “up” button in Xamarin.Forms?

RezaMousaviRezaMousavi GBMember
edited March 2016 in Xamarin.Forms

Hi All,

I am trying to work out how to show the "up" arrow in Xamarin.Forms without pushing a page onto the stack. I.E. I just want to perform an action when the back button is pressed. I am completely stuck on this so any help would be appreciated.

I have also asked this question on Stackoverflow but pasted below for convenience - http://stackoverflow.com/questions/36049347/how-to-show-up-button-in-xamarin-forms

I have tried creating a custom renderer which handles a view property called DisplayHomeAsBack. Which in the renderer calls the following:

FormsAppCompatActivity context = ((FormsAppCompatActivity)Forms.Context);
Android.Support.V7.App.ActionBar actionBar = context.SupportActionBar;
if (actionBar != null)
{
  actionBar.SetDisplayHomeAsUpEnabled(element.DisplayHomeAsBack);
}

Unfortunately it seems this does absolutely nothing, even though all online tutorials and stackoverflow question for android suggest this method.

The plan is that I can then use the "OnBackButtonPressed" override in MasterDetailPage, which should allow me to perform this action. Unfortunately displaying the back button has been the larger hurdle so far!

Any idea of a better way to do this or how I can get the current mechanism to work?

Thanks!

Answers

  • RezaMousaviRezaMousavi GBMember

    To give you an idea of what I am trying to do, I bring up an internal view, and I want the view to disappear with the press of a back button (so icon and behaviour need to change). I am happy to do this any other way if it works.

  • AdamMeaneyAdamMeaney USMember ✭✭✭✭✭

    You could use a normal ToolbarItem in Forms to handle it. Just have it have the Text of "Done" or something, get rid of your internal view when pushed.

  • RezaMousaviRezaMousavi GBMember

    Thanks Adam. I think the main issue with that is the flow of the application will break. I dont mind how I do the back button, but I think to the user I'd prefer they can use the hardware back as well as the "up" button?

    Any idea why this wouldn't work in Xamarin though but would in Android?

  • RezaMousaviRezaMousavi GBMember
    edited March 2016

    If it helps, I have created a project to simulate this behavior (or lack of). The push and pop behave fine (top two buttons) but the "push action with back" does nothing, even though it gets to the renderer and SetDisplayHomeAsUpEnabled is called.

    Seems bizarre - something I am missing?

  • RezaMousaviRezaMousavi GBMember

    Somehow missed the attachment....

  • AdamMeaneyAdamMeaney USMember ✭✭✭✭✭

    If you were curious, on the tablet I tested your sample on, the up button is there in landscape, but not portrait.

    I would consider that this approach is flawed.

    What you are looking for is to present a view modally, and then have it dismiss with a back button. Seems reasonable.

    put your view in a ContentPage, use Navigation.PushModalAsync to navigate to it, and let the back button or a toolbaritem pop it.

    Contained, no rendering issues, clean.

    If not, I would say the issue is more with the MasterDetailPage it is in, rather than the navigationpage you made.

  • RezaMousaviRezaMousavi GBMember

    That seems like a reasonable approach. Would I be able to make the background semi-transparent so that you can still see the views underneath? If that's possible then that sounds perfectly fine, in fact it would be much simpler and better supported.

    I do wonder why this would work fine on native android... Must be something in the master detail as you mention. It won't matter though if I can push in the manner you suggest.

    Thanks for your help!

  • AdamMeaneyAdamMeaney USMember ✭✭✭✭✭

    If you need it transparent, I believe that does not work for iOS. Just so you know.

    If you are going for a popup kind of look and feel, take a look at this for an idea of how to accomplish that, or XLabs Popup.

  • RezaMousaviRezaMousavi GBMember

    Thanks a lot. I'll try it out and revert back.

  • RezaMousaviRezaMousavi GBMember
    edited March 2016

    I tried using the popup and the transparent fragment and neither quite worked right for what I am looking for.

    However, I did find something that "works" - but may as well not have because I really don't want to do this. In the base class, there is a Toolbar and ActionBarDrawerToggle which can be used in the following code to do exactly what I am looking for.

    toolbar.NavigationIcon = null;
    if (actionBarDrawerToggle != null)
    {
        actionBarDrawerToggle.DrawerIndicatorEnabled = !element.DisplayHomeAsBack;
        actionBarDrawerToggle.SyncState();
    
        if (element.DisplayHomeAsBack)
        {
            toolbar.NavigationIcon = appCompatActivity.DrawerToggleDelegate.ThemeUpIndicator;
        }
    }
    

    Unfortunately, these are private members and the only way so far I have found of accessing them is via reflection. There is surely another way of accessing them?

    I have attached the project with the new code.

Sign In or Register to comment.