Flutter SDK

The Duplo Checkout SDK adds Atlas payments to your Flutter app with a prebuilt checkout screen. Instead of building your own payment form and wiring up the Atlas API by hand, you call a single method, and the SDK presents the checkout flow and returns the result through callbacks.

This guide walks you through installing the SDK, launching checkout, and handling the outcome of a payment.

Prerequisites

Before you begin, make sure you have:

• A Flutter project targeting Android or iOS.
• Your Atlas API key. You can find it on your developer dashboard.

Installation

Add the duplo_checkout package to your project by running:

flutter pub add duplo_checkout

This adds the dependency to your pubspec.yaml. You can also add it manually and then run flutter pub get:

dependencies:
  duplo_checkout: ^<latest_version>

Replace <latest_version> with the current version from pub.dev.

Launching the Checkout

To launch the checkout, start by importing the package in the Dart file where you want to start a payment:

import 'package:duplo_checkout/duplo_checkout.dart';

Then, call DuploCheckout.startPayment to open the checkout screen. Pass the current BuildContext, your API key, and the payment details, then handle the result through the callbacks. The required payment details include:

• firstName: Your customer's first name.
• lastName: Your customer's last name.
• email: Your customer's email.
• amount: The amount to charge, in the major currency unit. For example, 1550 charges ₦1,550.
• currency: Your account's onboarding country's currency. For your region, the only valid value is NGN.
• sourceReference: A unique string you supply to identify and reconcile the transaction on your side.

For example:

DuploCheckout.startPayment(
  context,
  apiKey: 'pk_test_xxxxxxxxxxxxxxxxxxxx',
  amount: 1550,
  currency: 'NGN',
  email: 'customer@example.com',
  firstName: 'John',
  lastName: 'Doe',
  sourceReference: 'your-source-reference',
);

Callbacks

The SDK reports the outcome of the payment through the callbacks below. Each one is optional, but you should at least handle onSuccess and onError.

You pass these callbacks to startPayment alongside the payment details shown above. The examples below show how you might handle each one.

onSuccess: (response) {
  // Payment completed. Confirm the status on your server before fulfilling the order.
  log('Payment successful: $response');

  Navigator.of(context).push(
    MaterialPageRoute(builder: (_) => const PaymentSuccessScreen()),
  );
},

Related guides

• Authentication on Atlas
• Handling Atlas Errors
• Configure and Verify Webhooks