Skip to content

Default form styling

Last updated: December 21, 2022

Our default integration is the quickest way to display the forms required to collect payment information, with no customization required.

Localization support for the following languages is built into the default integration:

  • Arabic
  • Dutch
  • English
  • French
  • German
  • Italian
  • Romanian
  • Spanish

You can also add your own localized strings to add support for additional languages.

The default payment form

The default billing form

For basic customization, the PaymentDetailsStyle, BillingFormStyle, BillingAddressDetailsStyle and CountryPickerStyle objects expose properties that allow you to change the text and colors displayed on the forms.

1
// Create a default style
2
val paymentFormStyle = PaymentFormStyle()
3


4
// Create a custom input component style
5
val customInputComponentStyle = DefaultLightStyle.inputComponentStyle(
6
    titleTextId = R.string.custom_card_number_title,
7
    withLeadingIcon = true,
8
    margin = Margin(bottom = 16)
9
)
10


11
// Modify payment form style with custom input component style
12
paymentFormStyle.paymentDetailsStyle.cardNumberStyle.inputStyle = customInputComponentStyle
13


14
// Hide flag images for country picker
15
paymentFormStyle.billingFormStyle.countryPickerStyle.withFlag = false

See our project on GitHub.