Use the Flutter gateway library to add payments to your Flutter app.

Platform Support

Android iOS
Google Pay Apple Pay

Getting started

Before you start, create an account with the payment providers you are planning to support and follow the setup instructions:

beGateway:

  1. Take a look at the integration requirements.

Apple Pay:

  1. Take a look at the integration requirements.
  2. Create a merchant identifier for your business.
  3. Create a payment processing certificate to encrypt payment information.

Google Pay:

  1. Take a look at the integration requirements.
  2. Sign up to the business console and create an account.

Usage

To start using this library, add begateway_flutter_sdk as a dependency in your pubspec.yaml file:

dependencies:
  begateway_flutter_sdk: ^0.0.1

Example:

Config for ApplePay:

const String defaultApplePay = '''{
  "provider": "apple_pay",
  "data": {
    "merchantIdentifier": "merchant.your.number",
    "displayName": "Your company'",
    "merchantCapabilities": ["3DS", "debit", "credit"],
    "supportedNetworks": ["amex", "visa", "discover", "masterCard"],
    "countryCode": "GB",
    "currencyCode": "GBP",
    "requiredBillingContactFields": ["jake@example.com", "Rick Astley", "+14845219741", "123456"],
    "requiredShippingContactFields": [],
    "shippingMethods": [
      {
        "amount": "0.00",
        "detail": "Available within an hour",
        "identifier": "in_store_pickup",
        "label": "In-Store Pickup"
      },
      {
        "amount": "0.00",
        "detail": "5-8 Business Days",
        "identifier": "flat_rate_shipping_id_2",
        "label": "UPS Ground"
      },
      {
        "amount": "42.99",
        "detail": "1-3 Business Days",
        "identifier": "flat_rate_shipping_id_1",
        "label": "FedEx Priority Mail"
      }
    ]
  }
}''';

Config for GooglePay:


const String  defaultGooglePay = '''{
  "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"
    }
  }
}''';

Config for products:

const products = [
{
'label': 'Total',
'amount': '42.99',
'status': 'PaymentItemStatus.final_price',

      },
    ];

Code:

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

void main() {
  runApp(const MyApp());
}

class MyApp extends StatefulWidget {
  const MyApp({super.key});
  @override
  State<MyApp> createState() => _MyAppState();
}

class _MyAppState extends State<MyApp> {
  bool isBegateway = false;
  Map<String, dynamic> answear = {};

  void showIsBegateway(bool newValue) {
    setState(() {
      isBegateway = newValue;
    });
  }

  void getAnswearFromBegateway(Map<String, dynamic> answerFromServer) {
    setState(() {
      answear = answerFromServer;
      debugPrint('Answear from: ${answerFromServer.toString()}');
    });
  }

  @override
  Widget build(BuildContext context) {
    return MaterialApp(
      debugShowCheckedModeBanner: false,
      home: isBegateway
          ? Begateway(
              //required parameters
              showIsBegateway: showIsBegateway,
              getAnswearFromBegateway: getAnswearFromBegateway,
              publicKey:
                  'your beGateway public key or token',
              test: true,
              transactionType: 'payment',
              amount: '4299',
              currency: 'GBP',
              description: 'Some description about product',
              language: 'ru',
              holder: 'Rick Astley',
              customerCountry: 'GB',
              customerEmail: 'jake@example.com',
              customerContract: true,
              buttonText: 'Купить часы 42.99\$',
              applePayConfig: defaultApplePay,
              googlePayConfig: defaultGooglePay,
              paymentItems: products,

              //optional parameters for customizing styles

               cardNumberColor: 0xFF1d1d21,
               cardNumberSize: 14,
               cardNumberHintColor: 0xFF787982,
               cardNumberHintSize: 14,
               cardNumberHintText: 'Custom text',
               cardNumberTitleColor: 0xFF0526fc,
               cardNumberTitleSize: 14,
               cardNumberTitleText: 'Custom title',
               cardNumberHintHide: false,
               cardNumberTitleHide: false,

               expireDateColor: 0xFF1d1d21,
               expireDateSize: 14,
               expireDateHintColor: 0xFF787982,
               expireDateHintSize: 14,
               expireDateHintText: 'Text',
               expireDateTitleColor: 0xFF0526fc,
               expireDateTitleSize: 14,
               expireDateTitleText: 'Custom title',
               expireDateHintHide: false,
               expireDateTitleHide: false,

               cvcCvvColor: 0xFF1d1d21,
               cvcCvvSize: 14,
               cvcCvvHintColor: 0xFF787982,
               cvcCvvHintSize: 14,
               cvcCvvHintText: 'Custom text',
               cvcCvvTitleColor: 0xFF0044FF,
               cvcCvvTitleSize: 14,
               cvcCvvTitleText: 'Custom title',
               cvcHideText: false,
               cvcCvvHintHide: false,
               cvcCvvTitleHide: false,

               cardholderColor: 0xFF1d1d21,
               cardholderSize: 14,
               cardholderHintColor: 0xFF787982,
               cardholderHintSize: 14,
               cardholderHintText: 'Custom text',
               cardholderTitleColor: 0xFF0526fc,
               cardholderTitleSize: 14,
               cardholderTitleText: 'Custom title',
               cardholderHintHide: false,
               cardholderTitleHide: false,

               borderColor: 0xFF787982,
               borderFocusColor: 0xFF0526fc,
               borderWidth: 1,
               borderFocusWidth: 2,

               errorBorderColor: 0xFFfc0505,
               errorBorderWidth: 1,
               errorBorderFocusColor: 0xFFfc0505,
               errorBorderFocusWidth: 2,
               errorTextColor: 0xFFfc0505,
               errorTextSize: 10,

               errorCardNumberText: 'Custom text error',
               errorExpireDateText: 'Custom text error',
               errorCvcCvvText: 'Custom text error',
               errorCardholderText: 'Custom text error',
               errorTextHide: true,
            )
          : Scaffold(
              appBar: AppBar(
                title: const Text('Your app'),
                backgroundColor: Colors.orange,
              ),
              body: SafeArea(
                child: Padding(
                  padding: const EdgeInsets.all(16),
                  child: answear.isEmpty
                      ? const Center(
                          child: Text(
                            'YOUR PRODUCT 42.99\$',
                            style: TextStyle(fontSize: 24),
                            textAlign: TextAlign.center,
                          ),
                        )
                      : Center(
                          child: Text(
                            'Status: ${answear["checkout"]["status"].toString()}',
                            style: const TextStyle(fontSize: 24),
                            textAlign: TextAlign.center,
                          ),
                        ),
                ),
              ),
              bottomNavigationBar: SafeArea(
                child: Padding(
                  padding: const EdgeInsets.all(16),
                  child: SizedBox(
                    width: double.infinity,
                    height: 50,
                    child: ElevatedButton(
                      onPressed: () {
                        showIsBegateway(true);
                      },
                      style: ButtonStyle(
                        backgroundColor:
                            MaterialStateProperty.all<Color>(Colors.orange),
                      ),
                      child: const Text('Buy Now'),
                    ),
                  ),
                ),
              ),
            ),
    );
  }
}

Additional information

Take a look at the following resources to manage your payment accounts and learn more about the APIs for the supported providers:

Google Pay Apple Pay
Platforms  Android  iOS
 Documentation  Overview Overview
 Console  Google Pay Business Console Developer portal
Reference API reference  Apple Pay API
Style guidelines  Brand guidelines Buttons and Marks