FUIBannerMessageView

@MainActor
open class FUIBannerMessageView : NibDesignable

FUIBannerMessageView shows an overlay message centered in the screen underneath a navigation bar, or one of FUIObjectHeader, FUIProfileHeader, and FUIKPIHeader. FUINavigationBar contains a FUIBannerMessageView by default.

Call show function on a FUIBannerMessageView instance to show the message. By default, the message is shown centered on screen.

Usage

FUINavigationBar has a FUIBannerMessageView prepared for you. Usually you don’t need to create an instance of it. For FUIObjectHeader, FUIProfileHeader, and FUIKPIHeader, however, you need to allocate a FUIBannerMessageView or its subclasses to the bannerMessage property of the corresponding header view.

Setup

To display the banner message in a navigation bar, setup a FUINavigationBar in your navigation controller. You can set either in a nib file or programmatically.

Show message

guard let navBar = self.navigationController?.navigationBar as? FUINavigationBar else {
   return
}
navBar.bannerView?.show(message: "This is a test banner", withDuration: 1, animated: true)
/// An example of a UITableViewController with `FUIBannerMessageView` in an `FUIObjectHeader`
class BannerObjectHeaderBannerTVC: UITableViewController {

    let objectHeader = FUIObjectHeader()

    let bannerView = FUIBannerMessageView()

    override func viewDidLoad() {
        self.tableView.tableHeaderView = objectHeader
        super.viewDidLoad()

        // Optionally set the semantic attribute of the banner
        bannerView.semantic = .offline

        bannerView.isFading = false
        objectHeader.bannerView = bannerView
    }

    override func viewDidAppear(_ animated: Bool) {
        super.viewDidAppear(animated)
        bannerView.show(message: "200k pending to upload example with text showing wrapping to two lines", withDuration: 5 ,animated: true)
    }

    // ...
}

Theming

Supported style classes

fdlFUIBannerMessageView
fdlFUIBannerMessageView_titleLabel
fdlFUIBannerMessageView_dividerTop
fdlFUIBannerMessageView_dividerBottom
fdlFUIBannerMessageView_blurView
fdlFUIBannerMessageView_contentView
fdlFUIBannerMessageView_closeImage
  • Alignment for banner title and icon.

    See more

    Declaration

    Swift

    public enum FUIBannerMessageAlignment
  • Semantic attribute of FUIBannerMessageView

    See more

    Declaration

    Swift

    public enum FUIBannerMessageViewSemantic : Int
  • The content view of FUIBannerMessageView instance.

    Declaration

    Swift

    @IBOutlet
    @MainActor
    public private(set) var view: UIView! { get }
  • The view which adds blurry effect.

    Declaration

    Swift

    @IBOutlet
    @MainActor
    public private(set) weak var blurView: UIVisualEffectView! { get }
  • The icon to display.

    Declaration

    Swift

    @IBOutlet
    @MainActor
    public private(set) var icon: UIImageView! { get }
  • The label which contains the message.

    Declaration

    Swift

    @IBOutlet
    @MainActor
    public private(set) var titleLabel: UILabel! { get }
  • The view serves as top divider.

    Declaration

    Swift

    @IBOutlet
    @MainActor
    public private(set) weak var dividerTop: UIView! { get }
  • The view serves as bottom divider.

    Declaration

    Swift

    @IBOutlet
    @MainActor
    public private(set) weak var dividerBottom: UIView! { get }
  • The navigation bar which this FUIBannerMessageView instance attacheds to.

    Declaration

    Swift

    @MainActor
    public weak var navigationBar: UINavigationBar?
  • The header view which this FUIBannerMessageView instance attacheds to. It could be FUIObjectHeader, FUIProfileHeader, or FUIKPIHeader.

    Declaration

    Swift

    @MainActor
    public weak var headerView: UIView?
  • Indicates if to show and dismiss of the view should be fading in or out. The default is true.

    Declaration

    Swift

    @MainActor
    public var isFading: Bool
  • This handler will be invoked when the banner view is dismissed.

    Declaration

    Swift

    @MainActor
    public var dismissHandler: ((FUIBannerMessageView) -> Void)?
  • The “Close” icon image view. Tap this icon to dismiss this FUIBannerMessageView.

    Declaration

    Swift

    @IBOutlet
    @MainActor
    public private(set) var closeImage: UIImageView! { get }
  • Default is true, remove banner from superview automatically.

    Declaration

    Swift

    @MainActor
    public var needHandleCloseAction: Bool
  • Default is .center. Only .left and .center is supported.

    Declaration

    Swift

    @MainActor
    public var contentAlignment: FUIBannerMessageAlignment
  • This property indicates if the content of the view is to be pushes down or not when showing the banner.

    The default is false, meaning that the banner will be displayed over the top of the content.

    Note that this “push down content” behavior only works when the banner is attached to FUINavigationBar. Or, if the banner is attached to FUIObjectHeader, FUIProfileHeader, or FUIKPIHeader and its container view is a UITableView, and the header view is the tableHeaderView of that UITableView.

    Declaration

    Swift

    @MainActor
    open var pushesContentDown: Bool
  • This is the UIViewController when the banner is showing.

    This property is needed to be set when this FUIBannerMessageView is to be shown without covering part of the view content when the banner is attached to an FUINavigationBar.

    Declaration

    Swift

    @MainActor
    open var viewController: UIViewController?
  • Sets semantic color of the view. It is negative by default.

    Declaration

    Swift

    @MainActor
    public var semantic: FUIBannerMessageViewSemantic { get set }
  • Color for icon in different semantic

    Declaration

    Swift

    @MainActor
    public func iconSemanticColor() -> UIColor
  • Show the banner with a message under navigation bar for a certain duration.

    Declaration

    Swift

    @MainActor
    open func show(message: String, withDuration duration: TimeInterval = 0, animated: Bool = true)

    Parameters

    message

    The message which will show on the banner.

    duration

    The duration in seconds for the message is shown. This message view will be automatically dismissed when the duration is expired. The banner will not be automatically dismissed if the value is smaller or equal to 0. The default is ‘0’, means not to be automatically dismissed.

    animated

    Whether the banner is shown with an animation. The default is true.

  • Dismiss the banner.

    Declaration

    Swift

    @MainActor
    open func dismissBanner(animated: Bool)

    Parameters

    animated

    Whether the banner should dismiss with an animation.

  • Undocumented

    Declaration

    Swift

    @MainActor
    open override func layoutSubviews()
  • Undocumented

    Declaration

    Swift

    @MainActor
    open override var accessibilityElements: [Any]? { get set }
  • The banner can be shown under other components, e.g. Object Header.

    Declaration

    Swift

    @MainActor
    open func showMultiMessage(messages: [FUIBannerMessageListModel], withDuration duration: TimeInterval = 0, animated: Bool = true)

    Parameters

    message

    The message which will be shown on the banner.

    duration

    The duration in seconds for the message is shown. This message view will be automatically dismissed when the duration is expired. The banner will not be automatically dismissed if the value is smaller or equal to 0. The default is ‘0’.

    animated

    Whether the banner is shown with an animation. The default is true.

  • Multi message data array, [FUIBannerMessageListModel]

    Declaration

    Swift

    @MainActor
    open var bannerMultiMessages: [FUIBannerMessageListModel] { get set }
  • View the message detail callback, the parameter is message id, developer can use the id to scroll to the relative item

    Declaration

    Swift

    @MainActor
    public var viewDetailAction: ((UUID) -> Void)?
  • Show message detail section header or not, default is true

    Declaration

    Swift

    @MainActor
    public var turnOnSectionHeader: Bool
  • The navigation for banner to present the multi message sheet

    Declaration

    Swift

    @MainActor
    public var currentNav: UINavigationController?
  • the callback when title clicked

    Declaration

    Swift

    @MainActor
    public var titleTapAction: (() -> Void)?