Android SDK | Wonder Developer Documentation

The Android SDK lets you embed Wonder Payment Gateway's payment flow into your Android application.

Workflow

Initiate the Android SDK

To initiate the SDK, you need to know:

Set up the Payment Configurations. Retrieve appID as a first step when initiating the SDK when you onboard on Wonder, in order to get access to our Payment Gateway configurations.
For Android SDK, Wechat Pay and Google Pay, you will be required to apply directly with the schemes to obtain the unique identifier, for the activation of those methods.
To set up a method for future payments, you must generate a customer UUID for the Tokenisation process.
Customer can opt to customise the UI of the payment elements, or follow the default UI settings.

Gradle

The SDK requires two Gradle changes: one adds the Wonder Maven repository (project-level), the other declares the SDK dependency (app-level). Both are required.

Add the repository

Add the Wonder Maven repository in your project-level build.gradle:

text

dependencyResolutionManagement {
  repositories {
    mavenCentral()
    maven {
      url 'https://raw.githubusercontent.com/wonder-sources/WonderPayment-Android/master'
    }
  }
}

Add the SDK dependency

Add the SDK dependency in your app-level build.gradle:

text

dependencies {
  implementation 'com.wonder.payment.sdk:wonderpayment-android:v1.x.x'
}

AndroidManifest.xml

Register a result Activity for each third-party payment channel you use. Each channel redirects back to your app through its own Activity and URL scheme. Only add the ones you actually enable.

Wechat Pay
Create an empty Activity in the application package name directory:

text

<activity-alias
    android:name=".wxapi.WXPayEntryActivity"
    android:exported="true"
    android:targetActivity="com.wonder.payment.sdk.wxapi.WXPayEntryResultActivity" />

Alipay Auto Debit

text

<activity
    android:name="com.wonder.payment.sdk.activity.AlipayResultActivity"
    android:exported="true"
    android:launchMode="singleTask"
    android:taskAffinity="${applicationId}"
    android:theme="@android:style/Theme.Translucent.NoTitleBar">
    <intent-filter>
        <action android:name="android.intent.action.VIEW" />
        <category android:name="android.intent.category.DEFAULT" />
        <category android:name="android.intent.category.BROWSABLE" />
        <data
            android:host="alipay"
            android:scheme="paydemo" />
    </intent-filter>
</activity>

Payme

text

<activity
    android:name="com.wonder.payment.sdk.activity.PaymeResultActivity"
    android:exported="true"
    android:launchMode="singleTask"
    android:taskAffinity="${applicationId}"
    android:theme="@android:style/Theme.Translucent.NoTitleBar">
    <intent-filter>
        <action android:name="android.intent.action.VIEW" />
        <category android:name="android.intent.category.DEFAULT" />
        <category android:name="android.intent.category.BROWSABLE" />
        <data
            android:host="payme"
            android:scheme="paydemo" />
    </intent-filter>
</activity>

INFO

paydemo here must match fromScheme in your payment config.

proguard-rules.pro

Required only if code obfuscation is enabled in your project. Without these rules, the SDK's reflection-based classes will be renamed and crash at runtime.

text

-keep class com.wonder.payment.sdk.** { *;}
-keep class com.google.gson.reflect.TypeToken { *; }
-keep class * extends com.google.gson.reflect.TypeToken

Android SDK configuration

The Android SDK takes 2 configuration objects:

Object	Controls	Example
PaymentConfig	How the payment behaves — merchant identity, environment, payment methods.	`appId`,`environment`,`googlePay`.
UIConfig	How the checkout looks — colors, radius, interaction style	`background`,`borderRadius`.

text

WonderPayment.initConfig(
  PaymentConfig(
    appId = "f3615c8b-e402-48ac-bcd9-5af7a473ebdc",
    customerId = "87d8f5a5-e745-456d-938e-065bb77cedc7",
    environment = PaymentEnv.STAGING,
    locale = Locale.US,
    fromScheme = "paydemo",
    wechatAppId = "wx5ac0eb5676b32e80",
    googleConfig = GoogleConfig(
        countryCode = "HK",
        currencyCode = "HKD",
        merchantId = "BRC2DN4H8T7I76EZ",
        merchantName = "Jek Limited"
    ),
  ),
  UIConfig(
    background = Color.BLACK,
    secondaryBackground = Color.LTGRAY,
    primaryTextColor = Color.WHITE,
    secondaryTextColor = Color.LTGRAY,
    primaryButtonColor = Color.BLUE,
    primaryButtonBackground = Color.BLACK,
    secondaryButtonColor = Color.GREEN,
    secondaryButtonBackground = Color.WHITE,
    textFieldBackground = Color.DKGRAY,
    linkColor = Color.BLUE,
    successColor = Color.GREEN,
    borderColor = Color.CYAN,
    dividerColor = Color.RED,
    errorColor = Color.RED,
    borderRadius = 12.0f,
    displayStyle = DisplayStyle.ONE_CLICK,
    showResult = true,
    paymentRetriesEnabled = true
  )
)

PaymentConfig

Field	Required	Description
appId	`Yes`	The APP ID generated on Wonder Dashboard.
customerId	`No`	Needed for tokenisation. Create via create customerAPI.
fromscheme	`Yes`	Used to redirect back to your app after app-to-app payment.
environment	`No`	Available parameter:`PaymentEnv.STAGING`, `PaymentEnv.ALPHA`,`PaymentEnv.PRODUCTION`.
locale	`No`	Available parameter:`Locale.CHINA`, `Locale.HONG_KONG`,`Locale.US`.
wechatAppId	`No`	Enable WeChat Pay. The appId applied on WeChat Pay.
googleConfig	`No`	Enable Google Pay.
GoogleConfig.countryCode	`Yes`	ISO 3166-1 alpha-2 country code where the transaction is processed.
GoogleConfig.currencyCode	`Yes`	The ISO 4217 alphabetic currency code.
GoogleConfig.merchantId	`Yes`	A Google merchant identifier issued after registration with the Google Pay & Wallet Console.
GoogleConfig.merchantName	`Yes`	Merchant name encoded as UTF-8. Merchant name is rendered in the payment sheet.

UIConfig

Field	Required	Description
background	`No`	Default: #FFFFFF
secondaryBackground	`No`	Default: #F7F8F9
primaryTextColor	`No`	Default: #000000
secondaryTextColor	`No`	Default: #8E8E93
primaryButtonColor	`No`	Default: #FFFFFF
primaryButtonBackground	`No`	Default: #000000
secondaryButtonColor	`No`	Default: #000000
secondaryButtonBackground	`No`	Default: #FFFFFF
textFieldBackground	`No`	Default: #F5F5F5
linkColor	`No`	Default: #0094FF
successColor	`No`	Default: #4CD964
borderColor	`No`	Default: #565656
dividerColor	`No`	Default: #EBEFF2
errorColor	`No`	Default: #FC2E01
borderRadius	`No`	Default: 12.0
displayStyle	`No`	`confirm`,`oneClick`. Default:`oneClick`.
paymentRetriesEnabled	`No`	If payment fails, whether the user can try again or return a failed result.

Payment

Wonder support 2 ways to make payment.

Field	Required	Description
amount	`Yes`	Order amount.
currency	`Yes`	Order currency.
orderNumber	`Yes`	Order number.
paymentMethod	`No`	Not needed when calling `present`; required when calling `pay`.
supportedPaymentModes	`No`	Supported payment modes. Available parameter: `preAuth`, `autoDebit`, `sale`.
lineItems	`No`	Order line item details.
status	`Output`	Available parameter: `completed`, `cancelled`, `failed`.
code	`Output`	If the payment goes wrong, an error code is returned.
message	`Output`	If the payment goes wrong, an error message is returned.

Present - Complete payment flow

Initialize a Payment Intent and complete payment immediately in one flow:

text

WonderPayment.present(
  this@MainActivity,
  PaymentIntent(1.0, "HKD", "orderNumber"),
) {
    Toast.makeText(this@MainActivity, it.toString(), Toast.LENGTH_LONG).show()
}

Select + pay — Alternative payment flow

2 steps for this flow are needed:

Step 1 - Select a payment method (no charge yet):

text

WonderPayment.select(this@MainActivity) {
    //paymentMethod
}

Step 2 - Start the payment:

text

paymentController = WonderPayment.pay(
    this@MainActivity,
    PaymentIntent(
        0.1,
        "HKD",
        "orderNumber",
        paymentMethod
    ),
) {
    //PaymentResult
}

INFO

Integrate third-party payments to get payment results.

text

// Use paymentController = WonderPayment.pay to add
override fun onActivityResult(requestCode: Int, resultCode: Int, data: Intent?) {
    super.onActivityResult(requestCode, resultCode, data)
    paymentController?.onActivityResult(requestCode, resultCode, data)
}

Preview — Preview payment method

View current payment methods and add a verified credit card.

text

WonderPayment.preview(this@MainActivity)