Payment button

PaymentButton is a UIButton subclass that shows a branded Afterpay call to action. Present a checkout when the customer taps it.

Add the button

let paymentButton = PaymentButton(
  colorScheme: .static(.default),
  buttonKind: .checkout
)
paymentButton.addTarget(
  self,
  action: #selector(didTapPayWithAfterpay),
  for: .touchUpInside
)
view.addSubview(paymentButton)

Both initializer parameters are optional. The defaults are .static(.default) and .buyNow. You can also change colorScheme and buttonKind after you create the button.

Visibility

PaymentButton doesn’t hide itself when Afterpay.enabled is false. It blanks its artwork but keeps its size and stays tappable. Hide it yourself:

paymentButton.isHidden = !Afterpay.enabled

Size the button

The button keeps a fixed aspect ratio, so set its width and let the height follow. To keep the text legible, the button has a minimum width of 256 points. The button turns off translatesAutoresizingMaskIntoConstraints, so position it with Auto Layout constraints.

Button kinds

Set buttonKind to change the button’s text:

Kind	Button
.buyNow
.checkout
.payNow
.continueWith

For US merchants, the Cash App Afterpay buttons for these kinds read “Buy with”, “Checkout with”, “Pay with”, and “Continue with”.

Color schemes

The button supports the .default, .alt, .darkMono, and .lightMono palettes. For examples and guidance on which background to use each one on, see Color schemes.

paymentButton.colorScheme = .dynamic(
  lightPalette: .default,
  darkPalette: .alt
)

Start a checkout

The button doesn’t start a checkout by itself. In its action, present the checkout that fits your integration. For example, for Web Redirect, after you get a checkout URL from your server:

@objc func didTapPayWithAfterpay() {
  Afterpay.presentCheckoutModally(
    over: self,
    loading: checkoutURL
  ) { result in
    self.handleCheckoutResult(result)
  }
}

For each option, see Present checkout.