Drop-in UI
Setup and Integration
Configuration
To use the Drop-in UI, you'll need to get a tokenization key from the Control Panel or you can generate a client token on your server.
Setup
Gradle
Use Gradle to integrate with the Braintree Android SDK.
In your app's build.gradle, add the following:
- Groovy
dependencies {
implementation 'com.braintreepayments.api:drop-in:'
}
Client-side implementation
Starting Drop-in
If you're going to launch the Drop-in UI from a button, and you've set the button's onClick handler in XML via android:onClick="onBraintreeSubmit", add the method as:
- Android
public void onBraintreeSubmit(View v) {
DropInRequest dropInRequest = new DropInRequest()
.clientToken(clientToken);
startActivityForResult(dropInRequest.getIntent(this), REQUEST_CODE);
}
When your user provides payment information, your app receives a paymentMethodNonce in your calling AppCompatActivity#onActivityResult, which you will override to get the response or any possible errors:
- Android
@Override
protected void onActivityResult(int requestCode, int resultCode, Intent data) {
if (requestCode == REQUEST_CODE) {
if (resultCode == RESULT_OK) {
DropInResult result = data.getParcelableExtra(DropInResult.EXTRA_DROP_IN_RESULT);
// use the result to update your UI and send the payment method nonce to your server
} else if (resultCode == RESULT_CANCELED) {
// the user canceled
} else {
// handle errors here, an exception may be available in
Exception error = (Exception) data.getSerializableExtra(DropInActivity.EXTRA_ERROR);
}
}
}
Configuring payment methods
Additional steps are required for the Drop-in UI to accept payment methods other than cards. After completing the Drop-in setup instructions, follow the steps below for each payment method type.
Google Pay
In order for Drop-in to support Google Pay, you must ensure you've added the required meta-data tag in your AndroidManifest.xml.
Then, construct a GooglePaymentRequest object and add it to your DropInRequest.
- Android
private void enableGooglePay(DropInRequest dropInRequest) {
GooglePaymentRequest googlePaymentRequest = new GooglePaymentRequest()
.transactionInfo(TransactionInfo.newBuilder()
.setTotalPrice("1.00")
.setTotalPriceStatus(WalletConstants.TOTAL_PRICE_STATUS_FINAL)
.setCurrencyCode("USD")
.build())
// We recommend collecting and passing billing address information
// with all Google Pay transactions as a best practice.
.billingAddressRequired(true);
dropInRequest.googlePaymentRequest(googlePaymentRequest);
}
If using a client token with a customer id, the Google Pay card will not automatically be vaulted. You can use the payment method nonce to create a payment method on your server.
Venmo
To support Venmo payments in the Drop-in UI, make sure to follow the browser switch setup instructions in the Client SDK Setup and complete the full Venmo integrations.
3D Secure
Drop-in supports 3D Secure 2 verification. To use 3D Secure in your integration, make sure browser switch is set up and then follow our implementation guide. Once you have added 3D Secure to Drop-in, you will need to complete the server-side implementation for 3D Secure.
Displaying the most recently added payment method
If your user already has an existing payment method, you may not need to show Drop-in. You can check if they have an existing payment method using DropInResult#fetchDropInResult. A payment method will only be returned when using a client token created with a customer_id
.
- Android
DropInResult.fetchDropInResult(appCompatActivity, clientToken, new DropInResult.DropInResultListener() {
@Override
public void onError(Exception exception) {
// an error occurred
}
@Override
public void onResult(DropInResult result) {
if (result.getPaymentMethodType() != null) {
// use the icon and name to show in your UI
int icon = result.getPaymentMethodType().getDrawable();
int name = result.getPaymentMethodType().getLocalizedName();
PaymentMethodType paymentMethodType = result.getPaymentMethodType();
if (paymentMethodType == PaymentMethodType.GOOGLE_PAYMENT) {
// The last payment method the user used was Google Pay.
// The Google Pay flow will need to be performed by the
// user again at the time of checkout.
} else {
// Use the payment method show in your UI and charge the user
// at the time of checkout.
PaymentMethodNonce paymentMethod = result.getPaymentMethodNonce();
}
} else {
// there was no existing payment method
}
}
}
});
Next steps
- Read the Set Up Your Server guide to learn about our server SDKs and how to send a nonce to your server
- Explore the ways to customize the appearance and functionality of Drop-in
- Learn how to manage different payment methods
Next Page: Customization →