Posted by Jose Ugia, Developer Programs Engineer, Google Pay and Anthony Panissidi, Technical Writer, Google Developer Studio
We made it easier than ever to integrate Google Pay in Flutter apps!
Our open source Flutter plugin simplifies the addition of payments to Flutter apps on iOS and Android.
The plugin gives you the ability to add functionality to your apps across platforms with a single and familiar codebase written in Dart.
It adapts common steps required to facilitate payments that adhere to how Flutter constructs components, works with the user interface of the app, and exchanges information between the native and Dart ends.
Now, as a Flutter developer, you can easily reap the benefits of Google Pay, which lets you provide users with a secure and fast checkout experience that increases conversions, and frees you from the need to manage credit cards and payments.
To use the plugin, add pay
as a dependency in your
pubspec.yaml
file. For more information, see Adding
a package dependency to an app.
To configure a payment, load a payment profile with the desired configuration, either with a local file or one retrieved from a remote server. For a complete list of all configuration options, see the PaymentDataRequest object.
Here's an example of a JSON file that defines payment options:
{
"provider": "google_pay",
"data": {
"environment": "TEST",
"apiVersion": 2,
"apiVersionMinor": 0,
"allowedPaymentMethods": [{
"type": "CARD",
"tokenizationSpecification": {
"type": "PAYMENT_GATEWAY",
"parameters": {
"gateway": "example",
"gatewayMerchantId": "gatewayMerchantId"
}
},
"parameters": {
"allowedCardNetworks": ["VISA", "MASTERCARD"],
"allowedAuthMethods": ["PAN_ONLY", "CRYPTOGRAM_3DS"],
"billingAddressRequired": true,
"billingAddressParameters": {
"format": "FULL",
"phoneNumberRequired": true
}
}
}],
"merchantInfo": {
"merchantId": "01234567890123456789",
"merchantName": "Example Merchant Name"
},
"transactionInfo": {
"countryCode": "US",
"currencyCode": "USD"
}
}
}
For more examples of JSON files that define payment options, take a look at the
example/assets/
folder.
Now you can use this configuration to add the Google Pay button to your app and forward the payment method selected by your users.
Here's an example of a Dart file:
import 'package:pay/pay.dart';
const _paymentItems = [
PaymentItem(
label: 'Total',
amount: '99.99',
status: PaymentItemStatus.final_price,
)
];
// In your Widget build() method
GooglePayButton(
paymentConfigurationAsset: 'sample_payment_configuration.json',
paymentItems: _paymentItems,
style: GooglePayButtonStyle.black,
type: GooglePayButtonType.pay,
onPaymentResult: onGooglePayResult,
),
// In your Stateless Widget class or State
void onGooglePayResult(paymentResult) {
// Send the resulting Google Pay token to your server or PSP
}
The best part of this news is that you can use the plugin today. To get started with it, check out the pay package on pub.dev. We also want to hear your thoughts and feature requests, and look forward to your contributions on GitHub.
Want to learn more about Google Pay? Here's what you can do: