flutter_bani_checkout

Description:

flutter bani checkout

Flutter Bani Checkout #
Integrate Bani Checkout Seamlessly into your Flutter Applications using this package!
Installation #
Run this in your workspace terminal
flutter pub add flutter_bani_checkout
copied to clipboard
Import the package in your application
import 'package:flutter_bani_checkout/flutter_bani_checkout.dart';
copied to clipboard
This package works using Riverpod. So we wrap the MyApp method in main with ProviderScope as shown below
void main() {
runApp(const ProviderScope(
child: MyApp(),
));
}
copied to clipboard
Android Requirements #
The minium sdk version should be set to 19 in the android/app/build.gradle.
android {
defaultConfig {
minSdkVersion 19
}
}
copied to clipboard
Features #
Make use of either BaniShopperCheckout Widget in a stand alone page, or BaniShopper.checkoutModalSheet bottom sheet.
BaniShopperCheckout #
This Widget takes a custom class, BaniObject as a required property.
final String text; // Text to be displayed to user
final String amount; // Amount to be purchased
final String phoneNumber; // Phone number of user in ITU standard Eg: +234 xxx xxxx xxxx
final String merchantKey; //Merchant Key
final String ref; // Transaction Reference. Should be a unique String
final String email; //User Email
final String firstName; // User First name
final String lastName; // Users Last Name
final Map<String, dynamic> metaData; // Metea Data
copied to clipboard
Optional Functions listed below can be given to be notified when an Event Response is receieved from the Widget.

onClose: This function is called whenever the Widget or Modal is closed or dismissed.
onSuccess: This function is called whenever a successful transaction has been carried out.
onCustomerExists: This function is called on confirmation of a valid Customer.
onCheckOutClose: This function is called after a successful payment has been receieved and widget closed.

The EventResponse class returned, contains the transaction reference and customer Ref
Example
BaniShopperCheckout(
baniObject: BaniObject(
text: "Pay with Bani",
amount: "200",
phoneNumber: "+23408039485758",
merchantKey: "pub_test_KB9A23HSYR327H5DKW45Y",
ref: "ref-${Random.secure().nextInt(900000) + 100000}",
email: "[email protected]",
firstName: "John",
lastName: "Doe",
metaData: {
"order_ref": "fake_0rderre6",
},
),
onSuccess: (eventResponse){
dev.log("Success!");
},
onClose: (eventResponse) {
dev.log(event.toString());
dev.log("Closed!");
},
),
copied to clipboard
await BaniShopper.checkoutModalSheet(
context: context,
baniObject: BaniObject(
text: "Pay with Bani",
amount: "200",
phoneNumber: "+23408038475839",
merchantKey: "pub_test_KB9A23HSYR327H5DKW45Y",
ref: "ref-${Random.secure().nextInt(900000) + 100000}",
email: "[email protected]",
firstName: "John",
lastName: "Doe",
metaData: {
"order_ref": "fake_0rderre6",
},
),
// onClose: onClose,
// onSuccess: onSuccess,
// onCustomerExists: onCustomerExists,
)
copied to clipboard
Check out the example package for a working demo.
Introducing Bani Shopper Integration #
Integrate Bani Shopper payments into your application in three easy steps!
Step One #
The first step requires collating the data you intend to send to Bani Shopper. The following variables below are data you can pass, with collectorRef being the only required variable:

The collector ref (formally known as the merchant tribe-ref)
The amount.
The Transaction Reference
The Branch ID
Custom Data

String collectorRef = "BN-e78b38qwrt4bebz514ya1dzpz9";
String amount = "5000";
String transactionReference = "dsfWDFDFddfREEGDfREw";
String branchID = "21";
copied to clipboard
Step Two #
The second step involves placing the variables, into the payInBaniShopper function. The BaniShopper.payInBaniShopper function, handles the heavy lifting of constructing the string and launching BaniShopper with all the variables you created in Step One:
Future<void> payInBaniShopper({
required String? collectorRef,
String? amount,
String? transactionReference,
String? branchID,
Map<String, dynamic>? customData,
})
copied to clipboard
Step Three #
The final step is the easiest! We call the payInBaniShopper function! This is an asynchronous call so it is important to await its call.:
ElevatedButton(
onPressed: () async {
await payInBaniShopper(
collectorRef: collectorRef,
amount: amount,
branchID: branchID,
transactionReference: transactionReference,
customData: {
"is_internal": isInternal,
"order_id": orderID,
});
},
child: const Text("Launch Bani Shopper"),
),
copied to clipboard
The above code creates an Elevated Button, launches the url link in the web browser in it's onPressed callback. If the user has BaniShopper installed, it will open the app and prompt them to sign in. If the user doesn't have the app installed, they will be redirected to a website to complete the purchase!
Once redirected, they will confirm the purchase, provide authorization, and will be redirected back to the source application!