Adding an Image in Navigation Bar.

crazygangcrazygang BDMember ✭✭

Hello. How can I add a Background Image in a NavigationBar / Toolbar in Xamarin.Forms ? Do I need a custom renderer ? If yes, what kind of renderer should I use and how to use it ? Below is the XAML code to render the toolbar. I want to preserve the icon action menu which is on the right. When I click this, it goes to the next page. Can someone please help me with this? Thanks.

  <ContentPage.ToolbarItems>

      <ToolbarItem Name="MenuItem1" Order="Primary" Icon="action_menu.png" Text="Configuration" Activated="Show_Menu" Priority="0" />

  </ContentPage.ToolbarItems>  

Answers

  • RendyDelRosarioRendyDelRosario DOUniversity ✭✭✭

    Yes you should use a custom render of NavigationRenderer.

    Here is something you could try on iOS:

           public class CustomNavigationBarRenderer : NavigationRenderer
        {
    
            public override void ViewDidLoad()
            {
                base.ViewDidLoad ();
    
                NavigationBar.TintColor = UIColor.Red;
                NavigationBar.TopItem.TitleView= new UIImageView (UIImage.FromBundle ("logo")) 
                {
                       ContentMode = UIViewContentMode.ScaleAspectFit
                };
    
    
            }
    
        }
    
  • @RendyDelRosario said:
    Yes you should use a custom render of NavigationRenderer.

    Here is something you could try on iOS:

           public class CustomNavigationBarRenderer : NavigationRenderer
      {
    
          public override void ViewDidLoad()
          {
              base.ViewDidLoad ();
    
              NavigationBar.TintColor = UIColor.Red;
              NavigationBar.TopItem.TitleView= new UIImageView (UIImage.FromBundle ("logo")) 
              {
                     ContentMode = UIViewContentMode.ScaleAspectFit
              };
          
      
          }
    
      }
    

    Thanks @RendyDelRosario . So how do we do this on Android?

Sign In or Register to comment.