Flutter单体架构支持插件flutter_mono的使用

该插件flutter_mono使得在Flutter项目中使用Mono连接组件变得简单。这是一份非官方的SDK。

📸 屏幕截图

🚀 如何使用插件

使用launchMono方法启动MonoFlutter

import 'package:flutter_mono/flutter_mono.dart';

void launch() async {
  FlutterMono(
    apiKey: 'Your Public Key', // 从 https://app.withmono.com/apps 获取
    reference: "some_random_string",
    showLogs: true,
    customer: const MonoCustomer(
      newCustomer: MonoNewCustomerModel(
        name: "Samuel Olamide", // 必填
        email: "samuel@neem.com", // 必填
        identity: MonoNewCustomerIdentity(
          type: "bvn",
          number: "2323233239",
        ),
      ),
      existingCustomer: MonoExistingCustomerModel(
        id: "1234-RTFG-ABCD", // 必填
      ),
    ),
    configJson: const {
      "selectedInstitution": {
        "id": "5f2d08be60b92e2888287702",
        "auth_method": "mobile_banking"
      }
    },
    onClose: (it) => log('Success: $it'), // 关闭回调
    onLoad: () => log('widget_loaded'), // 加载回调
    onEvent: (eventName, eventData) {
      switch (eventName) {
        case 'mono.connect.institution_selected':
          /// 执行某些操作
          break;
      }
    },
  ).launchMono(context); // 在当前上下文中启动Mono
}

使用MonoView组件

import 'package:flutter_mono/flutter_mono.dart';

...

FlutterMono(
  apiKey: 'Your Public Key', // 从 https://app.withmono.com/apps 获取
  reference: "some_random_string",
  showLogs: true,
  customer: const MonoCustomer(
    newCustomer: MonoNewCustomerModel(
      name: "Samuel Olamide", // 必填
      email: "samuel@neem.com", // 必填
      identity: MonoNewCustomerIdentity(
        type: "bvn",
        number: "2323233239",
      ),
    ),
    existingCustomer: MonoExistingCustomerModel(
      id: "1234-RTFG-ABCD", // 必填
    ),
  ),
  configJson: const {
    "selectedInstitution": {
      "id": "5f2d08be60b92e2888287702",
      "auth_method": "mobile_banking"
    }
  },
  onClose: (it) => log('Success: $it'), // 关闭回调
  onLoad: () => log('widget_loaded'), // 加载回调
  onEvent: (eventName, eventData) {
    switch (eventName) {
      case 'mono.connect.institution_selected':
        /// 执行某些操作
        break;
    }
  },
)

...

✨ 贡献

欢迎提交PR来改进此插件。任何建议和贡献都是受欢迎的。

下面是完整的示例代码：

import 'dart:developer';

import 'package:flutter/cupertino.dart';
import 'package:flutter/material.dart';
import 'package:flutter/services.dart';
import 'package:flutter_mono/flutter_mono.dart';

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

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

  // 应用程序根组件
  [@override](/user/override)
  Widget build(BuildContext context) {
    return AnnotatedRegion<SystemUiOverlayStyle>(
      value: const SystemUiOverlayStyle(
        statusBarColor: Colors.transparent,
        systemNavigationBarColor: Colors.white,
      ),
      child: MaterialApp(
        title: 'Mono Flutter Demo',
        theme: ThemeData(
          primaryColor: Colors.black,
        ),
        debugShowCheckedModeBanner: false,
        home: const HomePage(),
      ),
    );
  }
}

class HomePage extends StatefulWidget {
  const HomePage({super.key});

  [@override](/user/override)
  HomePageState createState() => HomePageState();
}

class HomePageState extends State<HomePage> {
  String _code = 'no_code_yet'; // 用于存储返回的代码
  String get code => _code;
  set code(String value) {
    setState(() => _code = value);
  }

  [@override](/user/override)
  Widget build(BuildContext context) {
    return Scaffold(
      appBar: AppBar(
        title: const Text(
          'MonoConnect v2.0 Demo',
          style: TextStyle(
            color: Colors.black,
            fontSize: 18,
          ),
        ),
        centerTitle: true,
        backgroundColor: Colors.white,
      ),
      backgroundColor: Colors.white,
      body: Center(
        child: Column(
          mainAxisAlignment: MainAxisAlignment.center,
          children: [
            SelectableText(
              code,
              style: const TextStyle(
                fontWeight: FontWeight.w400,
                fontSize: 14,
              ),
            ),
            const SizedBox(height: 60),
            Column(
              children: [
                SizedBox(
                  height: 50,
                  width: 260,
                  child: CupertinoButton(
                    color: Colors.black,
                    child: const Center(
                      child: Text(
                        'Launch Mono',
                        style: TextStyle(
                          color: Colors.white,
                        ),
                      ),
                    ),
                    onPressed: () => launch(context), // 启动Mono
                  ),
                ),
              ],
            ),
          ],
        ),
      ),
    );
  }

  void launch(BuildContext context) {
    try {
      FlutterMono(
        apiKey: 'test_pk_lwWSeByMA8yGfckIN87I',
        reference: 'random_string',
        showLogs: true,
        customer: const MonoCustomer(
          newCustomer: MonoNewCustomerModel(
            name: "Samuel Olamide", // 必填
            email: "samuel@neem.com", // 必填
            identity: MonoNewCustomerIdentity(
              type: "bvn",
              number: "2323233239",
            ),
          ),
        ),
        configJson: const {
          "selectedInstitution": {
            "id": "5f2d08be60b92e2888287702",
            "auth_method": "mobile_banking"
          }
        },
        onLoad: () => log('widget_loaded'), // 加载回调
        onEvent: (eventName, data) => log(
          '$eventName: $data',
        ), // 事件回调
        onClose: (it) {
          log('Success: $it'); // 成功关闭回调
          code = it;
        },
      ).launchMono(context); // 在当前上下文中启动Mono
    } catch (e) {
      log(e.toString()); // 捕获并记录错误信息
    }
  }
}