Exploring Colors in Xamarin.Forms Shell

David Ortinau - Jan 4 '21 - - Dev Community

Shell provides colors for styling most anything you can see in the chrome of your application such. This video takes a walk through several of the options available and discusses how styles are applied to both tabs and flyouts.

Colors

  • Shell.BackgroundColor - the background of the shell, which comes through in the navigation bar (title bar) area
  • Shell.TitleColor - the color of the title in the navigation bar
  • Shell.ForegroundColor - the tint color for things like the menu icon
  • Shell.TabBarBackgroundColor - color behind the tabs on the bottom
  • Shell.TabBarTitleColor - the color of the labels and icons of the selected tab
  • Shell.TabBarUnselectedColor - the color of the labels and icons that are unselected

Resources

Shell Styles Sample

This app explores the various color options and style classes available to customize a Xamarin.Forms app using the Shell flyout and/or tabs.




. . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . .