Flutter支付功能插件mpayment的使用

Midtrans支付网关插件

请在使用此库之前阅读Midtrans文档，并确保你已经拥有Midtrans账户以访问仪表板。

Android设置

仅支持AndroidX且最低编译目标为28。

在你的android/app/src/main/res/values/styles.xml文件中添加样式：

<style name="AppTheme" parent="Theme.AppCompat.Light.DarkActionBar">
    <item name="windowActionBar">false</item>
    <item name="windowNoTitle">true</item>
</style>

完整的styles.xml文件如下所示：

<?xml version="1.0" encoding="utf-8"?>
<resources>
    <style name="LaunchTheme" parent="@android:style/Theme.Black.NoTitleBar">
        <!-- 显示活动上的启动屏幕。当Flutter绘制其第一帧时会自动移除 -->
        <item name="android:windowBackground">@drawable/launch_background</item>
    </style>
    <style name="AppTheme" parent="Theme.AppCompat.Light.DarkActionBar">
        <item name="windowActionBar">false</item>
        <item name="windowNoTitle">true</item>
    </style>
</resources>

然后在你的AndroidManifest.xml文件的应用标签中添加样式：

android:theme="@style/AppTheme"

iOS设置

无需特定设置。

示例用法

确保你已经准备了这些变量：

• YOUR_CLIENT_ID: Midtrans客户端ID
• YOUR_URL_BASE: 用于处理支付的后端URL基础API

示例代码如下：

import 'dart:async';
import 'package:flutter/material.dart';
import 'package:mpayment/mpayment.dart';

void main() => runApp(new MyApp());

class MyApp extends StatefulWidget {
  [@override](/user/override)
  _MyAppState createState() => new _MyAppState();
}

class _MyAppState extends State<MyApp> {
  bool isMakePayment = false;
  final mpayment = Mpayment();

  [@override](/user/override)
  void initState() {
    super.initState();
    mpayment.init("YOUR_CLIENT_ID", "YOUR_URL_BASE");
    mpayment.setFinishCallback(_callback);
  }

  _makePayment() {
    setState(() {
      isMakePayment = true;
    });
    mpayment
        .makePayment(
          MidtransTransaction(
              7500,
              MidtransCustomer(
                  "Apin", "Prastya", "apin.klas@gmail.com", "085235419949"),
              [
                MidtransItem(
                  "5c18ea1256f67560cb6a00cdde3c3c7a81026c29",
                  7500,
                  2,
                  "USB FlashDisk",
                )
              ],
              skipCustomer: true,
              customField1: "ANYCUSTOMFIELD"),
        )
        .catchError((err) => print("ERROR $err"));
  }

  Future<void> _callback(TransactionFinished finished) async {
    setState(() {
      isMakePayment = false;
    });
    return Future.value(null);
  }

  [@override](/user/override)
  Widget build(BuildContext context) {
    return new MaterialApp(
      home: new Scaffold(
        appBar: new AppBar(
          title: const Text('Plugin example app'),
        ),
        body: new Center(
          child: isMakePayment
              ? CircularProgressIndicator()
              : RaisedButton(
                  child: Text("Make Payment"),
                  onPressed: () => _makePayment(),
                ),
        ),
      ),
    );
  }
}