flutter_tappay 0.3.0+2

  • Readme
  • Changelog
  • Example
  • Installing
  • 61

FlutterTappay #

pub package

A Flutter plugin to slove Tappay sdk. (only Direct pay for now.)

Usage #

To use this plugin, add flutter_tappay as a dependency in your pubspec.yaml file.

Preparation #

There is something that need to add before using this plugin, please follow the steps:

  1. Add default activity styles under res/values/styles.xml
    <style name="AppCompactTheme" parent="Theme.AppCompat.Light.DarkActionBar">
    </style>
  1. Add activity under AndroidManifest.xml, just below flutter activity.
    <activity
      android:name="github.tokenyet.flutter_tappay.TappayActivity"
      android:theme="@style/AppCompactTheme"
    >
    </activity>
  1. Add xmlns:tools="http://schemas.android.com/tools" in AndroidManifest.xml as example:
  <manifest xmlns:android="http://schemas.android.com/apk/res/android"
      xmlns:tools="http://schemas.android.com/tools"
      package="tw.idv.dowen.flutter_tappay_tester">
  1. Add tools:replace="android:label" in AndroidManifest.xml as example:
  <application
    tools:replace="android:label"
    android:name="io.flutter.app.FlutterApplication"
    android:label="flutter_tappay_tester"
    android:icon="@mipmap/ic_launcher">

That's it.

Example #

Flutter way(recommended):

// Import package
import 'package:flutter_tappay/flutter_tappay.dart';

// Instantiate it
FlutterTappay payer = FlutterTappay ();
payer.init(
    appKey: "app_whdEWBH8e8Lzy4N6BysVRRMILYORF6UxXbiOFsICkz0J9j1C0JUlCHv1tVJC",
    appId: 11334,
    serverType: FlutterTappayServerType.Sandbox
).then((_){
  setState(() {
    prepared = true;
  });
});

// Valid with your TextFormField (see example)
payer.validate(
        cardNumber: _cardNumber.text,
        dueMonth: _cardMonth.text,
        dueYear: _cardYear.text,
        ccv: _cardCCV.text,
      ).then((validationResult) {
        bool cardValid = validationResult.isCardNumberValid;
        bool dateValid = validationResult.isExpiryDateValid;
        bool ccvValid = validationResult.isCCVValid;
        _totalValid = cardValid && ccvValid && dateValid;
        if(cardValid == true)
          _isCardNumberValid = true;
        else
          _isCardNumberValid = _cardNumber.text != "" ? false : true;
        if(ccvValid == true)
          _isCardCCVValid = true;
        else
          _isCardCCVValid = _cardCCV.text != "" ? false : true;
        if(dateValid == true) {
          _isCardYearValid = true;
          _isCardMonthValid = true;
        } else {
          _isCardYearValid = _cardYear.text != "" ? false : true;
          _isCardMonthValid = _cardMonth.text != "" ? false : true;
        }

        setState(() {
        });
      });

// get token
  try {
    TappayTokenResponse response = await payer.sendToken(
      cardNumber: _cardNumber.text,
      dueYear: _cardYear.text,
      dueMonth: _cardMonth.text,
      ccv: _cardCCV.text,
    );
    setState(() {
      _token = response.prime;
    });
  } catch(err) {
    Scaffold.of(context).showSnackBar(
        SnackBar(
            content: Text("Payment error: ${err.toString()}")
        )
    );
  }

Platform-Native way:

// Import package
import 'package:flutter_tappay/flutter_tappay.dart';

// Instantiate it
FlutterTappay payer = FlutterTappay ();

// Listen to token
payer.onTokenReceived.listen((data) {
  setState(() {
    _token = data;
  });
}, onError: (err){ print("$err");}, onDone: (){ print("done");});

// Show Payment (The key and the id is the api that used in [official web demo](https://tappay.github.io/tappay-web-example/TapPay_Fields/example/index.html))
await FlutterTappay.showPayment(
  title: "Custom Title",
  btnName: "Custom BtnName",
  appKey: "app_whdEWBH8e8Lzy4N6BysVRRMILYORF6UxXbiOFsICkz0J9j1C0JUlCHv1tVJC",
  appId: 11334,
  serverType: FlutterTappayServerType.Sandbox
);

More Info #

It's really frustrated for flutter users to use ugly UI with native Android/iOS, If you are good at Android/iOS, please feel free to customize layout/activity_main.xml to make It more beauty, Moreover, pull request is welcome!

If you are using DirectPay only. The oher options might be just call API directly, since there is no rules for Tappay to prevent this happened, but this package is target to intergation with native method, that provided by official documentation.

Contribution #

  1. Android native way could have better UI, but I'm bad at Android layout, Welcome to make it better.
  2. Should add more support on Google/Samsung/Apple pay to both platform, currently, only DirectPay.

0.3.0+2 #

  1. Remove debugging message

0.3.0+1 #

  1. Remove dependency for flutter.jar, prevent comiple error from various version.

0.3.0 #

  1. Add iOS support to tappay

0.2.0 #

  1. Add form unrelated method, so flutter use could use own UI system!!

0.1.1+4 #

  1. Add pending state to btn to prevent user from clicking multiple time

0.1.1+3 #

  1. Add error feedback to prevent activity stucks

0.1.1+2 #

  1. Add Steps in demo

0.1.1+1 #

  1. Fix gif demo

0.1.1 #

  1. Update readme, ignore workspace.xml

0.1.0 #

  1. Support Direct Pay (Android)

example/lib/main.dart

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

import 'package:flutter/services.dart';
import 'package:flutter_tappay/flutter_tappay.dart';
import 'package:flutter_tappay_example/tappay_android_way.dart';
import 'package:flutter_tappay_example/tappay_flutter_way.dart';

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

class MyApp extends StatefulWidget {
  @override
  _MyAppState createState() => _MyAppState();
}

class _MyAppState extends State<MyApp> {
  @override
  void initState() {
    super.initState();
  }

  @override
  Widget build(BuildContext context) {
    return MaterialApp(
      home: HomePage()
    );
  }
}

class HomePage extends StatefulWidget {
  @override
  _HomePageState createState() => _HomePageState();
}

class _HomePageState extends State<HomePage> {
  @override
  Widget build(BuildContext context) {
    return Scaffold(
      appBar: AppBar(
        title: const Text('Plugin example app'),
      ),
      body: Center(
          child: Column(
            children: <Widget>[
              FlatButton(
                child: Text("Native way"),
                onPressed: (){
                  Navigator.of(context).push(
                      new MaterialPageRoute(
                          builder: (context) {
                            return TappayAndroidScreen();
                          }
                      ));
                },
              ),
              FlatButton(
                child: Text("Flutter way"),
                onPressed: (){
                  Navigator.of(context).push(
                      new MaterialPageRoute(
                          builder: (context) {
                            return TappayFlutterScreen();
                          }
                      ));
                },
              )
            ],
          )
      ),
    );
  }
}

Use this package as a library

1. Depend on it

Add this to your package's pubspec.yaml file:


dependencies:
  flutter_tappay: ^0.3.0+2

2. Install it

You can install packages from the command line:

with Flutter:


$ flutter pub get

Alternatively, your editor might support flutter pub get. Check the docs for your editor to learn more.

3. Import it

Now in your Dart code, you can use:


import 'package:flutter_tappay/flutter_tappay.dart';
  
Popularity:
Describes how popular the package is relative to other packages. [more]
23
Health:
Code health derived from static analysis. [more]
100
Maintenance:
Reflects how tidy and up-to-date the package is. [more]
100
Overall:
Weighted score of the above. [more]
61
Learn more about scoring.

We analyzed this package on Apr 7, 2020, and provided a score, details, and suggestions below. Analysis was completed with status completed using:

  • Dart: 2.7.1
  • pana: 0.13.6
  • Flutter: 1.12.13+hotfix.8

Dependencies

Package Constraint Resolved Available
Direct dependencies
Dart SDK >=2.1.0 <3.0.0
flutter 0.0.0
Transitive dependencies
collection 1.14.11 1.14.12
meta 1.1.8
sky_engine 0.0.99
typed_data 1.1.6
vector_math 2.0.8
Dev dependencies
flutter_test