react-native-braintree-dropin-ui
React Native integration of Braintree Drop-in IOS V4 ANDROID V2 (Apple Pay &Android Pay Enabled)
Getting started
npm install react-native-braintree-dropin-ui --save
Mostly automatic installation
react-native link react-native-braintree-dropin-ui
iOS specific
You must have a iOS deployment target >= 9.0.
If you don't have a Podfile or are unsure on how to proceed, see the CocoaPods usage guide.
In your Podfile
, add:
pod 'Braintree'
pod 'BraintreeDropIn'
# comment the next line to disable Apple pay
pod 'Braintree/Apple-Pay'
# comment the next line to disable PayPal
pod 'Braintree/PayPal'
# comment the next line to disable Venmo
pod 'Braintree/Venmo'
# Data collector for Braintree Advanced Fraud Tools
pod 'Braintree/DataCollector'
# comment the next line to disable credit card scanning
pod 'CardIO'
Then:
cd iospod repo update # optional and can be very long pod install
Apple Pay
If you've included the Apple Pay pod or framework in your project, Drop-in will show Apple Pay as a payment option as long as you've completed the Apple Pay integration and the customer's device and card type are supported.
Android specific
Add in your app/build.gradle
:
dependencies {
...
implementation project(':react-native-braintree-dropin-ui')
implementation "io.card:android-sdk:5.+"
implementation 'com.braintreepayments.api:data-collector:2.+'
implementation 'com.google.android.gms:play-services-wallet:11.4.0'
Add in your AndroidManifest.xml
:
<!-- Enables the Google Pay API -->
<meta-data
android:name="com.google.android.gms.wallet.api.enabled"
android:value="true"/>
Add in your MainApplication.java
:
import tech.power.RNBraintreeDropIn.RNBraintreeDropInPackage;
return Arrays.<ReactPackage>asList(
... ...
new RNBraintreeDropInPackage() // <------ add here
);
Configuration
For more configuration options, see Braintree's documentation (iOS | Android).
3D Secure
If you plan on using 3D Secure, you have to do the following.
iOS
Configure a new URL scheme
Add a bundle url scheme {BUNDLE_IDENTIFIER}.payments
in your app Info via XCode or manually in the Info.plist
.
In your Info.plist
, you should have something like:
CFBundleURLTypes CFBundleTypeRole Editor CFBundleURLName com.myapp CFBundleURLSchemes com.myapp.payments
Update your code
In your AppDelegate.m
:
...- (BOOL)application:(UIApplication *)application didFinishLaunchingWithOptions:(NSDictionary *)launchOptions - (BOOL)application:(UIApplication *)application openURL:(NSURL *)url options:(NSDictionary<UIApplicationOpenURLOptionsKey,id> *)options - (NSString *)paymentsURLScheme
Android
Setup browser switch.
Usage
For the API, see the Flow typings.
Basic
; BraintreeDropIn;
3D Secure
; BraintreeDropIn;