SDK Flutter

Ce SDK est conçu pour permettre l'intégration de KKiaPay dans votre application mobile Flutter. Pour le mettre en place, vous devrez créer un compte sur la plateforme kkiapay.me et suivre le processus :

Installation

Pour utiliser ce packet :

dependencies:
  flutter:
    sdk: flutter
  kkiapay_flutter_sdk:

Pour le web

ajouter ce script dans le fichier index.html
<script src="https://cdn.kkiapay.me/k.js"></script>

Usage

import 'package:kkiapay_flutter_sdk/kkiapay_flutter_sdk.dart';

Initialisation de l'instance de Kkiapay

final kkiapay = KKiaPay(
    @required callback: Function(Map<String, dynamic> response, BuildContext context),
    @required amount: int, // Ex : 1000
    @required apikey: String, // Ex : XXXX_public_api_key_XXX
    @required sandbox: bool, // Ex : true
    data: String, // Ex : 'Big data'
    phone: String, // Ex : "22961000000"
    name: String, // Ex : "John Doe"
    reason: String, // Ex : "transaction reason"
    email: String, // Ex : "email@mail.com"
    callbackUrl: String, // Ex : "http://kkiapay.me"
    theme: String, // Ex : "#222F5A"
    countries: List<String>, // Ex :  ["CI","BJ"]
    partnerId: String, // Ex : 'AxXxXXxId'
    paymentMethods: List<String> // Ex : ["momo","card"]
);

Création de l'instance de paiement

Mobile:

Navigator.push( context, MaterialPageRoute(builder: (context) => kkiapay), );

Web:

KkiapayFlutterSdkPlatform.instance.pay( kkiapay, context, callback );

Exemple

import 'package:flutter/material.dart';
import 'package:kkiapay_flutter_sdk/kkiapay_flutter_sdk.dart';


void main() => runApp(App());

void callback(response, context) {
  switch ( response['status'] ) {

    case PAYMENT_CANCELLED:
      Navigator.pop(context);
      debugPrint(PAYMENT_CANCELLED);
    break;

    case PAYMENT_INIT:
      debugPrint(PAYMENT_INIT);
      break;

    case PENDING_PAYMENT:
      debugPrint(PENDING_PAYMENT);
      break;
      
    case PAYMENT_SUCCESS:
      Navigator.pop(context);
      Navigator.push(
        context,
        MaterialPageRoute(
          builder: (context) => SuccessScreen(
            amount: response['requestData']['amount'],
            transactionId: response['transactionId'],
          ),
        ),
      );
      break;

    default:
      debugPrint(UNKNOWN_EVENT);
      break;
  }
}

final kkiapay = KKiaPay(
    amount: 1000,//
    countries: ["BJ","CI","SN","TG"],//
    phone: "22961000000",//
    name: "John Doe",//
    email: "email@mail.com",//
    reason: 'Transaction reason',//
    data: 'Fake data',//
    sandbox: true,//
    apikey: public_api_key,//
    callback: callback,//
    theme: defaultTheme, // Ex : "#222F5A",
    partnerId: 'AxXxXXxId',//
    paymentMethods: ["momo","card"]//
);

class App extends StatelessWidget {
  @override
  Widget build(BuildContext context) {
    return MaterialApp(
      debugShowCheckedModeBanner: false,
      home: Scaffold(
        appBar: AppBar(
          backgroundColor: nColorPrimary,
          title: Text('Kkiapay Sample'),
          centerTitle: true,
        ),
        body: KkiapaySample(),
      ),
    );
  }
}

class KkiapaySample extends StatelessWidget {
  const KkiapaySample({
    Key? key,
  }) : super(key: key);

  @override
  Widget build(BuildContext context) {
    return Center(
        child: Column(
          crossAxisAlignment: CrossAxisAlignment.center,
          mainAxisAlignment: MainAxisAlignment.center,
          children: [
            ButtonTheme(
              minWidth: 500.0,
              height: 100.0,
              child: TextButton(
                style: ButtonStyle(
                  backgroundColor: MaterialStateProperty.all(Color(0xff222F5A)),
                  foregroundColor: MaterialStateProperty.all(Colors.white),
                ),
                child: const Text(
                  'Pay Now',
                  style: TextStyle(color: Colors.white),
                ),
                onPressed: () {
                  Navigator.push(
                    context,
                    MaterialPageRoute(builder: (context) => kkiapay),
                  );
                },
              ),
            ),
            const SizedBox(height: 50,),
            ButtonTheme(
              minWidth: 500.0,
              height: 100.0,
              child: TextButton(
                style: ButtonStyle(
                  backgroundColor:
                  MaterialStateProperty.all(const Color(0xff222F5A)),
                  foregroundColor: MaterialStateProperty.all(Colors.white),
                ),
                child: const Text(
                  'Pay Now ( WEB )',
                  style: TextStyle(color: Colors.white),
                ),
                onPressed: () {
                  KkiapayFlutterSdkPlatform.instance.pay(kkiapay, context, callback);
                },
              ),
            )
          ],
        )
    );
  }
}

Références

Attribut
Type
Requis
Description

phone

String

Oui

Numéro de téléphone du client à débiter. Ex: 22967434270

amount

Numeric

Oui

Le montant à débiter au client (XOF)

name

String

Non

Nom et prénoms du client

partnerId

String

Non

Votre id pour retrouver la transaction

countries

Array of String

Non

Les pays supportés par le widget. Ex: ["CI"]

paymentMethods

Array of String

Non

Les méthodes de paiement à autoriser sur le widget. Ex: ["momo","card"]

theme

String

Non

La couleur que vous souhaitez pour le widget KKiaPay

apikey

String

Oui

Votre clé d'API publique

sandbox

Boolean

Non

La valeur true de cet attribut vous permet de passer en mode test

successCallback

Function

Oui

Cette fonction est appelée une fois que le paiement est succès

la fonction successCallback prend 2 parametres dans l'ordre suivant :
- Map<String,dynamic> contenant les informations de la transaction
  { 
    'requestData': {
      'amount': int,
      'phone': String,
      'reason': String,
      'data': String,
      'partnerId': String,
      'sandbox': bool,
      'name': String,
      'email': String
    },
    'transactionId': String, 
    'status': String 
  }
  
- le contexte du type BuildContext

Pour plus d'informations sur le package Flutter, rendez vous sur la page : KKiaPay Flutter SDK.

Last updated