Flutter USSD
Flutter USSD SDK for implementing the Okra widget
Introduction
This flutter SDK version allows you to link your account and make payment via the USSD channel
Prerequisite
To get started, you'll need to follow some steps;
- Create your developer account and retrieve your
Client Token
,API Keys
, andPrivate Keys
.
Note - Checkout our starter guide, for some help.
Getting Started
This library would help you add Okra widget to your hybrid android/ios application in minutes.
Install
- To use this plugin, add
okra_widget
as a dependency in your pubspec.yaml file
Also run an implicitdart pub get
.
Lastly ensureminSdkVersion
is 18 and above on Android.
dependencies:
okra_widget: ^2.0.7-ussd
- On iOS, opt-in to the embedded views preview by adding a boolean property to the app's Info.plist file with the key
io.flutter.embedded_views_preview
and the valuetrue
.
<dict>
<key>io.flutter.embedded_views_preview</key>
<true/>
</dict>
Usage
This SDK enables users to use the account linking feature via USSD or the payments feature via USSD.
1. Linking Via USSD
In other to link your account via USSD all you have to do is add ussd = true in your options eg:
var banks = [
"ecobank-nigeria",
"fidelity-bank",
"first-bank-of-nigeria",
"first-city-monument-bank",
"guaranty-trust-bank",
"access-bank",
"unity-bank",
"alat",
"polaris-bank",
"stanbic-ibtc-bank",
"standard-chartered-bank",
"sterling-bank",
"union-bank-of-nigeria",
"united-bank-for-africa",
"wema-bank",
"rubies-bank",
"kuda-bank"
];
var okraOptions = {
"key": "public key",
"token": "client token",
"products": [
"auth",
"balance",
"identity",
"transactions"
],
"environment": "production",
"clientName": "Bassey",
"color" : "#9013FE",
"limit" : "3",
"isCorporate" : false,
"connectMessage" : "Which account do you want to connect with?",
"callback_url" : "",
"redirect_url" : "",
"short_url": "",
"logo" : "https://dash.okra.ng/static/media/okra-logo.514fd943.png",
"widget_success" : "Your account was successfully linked to SwipeNG",
"widget_failed" : "An unknown error occurred, please try again.",
"currency" : "NGN",
"noPeriodic" : true,
"exp" : "",
"success_title" : "null",
"success_message" : "null",
"guarantors" : {
"status": false,
"message": "Okra requires you to add guarantors",
"number": 3,
},
"filter" : {
"industry_type": "all",
"banks": banks
}
};
OkraHandler reply = await Okra.create(context, okraOptions);
2. Payment
If you want to make payment via USSD you need to send ussd = true
and add a phone number in the options (This is the phone number that will be notified when the payment is successful), in addition to sending a charge object and payment = true
.

var okraOptions = {
"key": "public-key",
"token": "token",
"products": [
"auth",
"balance",
"identity",
"transactions"
],
"env": "production",
"clientName": "Bassey",
"color" : "#9013FE",
"limit" : "3",
"isCorporate" : false,
"ussd" : true,
"payment" : true,
"options" : {
"phone", "081888288402"
},
"charge": {
"type":"one-time",
"amount":"10000",
"note":"",
"currency": "NGN",
"account": "5f450b2689a23801307c8b5b"
},
"connectMessage" : "Which account do you want to connect with?",
"callback_url" : "",
"redirect_url" : "",
"logo" : "https://dash.okra.ng/static/media/okra-logo.514fd943.png",
"widget_success" : "Your account was successfully linked to SwipeNG",
"widget_failed" : "An unknown error occurred, please try again.",
"currency" : "NGN",
"noPeriodic" : true,
"exp" : "",
"success_title" : "null",
"success_message" : "null",
"guarantors" : {
"status": false,
"message": "Okra requires you to add guarantors",
"number": 3,
}
};
OkraHandler reply = await Okra.create(context, okraOptions);
Example
Here's a sample code on it's implementation
import 'dart:convert';
import 'package:flutter/material.dart';
import 'package:okra_widget/okra_widget.dart';
void main() => runApp(MyApp());
class MyApp extends StatelessWidget {
// This widget is the root of your application.
@override
Widget build(BuildContext context) {
return MaterialApp(
title: 'Okra Link Demo',
theme: ThemeData(
primarySwatch: Colors.blue,
),
home: MyHomePage(title: 'Okra Test Widget'),
);
}
}
class MyHomePage extends StatefulWidget {
MyHomePage({Key key, this.title}) : super(key: key);
final String title;
@override
_MyHomePageState createState() => _MyHomePageState();
}
class _MyHomePageState extends State<MyHomePage> {
@override
Widget build(BuildContext context) {
return Scaffold(
appBar: AppBar(
// Here we take the value from the MyHomePage object that was created by
// the App.build method, and use it to set our appbar title.
title: Text(widget.title),
),
body: Center(
child: Column(
mainAxisAlignment: MainAxisAlignment.center,
children: <Widget>[
Text('Click button to open Okra Widget'),
RaisedButton(
color: Colors.green,
child: Text(
"Click me",
style: TextStyle(color: Colors.white),
),
onPressed: () async {
var banks = [
"ecobank-nigeria",
"fidelity-bank",
"first-bank-of-nigeria",
"first-city-monument-bank",
"guaranty-trust-bank",
"access-bank",
"unity-bank",
"alat",
"polaris-bank",
"stanbic-ibtc-bank",
"standard-chartered-bank",
"sterling-bank",
"union-bank-of-nigeria",
"united-bank-for-africa",
"wema-bank",
"rubies-bank",
"kuda-bank"
];
var okraOptions = {
"key": "z",
"token": "5da6358130a943486f33dced",
"products": [
"auth",
"balance",
"identity",
"transactions"
],
"environment": "production",
"clientName": "Bassey",
"color" : "#9013FE",
"limit" : "3",
"isCorporate" : false,
"connectMessage" : "Which account do you want to connect with?",
"callback_url" : "",
"redirect_url" : "",
"logo" : "https://dash.okra.ng/static/media/okra-logo.514fd943.png",
"widget_success" : "Your account was successfully linked to SwipeNG",
"widget_failed" : "An unknown error occurred, please try again.",
"currency" : "NGN",
"noPeriodic" : true,
"exp" : "",
"success_title" : "null",
"success_message" : "null",
"guarantors" : {
"status": false,
"message": "Okra requires you to add guarantors",
"number": 3,
},
"filter" : {
"industry_type": "all",
"banks": banks
}
};
OkraHandler reply = await Okra.create(context, okraOptions);
}),
],
),
),
// This trailing comma makes auto-formatting nicer for build methods.
);
}
}
Updated over 2 years ago
If you're an Android dev, checkout our Android SDK or simply connect to our API