Xamarin形成主细节图标

Question

I am trying to add an image next to the hamburger menu in my app. I am using a master detail page and it renders fine in ios and android. I tried using setting the icons for the detail pages. but the icons never showed. How do I achive this. I am looking to add an image similar to the amazon app.

Answer 1

I checked out this app on my phone and it uses a lot of custom constructions that aren't supported by out of the box Xamarin Forms controls. Something like the back arrow next to the hamburger menu is not a standard thing (on iOS at least). Also looking at the actual menu that the hamburger button triggers it becomes clear that its not an out of the box hamburger menu. Theirs pops over the content instead of sliding it out of view as the built-in one does.

More than likely they implemented their own hamburger menu and navigation structure which gave them the freedom to add buttons next to it. If you want to achieve this with out of the box controls you will most likely need custom renderers for each platform to create a replica of this navigation structure.

What is built-in in Xamarin Forms is that you can set the page title to an image instead of text by using the NavigationPage.SetTitleIcon method, which could be used to achieve what you want:

public class MyPage : NavigationPage
{
    public MyPage ()
    {
        var myContentPage = new MyContentPage (Color.White);
        this.Push (myContentPage);

        var s = "icon.png";
        NavigationPage.SetTitleIcon (myContentPage, s);
    }
}

Even then, this is limited in functionality. If you want to fiddle with the alignment of the image eg you would also need to resort to a custom renderer.