Korapay Flutter

A native Flutter implementation of the Korapay payment checkout.

Features

  • Complete native Flutter implementation (no WebView)
  • Beautiful UI matching Korapay's design
  • Simple to integrate
  • Handles all payment flows (success, failure, cancellation)
  • Supports all Korapay currencies (NGN, USD, GHS)
  • Multiple payment methods (Card, Bank Transfer, Bank Payment)
  • Configurable theme and appearance

Installation

Add the following to your pubspec.yaml file:

dependencies:
  korapay_flutter: ^0.1.0

Then run:

flutter pub get

Usage

Import the package:

import 'package:korapay_flutter/korapay_flutter.dart';

There are two ways to integrate Korapay into your app:

Option 1: Use the Pre-built Payment UI (NEW!)

The simplest way to integrate Korapay is to use our pre-built UI component:

Navigator.push(
  context,
  MaterialPageRoute(
    builder: (context) => KorapayPaymentPage(
      publicKey: 'YOUR_KORAPAY_PUBLIC_KEY',
      title: 'Payment for Product',
      description: 'Payment for Product XYZ',
      onPaymentComplete: (response) {
        // Handle the payment response
        if (response.status == KorapayStatus.success) {
          // Payment was successful
          print('Payment successful! Reference: ${response.reference}');
        } else if (response.status == KorapayStatus.failed) {
          // Payment failed
          print('Payment failed: ${response.errorMessage}');
        }
      },
    ),
  ),
);

KorapayPaymentPage Options

Parameter Type Required Description
publicKey String Yes Your Korapay public key
isLiveMode bool No Whether to use live mode (default: false)
title String No Title of the transaction (default: 'Payment')
description String No Description of the transaction (default: 'Payment via Korapay')
onPaymentComplete Function(KorapayResponse)? No Callback when payment is completed
initialAmount String No Initial amount to show in the form (default: '1000')
initialCurrency String No Initial currency to select (default: 'NGN')
initialPaymentMethod String No Initial payment method (default: 'card')
primaryColor Color No Primary color for buttons and UI elements (default: Color(0xFF49ceb0))
showLiveToggle bool No Whether to show the live/test mode toggle (default: true)

Option 2: Create a Custom UI

Configure and initialize a payment with your own UI:

// Create a configuration for the payment
final config = KorapayConfig(
  key: 'YOUR_KORAPAY_PUBLIC_KEY',  // Your Korapay public key
  reference: 'UNIQUE_TRANSACTION_REFERENCE',  // A unique reference for this transaction
  amount: 1000.00,  // Amount to charge
  currency: 'NGN',  // Currency code (NGN, USD, GHS)
  customer: KorapayCustomer(
    name: 'John Doe',  // Customer's name
    email: 'john.doe@example.com',  // Customer's email
  ),
  // Optional parameters
  title: 'Payment for Product',  // Title of the transaction
  description: 'Payment for Product XYZ',  // Description of the transaction
  channels: ['card', 'bank_transfer', 'bank'],  // Payment methods to enable (default: ['card'])
);

// Initialize the payment
final response = await KorapayCheckout.checkoutPayment(
  context,  // BuildContext
  config,   // KorapayConfig object
  closeOnSuccess: true,  // Optional: Close the modal on successful payment
  loaderColor: Colors.blue,  // Optional: Custom loader color
);

// Handle the response
if (response.status == KorapayStatus.success) {
  // Payment was successful
  print('Payment successful! Reference: ${response.reference}');
} else if (response.status == KorapayStatus.cancelled) {
  // Payment was cancelled by the user
  print('Payment was cancelled');
} else {
  // Payment failed
  print('Payment failed: ${response.errorMessage}');
}

Example

Check out the example folder for a complete sample application.

Screenshots

Pre-built UI Payment Form Success
Pre-built UI Payment Form Success

Configuration Options

KorapayConfig

Parameter Type Required Description
key String Yes Your Korapay public key
reference String Yes A unique reference for this transaction
amount double Yes Amount to charge
currency String Yes Currency code (NGN, USD, GHS)
customer KorapayCustomer Yes Customer information
title String No Title of the transaction
description String No Description of the transaction
notificationUrl String No URL to receive webhooks about this transaction
metadata Map<String, dynamic> No Additional data to include with the transaction
redirectUrl String No URL to redirect after payment
channels List No Payment methods to enable (default: 'card')

KorapayCustomer

Parameter Type Required Description
name String Yes Customer's full name
email String Yes Customer's email address

Response

The KorapayCheckout.checkoutPayment method returns a KorapayResponse object with the following properties:

Property Type Description
status KorapayStatus Status of the transaction (success, failed, cancelled, pending, tokenized)
reference String? Transaction reference if available
data Map<String, dynamic>? Additional transaction data
errorMessage String? Error message if the transaction failed

Payment Methods

Card Payment

The default payment method. To use card payments only:

final config = KorapayConfig(
  // ... other config options
  channels: ['card'],
);

Bank Transfer

To use bank transfer payments:

final config = KorapayConfig(
  // ... other config options
  channels: ['bank_transfer'],
);

This will show a screen with bank account details that the customer can use to make a transfer.

Direct Bank Payment

To use direct bank payments:

final config = KorapayConfig(
  // ... other config options
  channels: ['bank'],
);

This will allow customers to pay directly from their bank account using their account number.

Multiple Payment Methods

To offer multiple payment methods:

final config = KorapayConfig(
  // ... other config options
  channels: ['card', 'bank_transfer', 'bank'],
);

The user will be able to choose their preferred payment method.

License

This project is licensed under the MIT License - see the LICENSE file for details.

Libraries

korapay_flutter