Mastering Payment Integration in Flutter: Step-by-Step Guide for Razorpay Integration - deesoft service

Mastering Payment Integration in Flutter: Step-by-Step Guide for Razorpay Integration

Deepak Tailor Image
Deepak Tailor - Jul 23 2023
Mastering Payment Integration in Flutter: Step-by-Step Guide for Razorpay Integration

As of my last update in September 2021, Razorpay is a popular payment gateway in India that allows businesses to accept online payments. To integrate Razorpay into your Flutter app, you can follow these steps:

1. Add the Razorpay Flutter SDK to your pubspec.yaml file:

dependencies:
  flutter:
    sdk: flutter
  razorpay_flutter: ^1.2.6 # Check the latest version on pub.dev

2. Run flutter pub get to fetch the dependencies.

3. Import the Razorpay package in your Dart code:

import 'package:razorpay_flutter/razorpay_flutter.dart';

Initialize the Razorpay instance in your app (typically inside the initState method of your StatefulWidget):

Razorpay _razorpay;

@override
void initState() {
  super.initState();
  _razorpay = Razorpay();
  _razorpay.on(Razorpay.EVENT_PAYMENT_SUCCESS, _handlePaymentSuccess);
  _razorpay.on(Razorpay.EVENT_PAYMENT_ERROR, _handlePaymentError);
  _razorpay.on(Razorpay.EVENT_EXTERNAL_WALLET, _handleExternalWallet);
}

@override
void dispose() {
  _razorpay.clear();
  super.dispose();
}

Implement the callback functions for payment success, error, and external wallet:

void _handlePaymentSuccess(PaymentSuccessResponse response) {
// Handle payment success here
}

void _handlePaymentError(PaymentFailureResponse response) {
// Handle payment failure here
}

void _handleExternalWallet(ExternalWalletResponse response) {
// Handle external wallet payments (e.g., Paytm) here
}

Create a function to initiate the payment:

void _startPayment() {
    var options = {
        'key': 'YOUR_RAZORPAY_KEY',
        'amount': 10000, // amount in paise (10000 paise = ?100)
        'name': 'Your Company Name',
        'description': 'Test Payment',
        'prefill': {'contact': '1234567890', 'email': 'test@example.com'},
        'external': {
        'wallets': ['paytm'] // You can add other wallets if required
        }
    };

    try {
        _razorpay.open(options);
    } catch (e) {
        debugPrint('Error: ${e.toString()}');
    }
}

Create a UI to trigger the payment, such as a button:

RaisedButton(
  onPressed: _startPayment,
  child: Text('Make Payment'),
),

Make sure to replace 'YOUR_RAZORPAY_KEY' with your actual Razorpay API key. You can find this key in your Razorpay Dashboard after creating an account and setting up your business.

Always refer to the official documentation or the official GitHub repository for the latest updates and changes to the SDK: https://pub.dev/packages/razorpay_flutter

Deepak Tailor Image
Deepak Tailor

My name is Deepak tailor as a fullstack developer. I have been in the IT industry (PHP, Nodejs, flutter) for the last 5 years. For professional and customize web development & app development, you can send inquiry on our email.
----
You can contact him at deepaktailor10@yahoo.in