Razorpay Custom UI integration

Question

I am trying to integrate a custom UI for razorpay using the documentation below: https://razorpay.com/docs/payments/payment-gateway/android-integration/custom/build-integration/ But I don't want to display the following page when I call the submit function by passing payload details, and instead start the payment flow directly Can anyone guide me how to go about this?

This is the code I wrote for upi intent

 razorpay = Razorpay(activity, RAZORPAY_APP_KEY_ID)
 razorpay?.setWebView(binding.razorpayWebview)
 try {
     payload = JSONObject(
     "{currency: 'INR'}"
     )
     payload?.put("amount", amount * 100)
     payload?.put("order_id", orderId)
     payload?.put("contact", mobile)
     payload?.put("email", email_id)
     payload?.put("display_logo", true)
     payload?.put("method", "upi")
     payload?.put("vpa", vpa)
     sendRequest()
} catch (e: Exception) {
     e.printStackTrace()
}

    private fun sendRequest() {
        razorpay?.validateFields(payload, object : ValidationListener {
            override fun onValidationSuccess() {
                try {
                    binding.razorpayWebview.show()

                    razorpay?.submit(payload, object : PaymentResultWithDataListener {
                        override fun onPaymentSuccess(p0: String?, p1: PaymentData?) {
                            clearFields()
                            try {
                                binding.razorpayWebview.hide()
                            } catch (e: Exception) {
                                toastMessage("Exception in onPaymentSuccess $e")
                            }
                        }

                        override fun onPaymentError(p0: Int, p1: String?, p2: PaymentData?) {
                            clearFields()
                            try {
                                binding.razorpayWebview.hide()
                            } catch (e: Exception) {
                                toastMessage("Exception in onPaymentError $e")
                            }
                        }
                    })

                } catch (e: Exception) {
                    Log.e("razorpay error", "Exception: ", e)
                }
            }

            override fun onValidationError(error: Map<String?, String>) {
                Log.d(
                    "com.example",
                    "Validation failed: " + error["field"] + " " + error["description"]
                )
            }
        })
    }

I think this is possible because I've seen never seen it in apps like bookmyshow, zomato, swiggy, etc. They also come with custom.

Answer 1

You can follow this Razorpay sample easily for Custom UI of razorpay. They updated the SDK recently. Check once.

Github Sample: https://github.com/razorpay/razorpay-android-custom-sample-app

Razorpay Documentation: https://razorpay.com/docs/payments/payment-gateway/android-integration/custom/