Skip to content

CrossGeeks/CustomNavigationBarSample

Repository files navigation

CustomNavigationBarSample

Navigation Bar Customization in Xamarin Forms

Blog post: http://www.xamboy.com/2017/12/06/navigation-bar-customization-in-xamarin-forms/

Features

  • Title/Subtitle positioning
  • Subtitle
  • Bar Gradient Background
  • Title Font Customization
  • Subtitle Font Customization
  • Formatted Title
  • Formatted Subtitle
  • Image title
  • Bar Background
  • Bar Shadow
  • Bar Opacity
  • Title Margin
  • Title Padding
  • Title Border
  • Title Background

Usage on a Xamarin Forms page

//Sets the title position to end

CustomNavigationPage.SetTitlePosition(this, CustomNavigationPage.TitleAlignment.End);

//Sets shadow for bar bottom

CustomNavigationPage.SetHasShadow(this,true);

//Gets if has shadow or not

bool hasShadow = CustomNavigationPage.GetHasShadow(this);

//Sets the title text font to Micro
CustomNavigationPage.SetTitleFont(this, Font.SystemFontOfSize(NamedSize.Micro));

//Sets the title color
CustomNavigationPage.SetTitleColor(this,Color.Navy);

//Sets bar background
CustomNavigationPage.SetBarBackground(this, Device.RuntimePlatform == Device.iOS ? "monkeybackground.jpg": "monkeybackground");

//Sets bar background opacity
CustomNavigationPage.SetBarBackgroundOpacity(this,0.6f);

Future

  • UWP and other platforms support
  • Support Badges
  • Kerning
  • Back Button Customization
  • Toolbar Items Customization
  • Buttons/Picker as title
  • Rotated Title
  • Animations
  • Traslucent Bar
  • Collapsable Bar
  • Bar Templates