Android – Integrate Razorpay Payment Gateway with Kotlin
Many applications nowadays collect payments from their app users for selling some products or selling services within their android applications. There are so many payment gateways available in the market which we can use within our application to collect payments from users such as Razorpay, PayU money, and many more. In this article, we will take a look at How to integrate Razorpay Payment Gateway into the android application using Kotlin. A sample video is given below to get an idea about what we are going to do in this article.
Note: If you are looking to implement RazorPay payment gateway in the android application using Java. Check out the following article: How to integrate Razorpay Payment Gateway in Android using Java
Step by Step Implementation
Step 1: Create a New Project in Android Studio
To create a new project in Android Studio please refer to How to Create/Start a New Project in Android Studio. Note that select Kotlin as the programming language.
Step 2: Add dependency of Razor pay library in build.gradle file
Navigate to the Gradle Scripts > build.gradle(Module:app) and add the below dependency in the dependencies section.
implementation 'com.razorpay:checkout:1.6.4'
After adding this dependency sync your project.
Step 3: Adding permissions to the Internet
Navigate to the app > AndroidManifest.xml file and add the below code to it.
XML
< uses-permission android:name = "android.permission.INTERNET" /> |
Step 4: Working with the activity_main.xml file
Navigate to the app > res > layout > activity_main.xml and add the below code to that file. Below is the code for the activity_main.xml file.
XML
<? xml version = "1.0" encoding = "utf-8" ?> <!--on below line we are creating a swipe to refresh layout--> < RelativeLayout xmlns:android = "http://schemas.android.com/apk/res/android" xmlns:tools = "http://schemas.android.com/tools" android:layout_width = "match_parent" android:layout_height = "match_parent" android:fillViewport = "true" android:orientation = "vertical" tools:context = ".MainActivity" > <!--text view for displaying heading--> < TextView android:id = "@+id/idTVHead" android:layout_width = "match_parent" android:layout_height = "wrap_content" android:layout_above = "@id/idEdtAmt" android:layout_margin = "4dp" android:gravity = "center" android:padding = "4dp" android:text = "@string/app_name" android:textAlignment = "center" android:textColor = "@color/purple_200" android:textSize = "20sp" android:textStyle = "bold" /> <!--edit text for adding payment amount--> < EditText android:id = "@+id/idEdtAmt" android:layout_width = "match_parent" android:layout_height = "wrap_content" android:layout_centerInParent = "true" android:layout_centerHorizontal = "true" android:layout_marginStart = "20dp" android:layout_marginTop = "10dp" android:layout_marginEnd = "20dp" android:layout_marginBottom = "10dp" android:hint = "Enter Amount" /> <!--button for making payment--> < Button android:id = "@+id/idBtnMakePaymanet" android:layout_width = "match_parent" android:layout_height = "wrap_content" android:layout_below = "@id/idEdtAmt" android:layout_marginStart = "20dp" android:layout_marginTop = "10dp" android:layout_marginEnd = "20dp" android:padding = "4dp" android:text = "Make Payment" android:textAllCaps = "false" /> </ RelativeLayout > |
Step 5: Generating an API key for using Razorpay
Browser the Razorpay site in Google or you can click on the link here. After clicking on this link you simply have to signup with your email and password and add some basic information such as your phone number.
Note: Here we are creating a testing credential for using RazorPay.
Inside the setting screen, click on Create a new key option your key will be generated. We will be using key ID in our application to test Razor pay. The key-id will start with rzp_test
Step 6: Working with the MainActivity.kt file
Go to the MainActivity.kt file and refer to the following code. Below is the code for the MainActivity.kt file. Comments are added inside the code to understand the code in more detail.
Kotlin
package com.gtappdevelopers.kotlingfgproject import android.os.Bundle import android.widget.Button import android.widget.EditText import android.widget.Toast import androidx.appcompat.app.AppCompatActivity import com.razorpay.Checkout import com.razorpay.PaymentResultListener import org.json.JSONException import org.json.JSONObject class MainActivity : AppCompatActivity(), PaymentResultListener { // on below line we are creating // variables for our edit text and button lateinit var amtEdt: EditText lateinit var payBtn: Button override fun onCreate(savedInstanceState: Bundle?) { super .onCreate(savedInstanceState) setContentView(R.layout.activity_main) // on below line we are initializing // our variable with their ids. amtEdt = findViewById(R.id.idEdtAmt) payBtn = findViewById(R.id.idBtnMakePaymanet) // on below line adding click listener for pay button payBtn.setOnClickListener { // on below line getting amount from edit text val amt = amtEdt.text.toString() // rounding off the amount. val amount = Math.round(amt.toFloat() * 100 ).toInt() // on below line we are // initializing razorpay account val checkout = Checkout() // on the below line we have to see our id. checkout.setKeyID( "Enter your key here" ) // set image checkout.setImage(R.drawable.android) // initialize json object val obj = JSONObject() try { // to put name obj.put( "name" , "Beginner for Beginner" ) // put description obj.put( "description" , "Test payment" ) // to set theme color obj.put( "theme.color" , "" ) // put the currency obj.put( "currency" , "INR" ) // put amount obj.put( "amount" , amount) // put mobile number obj.put( "prefill.contact" , "9284064503" ) // put email obj.put( "prefill.email" , "chaitanyamunje@gmail.com" ) // open razorpay to checkout activity checkout.open( this @MainActivity , obj) } catch (e: JSONException) { e.printStackTrace() } } } override fun onPaymentSuccess(s: String?) { // this method is called on payment success. Toast.makeText( this , "Payment is successful : " + s, Toast.LENGTH_SHORT).show(); } override fun onPaymentError(p0: Int, s: String?) { // on payment failed. Toast.makeText( this , "Payment Failed due to error : " + s, Toast.LENGTH_SHORT).show(); } } |
Now run your application to see the output of it.
Output:
Contact Us