Mercado Pago's Unofficial Flutter checkout library
Made with ❤️ by Ricardo Markiewicz // @gazeria.
MercadoPago has discontinue Quick Checkout for Android and iOS.
The official recommendation is to use a webview using Checkout Bricks.
Flutter implementation of MercadoPago Mobile Checkout
This is a Work in progress project!, so please use with care and report the issues and feature request to our Github page. Thanks!
- Create an account in MercadoPago, you may need to choose the country where you want to accept payments.
- Create an Application
- Go to the credentials page (the url may change depending the country, but looks like https://www.mercadopago.com/mla/account/credentials) and get the Public Key of the new app ** SECURITY WARNING: Do not use the Access Token, ClientID or Client Secret in your mobile application.
- Call your backend to create a Checkout Preference and get a PreferenceId ** TODO: Add more documentation about preferences
- In your Flutter code, call
MercadoPagoMobileCheckout.startCheckout()
to allow the user to pay - Save the payment response into your database.
Nothing special to do, just add the plugin and use it.
At the moment we need to setup a UINavigationController manually because the one that Flutter provides do not work with MercadoPago px-ios.
You need to setup your root view controller as UINavigationController in your AppDelegate of the ios folder of your app:
// AppDelegate.swift
import UIKit
import Flutter
@UIApplicationMain
@objc class AppDelegate: FlutterAppDelegate {
var navigationController: UINavigationController?;
override func application(
_ application: UIApplication,
didFinishLaunchingWithOptions launchOptions: [UIApplication.LaunchOptionsKey: Any]?
) -> Bool {
// Add this line before GeneratedPluginRegistrant
let flutterViewController: FlutterViewController = window?.rootViewController as! FlutterViewController
// This line is added by the Flutter App Generator
GeneratedPluginRegistrant.register(with: self)
// Add these lines after GeneratedPluginRegistrant
self.navigationController = UINavigationController(rootViewController: flutterViewController);
self.navigationController?.setNavigationBarHidden(true, animated: false);
self.window = UIWindow(frame: UIScreen.main.bounds);
self.window.rootViewController = self.navigationController;
self.window.makeKeyAndVisible();
// End of edit
return super.application(application, didFinishLaunchingWithOptions: launchOptions)
}
}
Also, by default Flutter creates the iOS app to target a version that is not supported by px-ios. So, you need to open ios/Podfile
, uncomment and edit the line that says:
# Uncomment this line to define a global platform for your project
platform :ios, '8.0'
and change it to
# Uncomment this line to define a global platform for your project
platform :ios, '10.0'
And also, add use_modular_headers!
to the Runner
target.
Add this to your package's pubspec.yaml file:
dependencies:
mercado_pago_mobile_checkout: ^0.1.1
Add the following import to your Dart code:
import 'package:mercado_pago_mobile_checkout/mercado_pago_mobile_checkout.dart';
Honestly, I think that 'px_flutter' is shorter but more difficult to discover if you do not know that the native ones are called px-something.
Also maybe in the future, MercadoPago may want to use that name to release their own version and I do not want to argue with them about a name :).
Please check the email that you are using to create the preferenceId. Some emails in the original documentation gives problems so try to use a real email.
Also, check that the email used to create the preferenceId is not the same as the used to create the MarcadoPago account.
Yes, from version 0.1.0 we support null-safety on Dart
Create an issue in https://github.com/Gazer/px-flutter