Logo

The SDK provides two logo views:

• AfterpayLockup: the logo lockup. It shows the Afterpay wordmark, or the Clearpay wordmark for UK merchants. For US merchants, it shows the Cash App Afterpay lockup: the Cash App icon next to the Afterpay wordmark.
• AfterpayBadge: the Afterpay or Clearpay badge for merchants outside the US. It’s always hidden for US merchants.

Before you add a logo, set the merchant configuration. The logo views read the configuration only when you create them or set their style. See UI components.

Add the lockup

<com.afterpay.android.view.AfterpayLockup
  android:layout_width="120dp"
  android:layout_height="wrap_content"
  app:afterpayStyle="default_style" />

The lockup scales to the width you give it and keeps its aspect ratio. Its minimum width is 64dp.

The view sets its content description to the brand name and is focusable, so screen readers announce it.

Lockup styles

The lockup has no background, so choose a style that contrasts with the color behind it. The default style is Default.

Style	XML value	Use on	Appearance
AfterpayWidgetStyle.Default	default_style	Light backgrounds
AfterpayWidgetStyle.Alt	alt	Dark backgrounds
AfterpayWidgetStyle.MonochromeDark	monochromeDark	Dark backgrounds
AfterpayWidgetStyle.MonochromeLight	monochromeLight	Light backgrounds

The lockup shows the wordmark in the foreground color of the matching color scheme, so Default and MonochromeLight look the same. UK merchants see the Clearpay wordmark in the same colors.

For US merchants, Default and Alt render the full-color Cash App Afterpay lockup, with the Cash App icon in Cash App green, and the background guidance is reversed: use Default on dark backgrounds and Alt on light backgrounds. The monochrome styles render the lockup in a single color. See Styles and color schemes.

Add the badge

AfterpayBadge shows the Afterpay badge, or the Clearpay badge for UK merchants, on a colored background. With the Default style, the badge is mint with a black wordmark. It has the same style property and app:afterpayStyle attribute as the lockup, and a minimum width of 64dp.

<com.afterpay.android.view.AfterpayBadge
  android:layout_width="wrap_content"
  android:layout_height="wrap_content"
  app:afterpayStyle="default_style" />

Visibility

Both logo views hide themselves when the SDK isn’t enabled for the current configuration. See When components are hidden.

Attributes and properties