Android

Prebuilt checkout page

1.Create a Customer

Pass a customerId to MoneyCollect and attach it to the customer.

   // Use your customerId 
   var customerId = "cus_1452880617225281538"

2.Construct data, and pay in PaymentSheet model

When creating a payment method, you can specify customer parameters to automatically attach the payment method to an existing customer.

//RequestCreatePayment object
   var testRequestPayment = TestRequestData.testRequestPayment
   //RequestConfirmPayment object
   var testConfirmPayment = TestRequestData.testConfirmPayment
   //RequestPaymentMethod object
   var testRequestPaymentMethod = TestRequestData.testRequestPaymentMethod
   //support payment credit card
   var testBankIvList = TestRequestData.testBankIvList
   //customerId
   var customerId = TestRequestData.customerId

   //build Bundle object
    var bundle = Bundle()

   //pass currentPaymentModel
   bundle.putSerializable(Constant.CURRENT_PAYMENT_MODEL,currentPaymentModel)
   //pass RequestCreatePayment
   bundle.putParcelable(Constant.CREATE_PAYMENT_REQUEST_TAG,testRequestPayment)
   //pass RequestConfirmPayment
   bundle.putParcelable(Constant.CONFIRM_PAYMENT_REQUEST_TAG,testConfirmPayment)
   //pass customerId
   bundle.putString(Constant.CUSTOMER_ID_TAG,TestRequestData.customerId)
   //pass default RequestPaymentMethod
   bundle?.putParcelable(Constant.CREATE_PAYMENT_METHOD_REQUEST_TAG,testRequestPaymentMethod)
   //pass default supportBankList
   bundle?.putSerializable(Constant.SUPPORT_BANK_LIST_TAG, testBankIvList)

   //PayCardActivity contain SaveWithPaymentCardFragment and AddWithPaymentFragment,Support them to switch to each other
   var intent = Intent(this, PayCardActivity::class.java)
   intent.putExtra(CURRENT_PAYMENT_BUNDLE, bundle)   
   //start payment
   startActivityLauncher.launch(intent)

TestRequestData details please refer to TestRequestData data class under MoneycollectSDK Demo.

3.Pay in Hosted Payment Page Mode

1. Tap Checkoutbutton to pay in Hosted Payment Page mode.

2. In Hosted payment page，select the previously saved card or add a new card.

3. Finally, tap the Pay Now button to complete the payment.

4.Customer selects "save this card" during payment

4.1 Select Save this card for your future use on the Add a new card page.

var testRequestPayment = RequestCreatePayment(
       // ...
       paymentMethod = paymentMethodId,
       preAuth = "n",
       receiptEmail = email,
       returnUrl = "http://localhost:8080/return",
       setupFutureUsage = "on",
       // ...
)

Select the payment card in the future, when setupFutureUsage set to on.

4.2 Click Add a new card.

4.3 After creating a new payment method and attaching it to customer, the card details will be saved to customer.

5.Return the payment result

 private val startActivityLauncher: ActivityResultLauncher<Intent> =
        registerForActivityResult(ActivityResultContracts.StartActivityForResult()) {
            //selected paymentmethods's list
            if (it.resultCode == Constant.PAYMENT_RESULT_CODE) {
                var payment =
                    it.data?.getParcelableExtra<Payment>(Constant.PAYMENT_RESULT_PAYMENT)
                if (payment != null) {
                    when (payment.status) {
                        Constant.PAYMENT_SUCCEEDED -> {
                            Log.e(TAG, Constant.PAYMENT_SUCCEEDED)
                        }
                        Constant.PAYMENT_FAILED -> {
                            payment?.errorMessage?.let { it1 ->
                                Log.e(TAG, it1)
                            }
                        }
                        Constant.PAYMENT_UN_CAPTURED -> {
                            Log.e(TAG, Constant.PAYMENT_UN_CAPTURED_MESSAGE)
                        }
                        Constant.PAYMENT_PENDING -> {
                            Log.e(TAG, Constant.PAYMENT_PENDING_MESSAGE)
                        }
                        Constant.PAYMENT_CANCELED -> {
                            Log.e(TAG, Constant.PAYMENT_CANCELED_MESSAGE)
                        }
                        else -> {
                            Log.e(TAG, Constant.PAYMENT_PENDING_MESSAGE)
                        }
                    }
                }
            }

        }

Custom payment flow

1.Create a Customer

Pass a customerId to MoneyCollect and attach it to the customer.

// Use your customerId 
   var customerId = "cus_1452880617225281538"

2.Construct data, and add payment methods with PaymentSheet customizable models

When creating a payment method, you can specify customer parameters to automatically attach the payment method to an existing customer.

   //the address of create paymentmethod
    var address = Address(
          line1 = "123 Main Street",
          line2 = "number456",
          city = "Blackrock",
          state = "Co. Dublin",
          postalCode = "T37 F8HK",
          country = "IE",
    )

    //the BillingDetails of create paymentmethod
    var billingDetails = RequestPaymentMethod.BillingDetails(
          address,
          email = "[e-mail]",
          firstName = "John",
          lastName = "Doe",
          phone = "[phone]"
    )

    //RequestPaymentMethod object
    var  testRequestPaymentMethod=RequestPaymentMethod(
         "card",
         billingDetails,
         null
    )

    //support payment credit card
    var testBankIvList= arrayListOf(
         R.drawable.mc_card_visa,
         R.drawable.mc_card_mastercard,
         R.drawable.mc_card_ae,
         R.drawable.mc_card_jcb,
         R.drawable.mc_card_dinner,
         R.drawable.mc_card_discover,
         R.drawable.mc_card_maestro
   )

   //build Bundle 
    var bundle = Bundle()

    //pass currentPaymentModel
    bundle.putSerializable(Constant.CURRENT_PAYMENT_MODEL, MoneyCollectPaymentModel.ATTACH_PAYMENT_METHOD)

    //pass customerId 
    bundle.putString(Constant.CUSTOMER_ID_TAG,customerId)

    //pass default RequestPaymentMethod
    bundle?.putParcelable(Constant.CREATE_PAYMENT_METHOD_REQUEST_TAG, testRequestPaymentMethod)

    //pass default supportBankList
    bundle?.putSerializable(Constant.SUPPORT_BANK_LIST_TAG,testBankIvList)

    //SaveCardActivitycontain SaveCardFragment and AddCardFragment,Support them to switch to each other
    var intent = Intent(this, SaveCardActivity::class.java)
    intent.putExtra(Constant.CURRENT_PAYMENT_BUNDLE, bundle)
    //start payment
    startActivityLauncher.launch(intent)

3.Customer selects save this card for your future use during payment

3.1 Select Save this card for your future useon the Add a card page.

var testRequestPayment = RequestCreatePayment(
       // ...
       paymentMethod = paymentMethodId,
       preAuth = "n",
       receiptEmail = email,
       returnUrl = "http://localhost:8080/return",
       setupFutureUsage = "on",
       // ...
)

You can use the payment card in the future whensetupFutureUsage set to on, otherwise setting to off.

3.2 Click Add a card.

3.3 After creating a payment method and attaching the payment method to customer, the card details will be saved to the customer.

4.Customer selects the card to make payment

Click on the Pay Now button to complete the transaction.

5.Return the payment result

The payment result is obtained by calling the confirmPayment API for payment confirmation, and then the result data is passed to the component.

  moneyCollect.confirmPayment(requestConfirmPayment, payment.clientSecret,
                object : ApiResultCallback<Payment> {
                    override fun onSuccess(result: Payment) {
                            isLoadingAnimStatus = false
                            viewBinding?.paymentCheckoutBtn?.setCardConfirmButtonStatus(true)
                            if (result.status.equals(Constant.PAYMENT_SUCCEEDED)) {
                                viewBinding?.paymentCheckoutBtn?.setMoneyCollectButtonViewContext(null)
                                viewBinding?.paymentCheckoutBtn?.setMoneyCollectButtonViewModel(moneyCollectPaymentModel)
                                viewBinding?.paymentCheckoutBtn?.showAnimByPaymentCompleteAndRefresh()
                            } else {
                                viewBinding?.paymentCheckoutBtn?.stopPaymentAnim()
                            }
                            when (result.status) {
                                Constant.PAYMENT_SUCCEEDED -> {
                                }
                                Constant.PAYMENT_FAILED -> {
                                    viewBinding?.paymentErrorMessageTv?.setText(result.errorMessage)
                                }
                                Constant.PAYMENT_UN_CAPTURED -> {
                                    viewBinding?.paymentErrorMessageTv?.setText(Constant.PAYMENT_UN_CAPTURED_MESSAGE)
                                }
                                Constant.PAYMENT_PENDING -> {
                                    viewBinding?.paymentErrorMessageTv?.setText(Constant.PAYMENT_PENDING_MESSAGE)
                                }
                                Constant.PAYMENT_CANCELED -> {
                                    viewBinding?.paymentErrorMessageTv?.setText(Constant.PAYMENT_CANCELED_MESSAGE)
                                }
                                else -> {
                                    viewBinding?.paymentErrorMessageTv?.setText(Constant.PAYMENT_PENDING_MESSAGE)
                                }
                            }
                    }

                    override fun onError(e: Exception) {
                        isLoadingAnimStatus = false
                        viewBinding?.paymentCheckoutBtn?.stopPaymentAnim()
                        viewBinding?.paymentCheckoutBtn?.setCardConfirmButtonStatus(true)
                        viewBinding?.paymentErrorMessageTv?.visibility == View.VISIBLE
                        viewBinding?.paymentErrorMessageTv?.setText(e.message)
                    }
                })