NatButton

public final class NatButton : UIButton, Pulsable

Note

This component is available in the following variants:
  • ✅ Contained
  • ✅ Outlined
  • ✅ Text

With the following attribute status:

  • ✅ Disabled
  • ✅ Display (available in a different way)
  • Size:
    • Semi (small)
    • SemiX (medium)
    • Medium (large)
  • Icon:
    • Left
    • Right
  • Interaction state:
    • Enabled
    • Focus
    • Press
    • Hover (not applicable)

NatButton is a class that represents button component from the design system. The button colors changes according with the current theme configured in the Design system.

This button has 3 styles:

  • Contained
  • Outlined
  • Text

Example of usage:

   let containedButton = NatButton(style: .contained)
   let outlinedButton = NatButton(style: .outlined)
   let textButton = NatButton(style: .text)

This button has predefined height values with enum NatButton.Height:

   button.heightAnchor.constraint(equalToConstant: NatButton.Height.medium)

Requires

It’s necessary to configure the Design System with a theme or fatalError will be raised.

DesignSystem().configure(with: AvailableTheme)

Public properties

  • Undocumented

    Declaration

    Swift

    public override var isEnabled: Bool { get set }

Inits

Public methods

  • This method has the objective to set title for 2 states that aways have to be configured in NatButton as default behavior: Normal & Disabled.

    When this method is used, it configures title using an attributed string.

    If a different state or behavior is needed for configure a title, use native approuch like

    • setTitle(title: String?, for: UIControl.State)
    • setAttributedTitle(NSAttributedString?, for: UIControl.State)

    • title: This String will be used to configure Normal & Disabled states.

    Declaration

    Swift

    public func configure(title: String)
  • This method sets an icon at this button. Icons can be set at 2 sides, right & left. Example of usage:

       button.configure(getIcon(icon: .outlinedAlertNotification), position: .left)
    
    • icon: Choose an icon from NatDSIcons
    • position: This will be used to configure the icon alignmemt - it can be right or left side.

    Declaration

    Swift

    public func configure(icon: String?, position: Position)

Overrides

  • Undocumented

    Declaration

    Swift

    public override func touchesBegan(_ touches: Set<UITouch>, with event: UIEvent?)
  • Undocumented

    Declaration

    Swift

    public override func touchesEnded(_ touches: Set<UITouch>, with event: UIEvent?)
  • EdgeInsets is a enum that represents contentEdgeInsets values of button component.

    These are all `edgeInsets allowed for a NatButton:

    • small
    • medium (default)
    • large

    Example of usage:

       let button = NatButton(style: .contained)
       button.contentEdgeInsets = NatButton.EdgeInsets.medium
    

    Requires

    It’s necessary to configure the Design System with a theme or fatalError will be raised.

    DesignSystem().configure(with: AvailableTheme)

    See more

    Declaration

    Swift

    public enum EdgeInsets
  • Height is a enum that represents height values for the button component.

    These are all sizes allowed for a NatButton:

    • small
    • medium (should be default)
    • large

    Example of usage:

       button.heightAnchor.constraint(equalToConstant: NatButton.Height.medium)
    

    Requires

    It’s necessary to configure the Design System with a theme or fatalError will be raised.

    DesignSystem().configure(with: AvailableTheme)

    See more

    Declaration

    Swift

    public enum Height
  • Undocumented

    See more

    Declaration

    Swift

    public enum ButtonHeight
  • Position is a enum that represents the icon side options for the button component.

    These are all positions allowed for a icon in NatButton:

    • right
    • left
    See more

    Declaration

    Swift

    public enum Position
  • Style is a enum that represents style values for the button component.

    These are all styles allowed for a NatButton:

    • contained
    • outlined
    • text

    Example of usage:

       let containedButton = NatButton(style: .contained)
       let outlinedButton = NatButton(style: .outlined)
       let textButton = NatButton(style: .text)
    

    Requires

    It’s necessary to configure the Design System with a theme or fatalError will be raised.

    DesignSystem().configure(with: AvailableTheme)

    See more

    Declaration

    Swift

    public struct Style