Remit2Any Flutter Plugin #

A Flutter plugin for integrating Remit2Any web components using a WebView.

Installation #

Add the following dependency to your pubspec.yaml file:

dependencies:
  remit2any_flutter:
    git:
      url: https://github.com/your-repo/remit2any_flutter.git
      ref: main

Run flutter pub get to install the package.

Usage #

Import the Plugin #

import 'package:remit2any_flutter/remit2any_flutter.dart';

Remit2Any WebView Widget #

The Remit2AnyWebView widget allows you to integrate various Remit2Any web components into your Flutter application using a WebView. You can pass dynamic parameters such as component type, token, stylesheet URL, script URL, class names, and button text.

Example: Remit2Any Show Bank Accounts Component #

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

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

class MyApp extends StatelessWidget {
  @override
  Widget build(BuildContext context) {
    return MaterialApp(
      home: HomeScreen(),
    );
  }
}

class HomeScreen extends StatelessWidget {
  @override
  Widget build(BuildContext context) {
    return Scaffold(
      appBar: AppBar(title: Text('Remit2Any Integration')),
      body: Center(
        child: ElevatedButton(
          onPressed: () {
            Navigator.push(
              context,
              MaterialPageRoute(
                builder: (context) => Remit2AnyWebView(
                  componentType: 'remit2any-show-bank-accounts',
                  token: 'your-token-here',
                  styleSheetUrl: 'https://your-cdn.com/path/to/style.css',
                  scriptUrl: 'https://your-cdn.com/path/to/remit2any-ui-sdk.js',
                  componentAttributes: {
                    'default-class': 'r2a-bank',
                    'bank-accounts': [
                      {
                        "ifsc": "100112012",
                        "bank_name": "ICICI",
                        "name": "Mahesh",
                        "account_number": "1234567890"
                      },
                      {
                        "ifsc": "100112012",
                        "bank_name": "HSBC",
                        "name": "Mahesh",
                        "account_number": "1234567890"
                      }
                    ],
                  },
                  buttonClassName: 'custom-button-class',
                  defaultClassName: 'custom-default-class',
                  buttonText: 'Show Bank Accounts',
                  onResult: (message) {
                    print('Result: $message');
                  },
                  onError: (message) {
                    print('Error: $message');
                  },
                ),
              ),
            );
          },
          child: Text('Open Show Bank Accounts Component'),
        ),
      ),
    );
  }
}

Example: Remit2Any Indian Bank Accounts Component #

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

class IndianBankAccountsComponent extends StatelessWidget {
  @override
  Widget build(BuildContext context) {
    return Scaffold(
      appBar: AppBar(title: Text('Remit2Any Indian Bank Accounts')),
      body: Center(
        child: Remit2AnyWebView(
          componentType: 'remit2any-indian-bank-accounts',
          token: 'your-token-here',
          styleSheetUrl: 'https://your-cdn.com/path/to/style.css',
          scriptUrl: 'https://your-cdn.com/path/to/remit2any-ui-sdk.js',
          componentAttributes: {
            'default-class': 'r2a-bank-accounts',
            'env': 'sandbox',
          },
          buttonClassName: 'custom-button-class',
          defaultClassName: 'custom-default-class',
          buttonText: 'Add Indian Bank Account',
          onResult: (message) {
            print('Result: $message');
          },
          onError: (message) {
            print('Error: $message');
          },
        ),
      ),
    );
  }
}

Example: Remit2Any Indian KYC Component #

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

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

class MyApp extends StatelessWidget {
  @override
  Widget build(BuildContext context) {
    return MaterialApp(
      home: HomeScreen(),
    );
  }
}

class HomeScreen extends StatelessWidget {
  @override
  Widget build(BuildContext context) {
    return Scaffold(
      appBar: AppBar(title: Text('Remit2Any Integration')),
      body: Center(
        child: ElevatedButton(
          onPressed: () {
            Navigator.push(
              context,
              MaterialPageRoute(
                builder: (context) => Remit2AnyWebView(
                  componentType: 'remit2any-indian-kyc',
                  token: 'your-token-here',
                  styleSheetUrl: 'https://your-cdn.com/path/to/style.css',
                  scriptUrl: 'https://your-cdn.com/path/to/remit2any-ui-sdk.js',
                  componentAttributes: {
                    'default-class': 'r2a-inkyc',
                    'env': 'sandbox',
                  },
                  buttonClassName: 'custom-button-class',
                  defaultClassName: 'custom-default-class',
                  buttonText: 'India KYC',
                  onResult: (message) {
                    print('Result: $message');
                  },
                  onError: (message) {
                    print('Error: $message');
                  },
                ),
              ),
            );
          },
          child: Text('Open Indian KYC Component'),
        ),
      ),
    );
  }
}

Example: Remit2Any US KYC Component #

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

class USKYCComponent extends StatelessWidget {
  @override
  Widget build(BuildContext context) {
    return Scaffold(
      appBar: AppBar(title: Text('Remit2Any US KYC')),
      body: Center(
        child: Remit2AnyWebView(
          componentType: 'remit2any-us-kyc',
          token: 'your-token-here',
          styleSheetUrl: 'https://your-cdn.com/path/to/style.css',
          scriptUrl: 'https://your-cdn.com/path/to/remit2any-ui-sdk.js',
          componentAttributes: {
            'default-class': 'r2a-uskyc',
            'env': 'sandbox',
            'debug': 'true',
            'attach-to-id': 'parent-id-1',
          },
          buttonClassName: 'custom-button-class',
          defaultClassName: 'custom-default-class',
          buttonText: 'USA KYC',
          onResult: (message) {
            print('Result: $message');
          },
          onError: (message) {
            print('Error: $message');
          },
        ),
      ),
    );
  }
}

Example: Remit2Any US Bank Accounts Component #

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

class USBankAccountsComponent extends StatelessWidget {
  @override
  Widget build(BuildContext context) {
    return Scaffold(
      appBar: AppBar(title: Text('Remit2Any US Bank Accounts')),
      body: Center(
        child: Remit2AnyWebView(
          componentType: 'remit2any-us-bank-accounts',
          token: 'your-token-here',
          styleSheetUrl: 'https://your-cdn.com/path/to/style.css',
          scriptUrl: 'https://your-cdn.com/path/to/remit2any-ui-sdk.js',
          componentAttributes: {
            'default-class': 'r2a-usbank',
            'env': 'sandbox',
            'debug': 'true',
            'attach-to-id': 'parent-id-2',
          },
          buttonClassName: 'custom-button-class',
          defaultClassName: 'custom-default-class',
          buttonText: 'Add US Bank Account',
          onResult: (message) {
            print('Result: $message');
          },
          onError: (message) {
            print('Error: $message');
          },
        ),
      ),
    );
  }
}