Flutter支付集成插件royat_pay的使用

RoyatPay

RoyatPay 是一个库，它允许 Flutter 应用程序通过 Royat 服务接受在线卡支付和 Apple 支付。

🚀 安装

在您的应用的 pubspec.yaml 文件的 dependencies 中添加以下内容：

royat_pay: latest_version

然后运行以下命令以安装依赖项：

flutter pub get

⭐ 初始化

在初始化 RoyatPay 实例时，可以使用 init 方法。以下是初始化的示例代码：

在 main.dart 文件中，确保正确配置了 RoyatPay 库：

void main() {
  WidgetsFlutterBinding.ensureInitialized(); // 确保 Flutter 绑定已初始化
  ...
  RoyatPay.instance.init(
    key: "auth key", // 替换为实际的认证密钥
    password: "auth password", // 替换为实际的认证密码
  );
  ...
  runApp(const MyApp());
}

:💡 使用

在初始化完成后，您可以使用 RoyatPay 实例进行支付尝试，可以通过卡支付或 Apple Pay 进行支付。

💳 使用 Apple Pay 进行支付

要通过卡发起支付，可以使用 payWithApple 方法。以下是具体用法：

// 使用 RoyatPay 实例通过 Apple Pay 进行支付
RoyatApplePayButton(
  merchantId: "merchantId", // 商户 ID
  order: Order( // 订单信息
    id: "id",
    amount: 100, // 支付金额（单位为分）
    description: "description", // 支付描述
  ),
  customer: Customer( // 客户信息
    name: "name",
    email: "email",
    phone: "phone",
    address: "address",
    city: "city",
    country: "country",
    lastName: "lastName",
  ),
  onError: (error) { // 错误处理回调
    print("Error: $error");
  },
  onTransactionFailure: (response) { // 支付失败回调
    print("Transaction Failure: $response");
  },
  onTransactionSuccess: (response) { // 支付成功回调
    print("Transaction Success: $response");
  },
  onAuthentication: (response) { // 身份验证回调
    print("Authentication: $response");
  },
),

📲 使用卡进行支付

要通过卡发起支付，可以使用 payWithCard 方法。以下是具体用法：

// 使用 RoyatPay 小部件通过卡进行支付
RoyatPayWidget(
  useFloatingAnimation: false, // 是否启用浮动动画
  useGlassMorphism: false, // 是否启用玻璃效果
  useBackgroundImage: true, // 是否启用背景图片
  onSuccess: () { // 支付成功回调
    print("Payment Successful!");
  },
  payData: PayData( // 支付数据
    order: Order(
      id: "id",
      amount: 100, // 支付金额（单位为分）
      description: "description", // 支付描述
    ),
    customer: Customer(
      name: "name name", // 客户姓名
      email: "info@royat.sa", // 客户邮箱
      phone: "1234536453", // 客户电话
      address: "address", // 客户地址
      city: "city", // 客户所在城市
      country: "Saudi Arabia", // 客户所在国家
      lastName: "lastName", // 客户姓氏
      zip: "12345", // 邮政编码
    ),
  ),
),

示例代码

以下是完整的示例代码，展示如何在 Flutter 应用中集成 RoyatPay：

import 'package:flutter/material.dart' hide Card;
import 'package:royat_pay/models/pay_data.dart';
import 'package:royat_pay/royat_pay.dart';
import 'package:royat_pay/widgets/apple_pay_button.dart';
import 'package:royat_pay/widgets/royat_pay_widget.dart';

void main() {
  WidgetsFlutterBinding.ensureInitialized(); // 确保 Flutter 绑定已初始化
  RoyatPay.instance.init(
    key: "auth key", // 替换为实际的认证密钥
    password: "auth password", // 替换为实际的认证密码
  );
  runApp(const MyApp());
}

class MyApp extends StatelessWidget {
  const MyApp({super.key});

  [@override](/user/override)
  Widget build(BuildContext context) {
    return MaterialApp(
      title: 'Flutter Demo',
      theme: ThemeData(
        colorScheme: ColorScheme.fromSeed(seedColor: Colors.deepPurple),
        useMaterial3: true,
      ),
      home: const MyHomePage(title: 'Flutter Demo Home Page'),
    );
  }
}

class MyHomePage extends StatefulWidget {
  const MyHomePage({super.key, required this.title});

  final String title;

  [@override](/user/override)
  State<MyHomePage> createState() => _MyHomePageState();
}

class _MyHomePageState extends State<MyHomePage> {
  [@override](/user/override)
  Widget build(BuildContext context) {
    return Scaffold(
      appBar: AppBar(
        title: Text(widget.title),
      ),
      body: Center(
        child: Column(
          mainAxisAlignment: MainAxisAlignment.center,
          children: [
            // Apple Pay 按钮
            RoyatApplePayButton(
              merchantId: "merchantId",
              order: Order(id: "1", amount: 100, description: "description"),
              customer: Customer(
                name: "name",
                email: "email",
                phone: "phone",
                address: "address",
                city: "city",
                country: "country",
                lastName: "lastName",
              ),
              onError: (error) { print("Error: $error"); },
              onTransactionFailure: (response) { print("Transaction Failure: $response"); },
              onTransactionSuccess: (response) { print("Transaction Success: $response"); },
              onAuthentication: (response) { print("Authentication: $response"); },
            ),
            // 卡支付小部件
            Expanded(
              child: Padding(
                padding: const EdgeInsets.all(8.0),
                child: RoyatPayWidget(
                  useFloatingAnimation: false,
                  useGlassMorphism: false,
                  useBackgroundImage: true,
                  onSuccess: () { print("Payment Successful!"); },
                  payData: PayData(
                    order: Order(
                      id: "234234",
                      amount: 100,
                      description: "description",
                    ),
                    customer: Customer(
                      name: "na me",
                      email: "ahmed@gmail.com",
                      phone: "1234536453",
                      address: "address",
                      city: "city",
                      country: "egypt",
                      lastName: "lastName",
                      zip: "12345",
                    ),
                  ),
                ),
              ),
            ),
          ],
        ),
      ),
    );
  }
}