πŸ“±Dime Pay Flutter SDK

The official Flutter SDK for embedding the Dime Pay secure payment experience into native apps using WebView.

πŸš€ Installation

flutter pub add dimepay_flutter_sdk

Android Google Pay In WebView

DimePayWebView now enables Android WebView Payment Request support inside the SDK so apps can use Google Pay from the embedded checkout flow without adding custom Android WebView code.

What the SDK handles automatically on Android:

  • Registers a native Android platform view for DimePayWebView
  • Enables JavaScript and DOM storage on the underlying WebView
  • Enables PAYMENT_REQUEST when supported by the Android WebView implementation
  • Merges the required Google Pay <queries> entries from the SDK manifest
  • Bundles androidx.webkit:webkit:1.14.0 in the Android plugin module

What your app still must do:

  • Complete the Google Pay Web integration for your checkout flow
  • Publish your Google Pay Android integration with Google before release
  • Run on devices with Google Play services 25.18.30+
  • Run on devices with Android System WebView / Chrome WebView 137+

If device requirements are not met, Google Pay IS_READY_TO_PAY can return false.

🧩 Usage

Card Payments

No extra Android WebView setup is required when using DimePayWebView from this SDK.

DimePayWebView(
  total: 5000,
  currency: "JMD",
  test: true,
  orderId: "ORDER-001",
  clientId: "ck_jtfEtqbrX2Nf7U_evqKVy",
  is_subscription: false,
  data: "<signed_jwt_token>",
  payment_methods: const DimePayMethods(
    apple_pay: true,
    google_pay: true,
    samsung_pay: true,
  ),
  styles: DimePayStyles(
    primaryColor: "#936c6c",
    buttonColor: "#936c6c",
    buttonTextColor: "#FFFFFF",
    backgroundColor: "#DDDDDD",
    noBorderRadius: false,
  ),
  onReady: (data) => print("βœ… Ready: \$data"),
  onSuccess: (data) => print("βœ… Success: \$data"),
  onFailed: (err) => print("❌ Failed: \$err"),
  onError: (err) => print("❌ Error: \$err"),
  onCancel: () => print("⚠️ Cancelled"),
  onLoading: () => print("⏳ Loading..."),
)

Save Card

DimePayCardView(
  cardRequestToken: "<card_request_token>",
  clientId: "ck_jtfEtqbrX2Nf7U_evqKVy",
  origin: "https://yourorigin.com",
  data: "<signed_jwt_token>",
  styles: DimePayStyles(
    primaryColor: "#936c6c",
    buttonColor: "#936c6c",
    buttonTextColor: "#FFFFFF",
    backgroundColor: "#DDDDDD",
    noBorderRadius: false,
  ),
  onReady: (data) => print("βœ… Ready: \$data"),
  onSuccess: (data) => print("βœ… Success: \$data"),
  onFailed: (err) => print("❌ Failed: \$err"),
  onError: (err) => print("❌ Error: \$err"),
  onCancel: () => print("⚠️ Cancelled"),
  onLoading: () => print("⏳ Loading..."),
)

πŸ” Secure JWT Flow

You must pass a signed JWT to data prop containing transaction info. Sign this on your server.


πŸ” Secure Payment Flow with JWT

You must generate a signed JWT on your backend and pass it to the SDK via the data prop.

Example Card Payment Payload:

{
  "id": "ORDER-001",
  "total": 5000,
  "subtotal": 5000,
  "description": "This is an order from the sdk",
  "tax": 0,
  "currency": "JMD",
  "fees": [],
  "items": [{
    "id": "xxxx-xxxx-xxxx-xxxx",
    "price": 1060,
    "sku": "ABCA-IAC",
    "quantity": 1,
    "shortDescription": "",
    "name": "iMac",
    "imageUrl": "https://example.com/images/xxxxxx.jpg",
    "merchant_id": null, // Only required for Dime bridge
    "selectedOptions": [
      {
        "name": "Color",
        "value": "red",
        "type": "CHOICE"
      }
    ]
  }],
  "fulfilled": true,
  "shippingPerson": {
    "name": "Shamir Saddler",
    "street": "1 Test Ave",
    "city": "Kingston 6",
    "stateOrProvinceName": "Kingston",
    "postalCode": "00000",
    "countryName": "Jamaica"
  },
  "billingPerson": {
    "name": "Shamir Saddler",
    "street": "1 Test Ave",
    "city": "Kingston 6",
    "stateOrProvinceName": "Kingston",
    "postalCode": "00000",
    "countryName": "Jamaica"
  },
  "split": null, // Only required for Dime bridge,
  "webhookUrl": "https://yourservice.com/webhook"
}

For Dime Bridge, add the block below to the payload:

      split: [
        {
          fee: 10,
          merchant_id: 'm4D8mQ1wMrdTUIg',
          amount: 500,
        },
        {
          fee: 30,
          merchant_id: 'm7UarSiV9zWxN6v',
          amount: 1500,
        }
      ]

Also for Dime bridge the corresponding item needs to be tagged with a merchant_id

Example Card Save Payload:

{
  "webhookUrl": "https://webhook.com",
  "card_request_token": "<card_request_token>",
}

Use a backend library like jsonwebtoken to sign the payload with your secret key. Never expose your secret key in your app.


βš™οΈ Configuration Options

Card Payment:

Prop Type Required Description
total number βœ… The total amount to charge
currency string βœ… The currency code (e.g. JMD, USD)
order_id string βœ… Your order reference
client_id string βœ… Client ID for your integration
data string βœ… Signed JWT with payment details
payment_methods object optional Defines payment methods to enable
styles object optional Customizes UI (colors, border radius, etc.)
test boolean optional Set true for sandbox environment
onReady func optional Called when payment page is ready
onSuccess func optional Called when payment completes successfully
onFailed func optional Called if payment fails
onError func optional Called on internal error
onCancel func optional Called when user cancels
onLoading func optional Called when payment widget begins loading

Android Notes

The SDK ships the Android manifest queries required by Google Pay WebView support:

<queries>
  <intent>
    <action android:name="org.chromium.intent.action.PAY"/>
  </intent>
  <intent>
    <action android:name="org.chromium.intent.action.IS_READY_TO_PAY"/>
  </intent>
  <intent>
    <action android:name="org.chromium.intent.action.UPDATE_PAYMENT_DETAILS"/>
  </intent>
</queries>

Your app usually does not need to add those entries manually unless your manifest merge process strips library queries.

Before shipping Google Pay in Android WebView, complete Google's publish guide:

Using shouldInterceptRequest to proxy checkout traffic through a third-party HTTP client is not supported for this flow.


Card Save:

Prop Type Required Description
cardRequestToken string βœ… The total amount to charge
clientId string βœ… The currency code (e.g. JMD, USD)
origin string βœ… Your order reference
clientId string βœ… Client ID for your integration
data string βœ… Signed JWT with payment details
styles object optional Customizes UI (colors, border radius, etc.)
test boolean optional Set true for sandbox environment
onReady func optional Called when payment page is ready
onSuccess func optional Called when payment completes successfully
onFailed func optional Called if payment fails
onError func optional Called on internal error
onCancel func optional Called when user cancels
onLoading func optional Called when payment widget begins loading

🧾 Changelog

1.0.7 - 2025-1-29

Add color customization for label text

1.0.6 - 2025-12-30

Add support for Dime V2 Update urls to pay.*

1.0.3 - 2025-07-07

  • Add support for Card Tokenization

1.0.2 - 2025-06-26

  • Add support for Apple Pay, Google Pay, Samsung Pay

1.0.0 - 2025-05-14

  • πŸš€ Initial release
  • βœ… Supports full payment flow with JWT + WebView
  • πŸ“‘ Handles events: onReady, onSuccess, onError, onCancel, etc.

πŸ›‘οΈ License

MIT License Β© Dime Pay

βš™οΈ Setup Local

βš™οΈ Run Local

  • Run flutter emulator to see all emulators
  • Run flutter emulators --launch <emulator id> to open an emulator
  • Run commands to start application
    • flutter run
  • Run commands to test
    • flutter test