TTBaseUIButton

Core

Feature-rich UIButton subclass with 7 style types, built-in loading indicator, skeleton loading, highlighted color state management, icon support (AwesomePro), and chainable API. All buttons automatically get shake animation on tap and fire through a clean closure-based onTouchHandler.


🎨 Button Types

public enum TYPE {
    case NO_BG_COLOR                              // Transparent background
    case DEFAULT                                   // ViewConfig.buttonBgDef color (blue default)
    case ICON                                      // Icon-only button
    case DISABLE                                   // Dimmed, non-interactive
    case BORDER                                    // White bg + colored border
    case WARRING                                   // ViewConfig.buttonBgWar color (red/orange)
    case DEFAULT_COLOR(color: UIColor, textColor: UIColor) // Custom colors
}
TypeBackgroundBorderUse Case
.DEFAULTViewConfig.buttonBgDef (blue)NonePrimary actions: submit, continue, login
.WARRINGViewConfig.buttonBgWar (red/orange)NoneDestructive: delete, remove, cancel
.BORDERWhite/clearColored borderSecondary actions, outline buttons
.NO_BG_COLORTransparentNoneText-only actions, navigation links
.DISABLE50% opacityNoneNon-interactive state
.ICONTransparentNoneImage-only icon buttons
.DEFAULT_COLOR(color:textColor:)Custom colorNoneBranding-specific buttons

🚀 Usage

Basic Buttons

// Default blue button
let loginBtn = TTBaseUIButton(textString: "Sign In", type: .DEFAULT)

// Warning/danger button
let deleteBtn = TTBaseUIButton(textString: "Delete Account", type: .WARRING)

// Border outline button
let cancelBtn = TTBaseUIButton(textString: "Cancel", type: .BORDER)

// Custom color button
let customBtn = TTBaseUIButton(
    textString: "Premium",
    type: .DEFAULT_COLOR(color: .systemPurple, textColor: .white)
)

Touch Handler (closure-based)

let loginBtn = TTBaseUIButton(textString: "Sign In", type: .DEFAULT)
loginBtn.onTouchHandler = { button in
    // Called when button is tapped
    print("Button tapped: \(button.titleLabel?.text ?? "")")
    button.onStartLoadingAnimation()
    APIService.login { result in
        button.onStopLoadingAnimation()
    }
}

With Fixed Size

// Button with default width (147pt) and height (50pt from SizeConfig.H_BUTTON)
let fixedBtn = TTBaseUIButton(
    textString: "Submit",
    type: .DEFAULT,
    isSetSize: true
)

// Button with only fixed height
let heightBtn = TTBaseUIButton(
    textString: "Continue",
    type: .DEFAULT,
    isSetHeight: true
)

Loading Animation

let submitBtn = TTBaseUIButton(textString: "Submit", type: .DEFAULT)
submitBtn.onTouchHandler = { button in
    // Show loading spinner, hide text, disable interaction
    button.onStartLoadingAnimation()

    APIService.submit { result in
        // Re-enable button, show text, hide spinner
        button.onStopLoadingAnimation()
    }
}

Enable / Disable

// Disable button (dims to 50% opacity)
submitBtn.setNonEnable()

// Re-enable
submitBtn.setEnable()

// Enable after 5-second delay (prevents accidental double-tap)
submitBtn.setEnableWithDelay()

Button with Icon (AwesomePro)

let iconBtn = TTBaseUIButton(textString: "Settings", type: .DEFAULT)
iconBtn.setIconImage(
    iconName: "fa-gear",   // Font Awesome Pro name
    color: .white,
    padding: 8
)

Button Badge (notification dot)

// A button variant with a notification badge count overlay
let cartBtn = TTBaseUIButton(textString: "Cart", type: .DEFAULT)
// Use BaseButtonBadge for badge support
let badgeCartBtn = BaseButtonBadge()
badgeCartBtn.setBadgeCount(3)

📖 API Reference

MethodReturnsDescription
setText(text:)TTBaseUIButtonSet button title
setTextColor(color:)TTBaseUIButtonSet title color (+ highlighted state)
setBgColor(color:)TTBaseUIButtonSet background color
setDefaultType()TTBaseUIButtonApply default style
setWarringType()TTBaseUIButtonApply warning/danger style
setBorderType()TTBaseUIButtonApply bordered outline style
setNoBgType()TTBaseUIButtonMake transparent button
setEnable()TTBaseUIButtonEnable interaction (full opacity)
setNonEnable()VoidDisable (50% opacity, non-interactive)
setEnableWithDelay()VoidRe-enable after 5s delay
setImage(imageNameString:color:)VoidSet image from asset name
setIconImage(iconName:color:padding:)VoidSet AwesomePro icon by name
setHidden() / setNonHidden()TTBaseUIButtonToggle visibility (chainable)
setTextAligment(alignment:)TTBaseUIButtonSet horizontal text alignment
resetBorderCorner()TTBaseUIButtonRemove corner and clip mask
onStartLoadingAnimation(withStyle:)VoidShow UIActivityIndicatorView, hide title
onStopLoadingAnimation()VoidHide indicator, restore text, re-enable
onAddSkeletonMark()VoidShow skeleton placeholder
onRemoveSkeletonMark()VoidRemove skeleton

⚙️ Configuration

// Customize button default colors in AppDelegate
TTBaseUIKitConfig
    .withDefaultConfig()
    .withViewConfig(
        TTBaseUIKitViewConfig(
            buttonBgDef: UIColor(hex: "#0066CC"),  // Default button bg
            buttonBgWar: UIColor(hex: "#E53E3E"),  // Warning button bg
            buttonBgBorder: UIColor(hex: "#0066CC") // Border color
        )
    )
    .start()

📐 Size Configuration

// Button height is controlled by SizeConfig.H_BUTTON
// Default: 50pt on all devices
TTBaseUIKitConfig
    .withDefaultConfig()
    .withSizeConfig(
        TTBaseUIKitSizeConfig(
            H_BUTTON: 52,          // Button height
            H_TEXTFIELD: 44        // TextField height
        )
    )
    .start()
Pro Tip: Buttons automatically get a subtle shakeAnimation() on tap for tactile feedback. The highlighted color is auto-calculated at 30% opacity from the title color. Both effects are configurable via StyleConfig.