open class FUINavigationBar : UINavigationBar

FUINavigationBar is a subclass of ‘UINavigationBar’ which applies the Fiori Design Language styling by default.

It exposes a bannerView: FUIBannerMessageView view property, which may be presented, using the FUIBannerMessageView show() method. By default, the message is shown centered on screen under the navigation bar.



Setup a FUINavigationBar in your navigation controller. You can set either in storyboard or programmatically.

Presenting FUIBannerMessageView

guard let navBar = self.navigationController?.navigationBar as? FUINavigationBar else {

navBar.bannerView?.show(message: "This is a test banner", withDuration: 1, animated: true)


bar-tint-color is intended to be used for backward compatibility on iOS 12. In order to customize navigation bar color on iOS 13 or above, developer should either set background-color to apply one color to all bar appearences, or configure standard-background-color, scrolledge-background-color and scrolledge--background-color as a whole for different color settings.

NavigationBar {
   background-color: @primary1_darkBackground;
   background-tint-color: @tintColorDark;

  • The banner view sits underneath FUINavigationBar. Call show() to enable it.



    open var bannerView: FUIBannerMessageView? { get set }