Android

Offrez Affirm comme option de paiement sur les applications Android.

Aperçu

Starting a payment with Affirm on an Android client consists of the following:

  • Creating a checkout form.
  • Tokenizing customer information to transmit it securely to your server.
  • Using the checkout_token to initiate a transaction.

Ce guide vous explique la manière de configurer le client Android sur vos pages de paiement.

Le SDK Android est disponible sur Github.


1. Configurer Affirm sur Android

Avec Gradle

Pour installer le SDK, ajoutez affirm-merchant-sdk-android au bloc de dépendances de votre fichier app/build.gradle:

apply plugin: 'com.android.application'

android { ... }

dependencies {
  // ...

  // Affirm Android SDK
  implementation 'com.affirm:affirm-android-sdk:2.0.19'
}

Avec Maven

Ajoutez la dépendance Affirm à votre fichier pom.xml :

<dependency>
  <groupId>com.affirm</groupId>
  <artifactId>affirm-android-sdk</artifactId>
  <version>2.0.19</version>
</dependency>

🚧

SDK Releases

Pour en savoir plus sur la dernière version du SDK et les versions antérieures, consultez la page des versions sur GitHub. Pour recevoir des notifications lorsqu'une nouvelle version est publiée, surveillez communiqués pour le dépôt.


2. Initialiser Affirm

Configurez le SDK avec votre clé API publique Affirm pour envoyer des demandes au serveur Affirm.

Affirm.initialize(Affirm.Configuration.Builder("public key")
			.setEnvironment(Affirm.Environment.SANDBOX)
			.setMerchantName("merchant name")
			.setReceiveReasonCodes("true")
			.setLogLevel(Affirm.LOG_LEVEL_DEBUG)
			.setCheckoutRequestCode(8001)
			.setVcnCheckoutRequestCode(8002)
			.setPrequalRequestCode(8003)
			.build())

3. Rendu du paiement Affirm

La création de paiement est le processus dans lequel un client utilise Affirm pour payer un achat dans votre application. Vous pouvez créer un objet checkout et lancez le paiement Affirm à l'aide de fonction Checkout.

final Checkout checkout = Checkout.builder()
        .setOrderId("order id")
        .setItems(items)
        .setBilling(shipping)
        .setShipping(shipping)
        .setShippingAmount(0f)
        .setTaxAmount(100f)
        .setTotal(1100f)
        .build();
 
Affirm.startCheckout(this, checkout, false);

🚧

Checkout Amounts

The checkout object contains details about the order. Amounts should be in dollar amounts represented as Floats.


4. Add Affirm Promotional Messaging

Les composants de la messagerie promotionnelle Affirm- messages de paiement mensuels et modaux éducatifs - - expliquent aux clients la manière dont ils peuvent utiliser Affirm pour financer leurs achats. Une messagerie promotionnelle correctement placée contribuent à augmenter la valeur moyenne des commandes et la conversion.

Add Monthly Payment Messaging

Pour afficher la messagerie promotionnelle, notre SDK fournit une classe AffirmPromotionButton . Pour mettre en œuvre le AffirmPromotionButton:

<com.affirm.android.AffirmPromotionButton
    android:id="@+id/promo"
    android:layout_width="wrap_content"
    android:layout_height="wrap_content"
    android:layout_below="@id/price"
    android:layout_centerHorizontal="true"
    android:layout_marginTop="20dp"
    app:htmlStyling="false"
    app:affirmTextFont="@font/apercu_bold"
    app:affirmTextColor="@android:color/darker_gray"
    app:affirmTextSize="16sp"
    app:affirmColor="AffirmColorTypeBlue"
    app:affirmLogoType="AffirmDisplayTypeLogo"/>

Utilisez l'une des méthodes de mise en œuvre suivantes: 

// Option1 - Load via findViewById
AffirmPromotionButton affirmPromotionButton1 = findViewById(R.id.promo);
Affirm.configureWithAmount(affirmPromotionButton1, null, PromoPageType.PRODUCT, 1100, true);
// Option2 - Initialize by new
AffirmPromotionButton affirmPromotionButton2 = new AffirmPromotionButton(this);
((FrameLayout)findViewById(R.id.promo_container)).addView(affirmPromotionButton2);
Affirm.configureWithAmount(affirmPromotionButton2, null, PromoPageType.PRODUCT, 1100, true);

Pour personnaliser le bouton de messagerie promotionnelle, nous avons deux options:

Option 1: Use configWithLocalStyling to Use the Local Styles on the String within the Button

// You can custom with the AffirmColor, AffirmLogoType, Typeface, TextSize, TextColor
affirmPromotionButton2.configWithLocalStyling(
                AffirmColor.AFFIRM_COLOR_TYPE_BLUE,
                AffirmLogoType.AFFIRM_DISPLAY_TYPE_LOGO,
                ResourcesCompat.getFont(this, R.font.apercu_bold),
                android.R.color.darker_gray,
                R.dimen.affirm_promotion_size);

Option 2: configWithHtmlStyling will Use HTML Style from Affirm Server. You Can Add Fonts by Following the Steps Below, so you can Customize the Fonts in HTML.

1. Ajoutez un fichier de police dans le répertoire /res/font/ . Comme lacquer_regular.ttf.
2. Ajoutez une déclaration pour le fichier de police. Vous pouvez vérifier le détail dans la police de caractères .
3. Utiliser la police dans le fichier css. Vous pouvez vérifier les détails dans remote_promo.css.

// If you want to custom the style of promo message, should pass the local or remote url and the file of typeface declaration
affirmPromotionButton2.configWithHtmlStyling("file:///android_asset/remote_promo.css", typefaceDeclaration);

En tapant sur le AffirmPromotionButton démarre automatiquement le flux de préqualification. Si vous souhaitez gérer les erreurs, remplacez onActivityResult afin qu'Affirm puisse gérer le résultat.

@Override
protected void onActivityResult(int requestCode, int resultCode, @Nullable Intent data) {
    if (Affirm.handlePrequalData(this, requestCode, resultCode, data)) {
        return;
    }
    super.onActivityResult(requestCode, resultCode, data);
}

@Override
public void onAffirmPrequalError(String message) {
    Toast.makeText(this, "Prequal Error: " + message, Toast.LENGTH_LONG).show();
}

Fetch Promotional Message, then Display it with Your Own TextView.

  • Vous pouvez recevoir le message promotionnel via fetchPromotion, un objet SpannableString est renvoyé après la réussite de la demande.
  • onPromotionClick: Cette méthode gère les événements qui cliquent sur le message promotionnel
TextView promotionTextView = findViewById(R.id.promotionTextView);
    Affirm.PromoRequestData requestData = new Affirm.PromoRequestData.Builder(PRICE, true)
        .setPromoId(null)
        .setPageType(null)
        .build();

    promoRequest = Affirm.fetchPromotion(requestData, promotionTextView.getTextSize(), this, new PromotionCallback() {
        @Override
        public void onSuccess(@Nullable SpannableString spannableString, boolean showPrequal) {
            promotionTextView.setText(spannableString);
            promotionTextView.setOnClickListener(v -> Affirm.onPromotionClick(MainActivity.this, requestData, showPrequal));
        }
   
        @Override
        public void onFailure(@NonNull AffirmException exception) {
                   Toast.makeText(getBaseContext(), "Failed to get promo message, reason: " + exception.toString(), Toast.LENGTH_SHORT).show();
            }
        });

L'appel à la méthode create lancera la demande, et l'appel à la méthode cancel annulera la demande.

@Override
    protected void onStart() {
        super.onStart();
        promoRequest.create();
    }

    @Override
    protected void onStop() {
        promoRequest.cancel();
        super.onStop();
    }

Suivre la commande confirmée

L'événement trackOrderConfirmed s'est déclenché lorsqu'un client effectue l'achat. Notre SDK fournit l'objet AffirmTrack pour déclencher le suivi.

final AffirmTrack affirmTrack = AffirmTrack.builder()
        .setAffirmTrackOrder(affirmTrackOrder)
        .setAffirmTrackProducts(affirmTrackProducts)
        .build();

Affirm.trackOrderConfirmed(MainActivity.this, trackModel());
  • Puisqu'il n'y a pas de rappel, il renverra le succès après un délai de 10 secondes.
  • Nous remplacerons l'API HTTP une fois l'API terminée.

5. Handle Callbacks

Assurez-vous de remplacer onActivityResult, puis à appeler la méthode handleCheckoutData . Il retournera le checkout_token requis pour initier la transaction sur votre serveur.

@Override
protected void onActivityResult(int requestCode, int resultCode, @Nullable Intent data) {
    if (Affirm.handleCheckoutData(this, requestCode, resultCode, data)) {
        return;
    }
    super.onActivityResult(requestCode, resultCode, data);
}

Nous avons également quelques fonctions de gestionnaire supplémentaires disponibles :

@Override
public void onAffirmCheckoutSuccess(@NonNull String token) {
    Toast.makeText(this, "Checkout token: " + token, Toast.LENGTH_LONG).show();
}
 
@Override
public void onAffirmCheckoutCancelled() {
    Toast.makeText(this, "Checkout Cancelled", Toast.LENGTH_LONG).show();
}
 
@Override
public void onAffirmCheckoutError(String message) {
    Toast.makeText(this, "Checkout Error: " + message, Toast.LENGTH_LONG).show();
}

👍

Checkout Token

Une fois que le paiement a été confirmé par l'utilisateur, l'objet AffirmCheckoutDelegate recevra un checkout_token. Ce jeton doit être transféré sur votre serveur, qui doit être utilisé pour autoriser des frais sur le compte de l'utilisateur.


6. Créer une charge

Lorsqu'un client réussit à passer à la caisse, il est enregistré comme une nouvelle tentative d'achat. Cela doit être géré côté serveur pour être traité via notre API Charges.