Airwallex logo

Airwallex Native UI Integration

We provide native screens to facilitate the integration of payment functions. You can use these individually, or take all of the prebuilt UI in one flow by following the Integration guide.

  1. Initialize an Airwallex object, it’s the entry-point of the Airwallex SDK
val airwallex = Airwallex(this)
  1. Set up an ClientSecretProvider In your app, make your API client class implement the ClientSecretProvider interface, which defines a single method, createClientSecret(). When implementing this method, pass the customerId parameter along to your generate_client_secret endpoint. Consult our Example App to see this in practice.
class ExampleClientSecretProvider : ClientSecretProvider {

    private val api: Api
        get() {
            if (TextUtils.isEmpty(Settings.baseUrl)) {
                throw IllegalArgumentException("Base url should not be null or empty")
            }
            return ApiFactory(Settings.baseUrl).buildRetrofit().create(Api::class.java)
        }

    override fun createClientSecret(customerId: String, updateListener: ClientSecretUpdateListener) {
        CoroutineScope(Dispatchers.IO).launch {
            val response = kotlin.runCatching { api.createClientSecret(customerId) }
            withContext(Dispatchers.Main) {
                response.fold(
                    onSuccess = {
                        updateListener.onClientSecretUpdate(customerId, it.string())
                    },
                    onFailure = {
                        updateListener.onClientSecretUpdateFailure(it.message ?: "")
                    }
                )
            }
        }
    }
}

Edit shipping info

Use presentShippingFlow method to allow users to provide a shipping address as well as select a shipping method. shipping parameter is optional.

    airwallex.presentShippingFlow(shipping,
        object : Airwallex.PaymentShippingListener {
            override fun onSuccess(shipping: Shipping) {
                Log.d(TAG, "Save the shipping success")
            }

            override fun onCancelled() {
                Log.d(TAG, "User cancel edit shipping")
            }
        })

Use the entire Native UI in one flow

Use presentPaymentFlow method to complete the entire payment flow. Needs to pass in a PaymentIntent and ClientSecretProvider object

    private val clientSecretProvider by lazy {
        ExampleClientSecretProvider()
    }
    airwallex.presentPaymentFlow(paymentIntent, clientSecretProvider,
        object : Airwallex.PaymentIntentListener {
            override fun onSuccess(paymentIntent: PaymentIntent) {
                Log.d(TAG, "Confirm payment intent success")
            }

            override fun onFailed(exception: Exception) {
                Log.d(TAG, "Confirm payment intent failed")
            }

            override fun onCancelled() {
                Log.d(TAG, "User cancel confirm payment intent")
            }
        })

Custom Theme

You can overwrite these color values in your app .

    <!--   a secondary color for controls like checkboxes and text fields -->
    <color name="airwallex_color_accent">@color/color_accent</color>

    <!--   color for the app bar and other primary UI elements -->
    <color name="airwallex_color_primary">@color/color_primary</color>

    <!--   a darker variant of the primary color, used for
           the status bar (on Android 5.0+) and contextual app bars -->
    <color name="airwallex_color_primary_dark">@color/color_primary_dark</color>