Mobile SDK Advanced Options

Advanced Options

Here you can find some examples of advanced workflow customization for our ready-to-use UI.



PAYMENT METHODS

Brand management

There are 2 possible ways to set brands for your checkout:
  • In your app (see Configuring Checkout Settings)
  • In the merchant and administration portal - allowing to update the brands offered to shoppers without requiring an update of the mobile app.

Located under "Administration > Emetec Payment Button > Categories > Brands", you optionally can define which brands are displayed in the checkout by configuring the "Allowed Brands" on a channel, or any of its parents/ancestors.

To activate the brand configuration through the merchant and administration portal, first set the "Activate Brand Management" to TRUE.

The last setting "Override shop brands" is used to decide on the policy to propagate new Brands you enter to the checkout:
  • Either override whatever was defined in the shop. (Value TRUE)
  • Or offer only brands for payment, that are both specified in the BIP and in the checkout settings in the app (Value FALSE, default)

Display total amount

Total amount will be shown on the payment method selection screen and on the payment forms right in the button like on the screenshots below.

Custom logos

Since version 2.48.0 ready-to-use UI allows to set your custom logos for the payment brands.

Remove back button

Back button will not be shown on payment form and screenshot looks like below.

CREDIT CARD

Skipping CVV

Checkout project provides an opportunity to skip CVV request for all cards or only for stored ones.

Skipping card holder

If you are not going to collect holder name for the card payments, you can just hide this field using appropriate configuration of the :

Override card holder validation

Since version 2.29.0 ready-to-use UI allows you to override holder validation for the card payments.

Display installment options

Display billing address

It's possible to have the billing address fields available and have them pre-filled.

Card brand detection

Card brand is detected automatically while shopper is typing the card number. However there are some configurations you might want to apply regarding your needs.

Firstly you can choose between different ways of brand detection:

  • using base of regular expressions
  • using library of bins, which is more precise.

Then you should choose how to proceed if multiple card brands are detected.

  • Set the order for detected brands
  • Decide whether you want either present multiple brands or hide them by default

Below you can see more detailed description for each configuration with user cases and video snippets.

Brand detection type
Brands priority
Brand detection appearance style

REGEX

Regular expression is set of rules to detect card brand. It works fast and quite reliable.

This type of brand detection is used by default, but you can explicitly specify the type in the code:

Use case:
  1. Configured brands: VISA, MASTER, MAESTRO, AMEX
  2. Shopper types 5710 1000 0000 0008
  3. MASTER, MAESTRO are detected
  4. MASTER is choosen by default

BIN LIST

The library of bins is more precise way to detect card brand, but it works a bit slower. The library is regularly updated, so it's the most reliable source.

To enable brand detection by bin list, change the following option in CheckoutSettings

Use case:
  1. Configured brands: VISA, MASTER, MAESTRO, AMEX
  2. Bin list brand detection type is enabled
  3. Shopper types 5710 1000 0000 0008
  4. MASTER, MAESTRO are detected first (still use regular expression as fallback)
  5. After 6 digits typed, card bin is searched in bin list which says it's a MAESTRO card, not MASTER

SECURITY

CALLBACKS

Receiving callbacks during checkout process

Summary page

Receiving callbacks during checkout process using OnBeforeSubmitCallback

Since the update there is another way to handle before submit event using OnBeforeSubmitCallback.

Create new class which will implement OnBeforeSubmitCallback interface.

public class CheckoutOnBeforeSubmitListener extends OnBeforeSubmitCallback {
    @Override
    public void onBeforeSubmitUpdate(@NonNull PaymentDetails paymentDetails,
                                                             @NonNul Listener callback) {
        String currentCheckoutId = paymentDetails.getCheckoutId();
        String paymentBrand = paymentDetails.getPaymentBrand();
        /* You can use this callback to request a new checkout ID if selected payment brand requires 
               some specific parameters or just send back the same checkout id to continue checkout process */
        paymentDetails.setCheckoutId(newCheckoutId);
        
        /* You also can abort the transaction using this method */
        paymentDetails.setAborted(true);

        /* Once you are ready to continue the payment flow pass updated paymentDetails to the callback*/
        callback.onComplete(paymentDetails);
    }
}
class CheckoutOnBeforeSubmitListener() : OnBeforeSubmitCallback {
    override fun onBeforeSubmitUpdate(paymentDetails: PaymentDetails, callback: OnBeforeSubmitCallback.Listener) {
        val currentCheckoutId = paymentDetails.checkoutId
        val paymentBrand = paymentDetails.paymentBrand

        /* You can use this callback to request a new checkout ID if selected payment brand requires 
               some specific parameters or just send back the same checkout id to continue checkout process */
        paymentDetails.checkoutId = newCheckoutId

        /* Once you are ready to continue the payment flow pass updated paymentDetails to the callback*/
        callback.onComplete(paymentDetails)
    }
}

You can cancel a payment. In this case set false during paymentDetails.setCanceled() call. Then checkout will be closed with ErrorCode.ERROR_CODE_TRANSACTION_ABORTED code.

paymentDetails.setCanceled(true);
callback.onComplete(paymentDetails);
paymentDetails.isCanceled = true
 callback.onComplete(paymentDetails)

Emetec Payment Button in mobile SDK

Important: In some rare cases, a payment method cannot be integrated natively in the mobile SDK, but we still want to offer that payment method. For this case, the alternative solution is Emetec Payment Button integration inside mobile SDK. Please consider this option as an alternative only and not a default integration. As it stands, Emetec Payment Button integration inside Mobile SDK can be used for brand "ONEY".