[FIXED] How could I change the Navigastion's page arrow in Xamarin Forms?

Issue

I'm creating an app using xamarin Forms (multiplatform), I'm using a Navigation page, but I want to change the arrow ("<-") to text ("back")

Do you know how could i do it? Thanks

(I'm going to use it in an Android App, but I'm creating the app using Xamarin forms)

Solution

You could use custom renderer to remove the navigation icon and set it with text. But, when you do that, you need to capture the click of the text and simulate the back event.

Create the interface:

public class CustomNavigationPage : NavigationPage
{
    public CustomNavigationPage(Page startupPage) : base(startupPage)
    {

    }
}

The implementation of Android:

  [assembly: ExportRenderer(typeof(CustomNavigationPage), 
typeof(NavigationPageRenderer_Droid))]
namespace NavigationPageDemo.Droid
{
public class NavigationPageRenderer_Droid : NavigationPageRenderer
{
    public Android.Support.V7.Widget.Toolbar toolbar;
    public Activity context;
    public NavigationPageRenderer_Droid(Context context) : base(context)
    {

    }
    protected override Task<bool> OnPushAsync(Page view, bool animated)
    {
        var retVal = base.OnPushAsync(view, animated);

        context = (Activity)Forms.Context;
        toolbar = context.FindViewById<Android.Support.V7.Widget.Toolbar>(Droid.Resource.Id.toolbar);

        if (toolbar != null)
        {
            //if (toolbar.NavigationIcon != null)
            //{
            //toolbar.NavigationIcon = Android.Support.V7.Content.Res.AppCompatResources.GetDrawable(context, Resource.Drawable.back);
            //toolbar.NavigationIcon = null;

            toolbar.NavigationIcon = null;
            toolbar.Title = "back";
            toolbar.SetOnClickListener(new OnClick());
        


            //}
        }

        return retVal;
    }

    protected override Task<bool> OnPopViewAsync(Page page, bool animated)
    {
        return base.OnPopViewAsync(page, animated);
    }

}
public class OnClick : Java.Lang.Object, IOnClickListener
{
    void IOnClickListener.OnClick(Android.Views.View v)
    {
        App.Current.MainPage.Navigation.PopAsync();
    }

  
}

In the custom renderer, use the OnClickListener to capture the click on text.

Answered By - Wendy Zang - MSFT

Answer Checked By - Senaida (PHPFixing Volunteer)