xamarin-paytabs-binding

Xamarin PayTabs binding library is a wrapper for the native PayTabs Android and iOS SDKs, It helps you integrate your Xamarin project with PayTabs.

Library Support:

iOS
Android

Features

The libaray offers a ready-made card payment screen.
Card Scanner for quick & easy entry of card details (iOS 13.0+).
Handle the missing required billing and shipping details.
Logo, colors, and fonts become easy to be customized.
Apple Pay and SamsunPay are supported.
Support dark mode.
Alternative payment methods supported.
Support tokenisation.

Installation

We created a binding for each platform (iOS & Android)

iOS

Install-Package Paytabs.Xamarin.Ios -Version 1.1.0

Android

Install-Package Paytabs.Xamarin.Android -Version 1.0.8
Install-Package Xamarin.Android.Device.YearClass
donwload CardScanBindingLib.dll and add it as a reference in your project

Usage (iOS)

in your project info.plist add Privacy - Photo Library Usage Description key .. we use camera to enable camera card scanning

Pay with Card

Configure the billing & shipping info, the shipping info is optional

PaymentBillingDetails billingDetails = new PaymentBillingDetails
        {
            Name = "John Smith",
            Email = "email@domain.com",
            Phone = "+971111111111",
            AddressLine = "Address line",
            City = "Dubai",
            State = "Dubai",
            CountryCode = "AE",
            Zip = "12345"
        };

PaymentShippingDetails shippingDetails = new PaymentShippingDetails
        {
            Name = "John Smith",
            Email = "email@domain.com",
            Phone = "+971111111111",
            AddressLine = "Address line",
            City = "Dubai",
            State = "Dubai",
            CountryCode = "AE",
            Zip = "12345"
        };

Create an object of PaymentConfiguration and fill it with your credentials and payment details.

PaymentConfiguration configuration = new PaymentConfiguration
        {
            ProfileID = "*Profile Id*",
            ServerKey = "*Server key*",
            ClientKey = "*Client Key*",
            MerchantCountryCode = "AE",
            Currency = "USD",
            Amount = 130,
            CartID = "123456",
            CartDescription = "Buy 2 Flowers",
            MerchantName = "Flowers Store",
            ScreenTitle = "Pay with Card",
        };

Setting the billing info

configuration.BillingDetails = billingDetails;

Options to show billing and shipping ifno

configuration.ShowBillingInfo = true;
configuration.ShowShippingInfo = true;

Implement the IPaymentCallback interface to handle the payment details & events callback.

public partial class ViewController : IPaymentCallback
{
    [Export("paymentManagerWithDidFinishTransaction:error:")]
    public void PaymentManagerWithDidFinishTransaction(PaymentTransactionDetails transactionDetails, NSError error)
    {
        if (error == null)
        {
            string result = "Transaction Details:";
            result += "\nResponseCode: " + transactionDetails.PaymentResult.ResponseCode;
            result += "\nResponseMessage: " + transactionDetails.PaymentResult.ResponseMessage;
            result += "\nTransactionReference: " + transactionDetails.TransactionReference;
            if (transactionDetails.Token != null)
            {
                result += "\nToken: " + transactionDetails.Token;
            }
            Console.WriteLine(result);
        }
        else
        {
            Console.WriteLine(error.LocalizedDescription);
        }
    }

    [Export("paymentManagerWithDidCancelPayment:")]
    public void PaymentManagerWithDidCancelPayment(NSError error)
    {
        Console.WriteLine("Cancel Event Handled");
    }

    [Export("paymentManagerWithDidStartPaymentTransaction:")]
    public void PaymentManagerWithDidStartPaymentTransaction(UIViewController rootViewController)
    {
			Console.WriteLine("Payment Proccess Started");
    }
}

Call StartCardPayment method

Define a variable of type PaymentSDKProxy

private PaymentSDKProxy _proxy;

Call the StartCardPayment method

 _proxy.StartCardPaymentWithConfiguration(configuration, this);

Pay with Apple Pay

Follow the guide Steps to configure Apple Pay to learn how to configure ApplePay with PayTabs.
Do the steps 1, 2, and 3 from Pay with Card, although you can ignore Billing & Shipping details and Apple Pay will handle it, you must add the merchant name and merchant Apple Pay indentifier to the configuration.

    configuration.MerchantName = "Flowers Store";
    configuration.MerchantApplePayIdentifier = "merchant.com.bundleID";

To simplify ApplePay validation on all user's billing info, pass SimplifyApplePayValidation parameter in the configuration with true.

configuration.SimplifyApplePayValidation = true;

Call StartApplePayPayment to start the payment.

_proxy.StartApplePayPaymentWithConfiguration(configuration, this);

Pay with Alternative Payment Methods

It becomes easy to integrate with other payment methods in your region like STCPay, OmanNet, KNet, Valu, Fawry, UnionPay, and Meeza, to serve a large sector of customers.

Do the steps 1, 2, and 3 from Pay with Card.
Choose one or more of the payment methods you want to support.

configuration.AlternativePaymentMethods = new string[] { AlternativePaymentMethod.StcPay, ... };

Start payment by calling StartAlternativePaymentMehtodWithConfiguration method and handle the transaction details

_proxy.StartAlternativePaymentMehtodWithConfiguration(configuration, this);

Tokenisation

Follow the below instructions to enable the tokenisation.

Request token

configuration.TokeniseType = TokeniseType.UserOptional; // read more about the tokeniseType in the constants section 
configuration.TokenFormat = TokeniseFromat.Hex32Format; // read more about the tokenFormat in the constants section

After passing the above parameters, you will receive token and transaction reference in the callback, save them for future usage.

Pass the token & transaction reference

configuration.Token = token
configuration.TransactionReference = transactionreference

Show/Hide Card Scanner

configuration.HideCardScanner = true;

Theme Customization

Create an instance from the class PaymentTheme and configure its fonts and colors.

PaymentTheme theme = new PaymentTheme
    {
        BackgroundColor= "4853b8", // color hex value
        PrimaryColor = "956596"
    };
    
configuration.Theme = theme;

Constants

The following constants will help you in customizing your configuration.

Tokenise types

The default type is none

TokeniseType {
    None, 
    MerchantMandatory,
    UserMandatory,
    UserOptional;
}

configuration.TokeniseType = TokeniseType.UserOptional;

Transaction classes

The default class is ecom

TransactionClass {
    Ecom, 
    Recurring;
}

configuration.TransactionClass = TransactionClass.Recurring;

Token formats

The default format is hex32

TokeniseFromat {
    None, 
    Hex32, 
    AlphaNum20, 
    Digit22, 
    Digit16, 
    AlphaNum32;
}

configuration.TokenFormat = TokeniseFromat.Hex32;

Transaction types

The default type is sale

TransactionType {
    Sale, 
    Authorize;
}

configuration.TransactionType = TransactionType.Sale;

Alternative payment methods

AlternativePaymentMethod {
    UnionPay, 
    StcPay, 
    Valu, 
    MeezaQR, 
    Omannet, 
    KnetCredit, 
    KnetDebit, 
    Fawry;
}

configuration.alternativePaymentMethods = new string[] { AlternativePaymentMethod.StcPay, ...};

Usage (Android)

Pay with Card

Configure the billing & shipping info, the shipping info is optional

PaymentBillingDetails billingDetails = new PaymentSdkBillingDetails("Dubai",
	"AE",
	"email@domain.com",
	"John Smith", 
	"+971111111111", 
	"Dubai","Address line",
	"12345");

PaymentSdkShippingDetails shippingDetails = new PaymentSdkShippingDetails("Dubai",
	"AE",
	"email@domain.com",
	"John Smith", 
	"+971111111111", 
	"Dubai","Address line",
	"12345");

Create an object of PaymentConfiguration and fill it with your credentials and payment details.

PaymentSdkConfigurationDetails configuration = new PaymentSdkConfigBuilder("*Profile ID*", 
"*Server Key*", "*Client Key*", 44.0, "USD")
                .SetCartId("123")
                .SetCartDescription("yyif")
                .SetMerchantCountryCode("AE")
                .SetBillingData(billDetails)
                .SetShippingData(shippingDetails)
                .Build();

Setting the billing info

configuration.BillingDetails = billingDetails;

Options to show billing and shipping info

configuration.ShowBillingInfo = true;
configuration.ShowShippingInfo = true;

Implement the ICallbackPaymentInterface interface to handle the payment details & events callback.

public void OnError(PaymentSdkError error)
{
    Console.WriteLine(error.Msg);
}

public void OnPaymentCancel()
{
    Console.WriteLine("OnPaymentCancel");
}

public void OnPaymentFinish(PaymentSdkTransactionDetails paymentSdkTransactionDetails)
{
    Console.WriteLine(paymentSdkTransactionDetails);
}

Call the StartCardPayment method

 PaymentSdkActivity.StartCardPayment(this,configuration, this);

Pay with Alternative Payment Methods

Do the steps 1, 2, and 3 from Pay with Card.
Choose one or more of the payment methods you want to support.

IList<PaymentSdkApms> apms = new List<PaymentSdkApms>();
apms.Add(PaymentSdkApms.StcPay);
            
configuration.AlternativePaymentMethods = apms;

Start payment by calling StartAlternativePaymentMethods method and handle the transaction details

PaymentSdkActivity.StartAlternativePaymentMethods(this, configuration, this);

Constants

The following constants will help you in customizing your configuration.

Tokenise types

The default type is none

PaymentSdkTokenise {
    None, 
    MerchantMandatory,
    UserMandatory,
    UserOptional;
}

configuration.TokeniseType = TokeniseType.UserOptinoal;

Transaction classes

The default class is ecom

PaymentSdkTransactionClass {
    Ecom, 
    Recurring;
}

configuration.TransactionClass = TransactionClass.Recurring;

Token formats

The default format is hex32

PaymentSdkTokenFormat {
    None, 
    Hex32, 
    AlphaNum20, 
    Digit22, 
    Digit16, 
    AlphaNum32;
}

configuration.TokenFormat = TokeniseFromat.Hex32;

Transaction types

The default type is sale

PaymentSdkTransactionType {
    Sale, 
    Auth;
}

configuration.TransactionType = TransactionType.Sale;

Alternative payment methods

AlternativePaymentMethod {
    UnionPay, 
    StcPay, 
    Valu, 
    MeezaQr, 
    OmanNet, 
    KnetCredit, 
    KnetDebit, 
    Fawry;
}

configuration.alternativePaymentMethods = new string[] { AlternativePaymentMethod.StcPay, ...};

Tokenisation

Follow the below instructions to enable the tokenisation.

Request token

configuration.TokeniseType = PaymentSdkTokenise.UserOptional // read more about the tokeniseType in the constants section 
configuration.TokenFormat = PaymentSdkTokenFormat.Hex32Format // read more about the tokenFormat in the constants section

After passing the above parameters, you will receive token and transaction reference in the callback, save them for future usage.

Pass the token & transaction reference

configuration.Token = token
configuration.TransactionReference = transactionreference

Show/Hide Card Scanner

configuration.HideCardScanner = true;

Theme Customization

<resourse>
  // to override colors
     <color name="payment_sdk_primary_color">#5C13DF</color>
     <color name="payment_sdk_secondary_color">#FFC107</color>
     <color name="payment_sdk_primary_font_color">#111112</color>
     <color name="payment_sdk_secondary_font_color">#6D6C70</color>
     <color name="payment_sdk_separators_color">#FFC107</color>
     <color name="payment_sdk_stroke_color">#673AB7</color>
     <color name="payment_sdk_button_text_color">#FFF</color>
     <color name="payment_sdk_title_text_color">#FFF</color>
     <color name="payment_sdk_button_background_color">#3F51B5</color>
     <color name="payment_sdk_background_color">#F9FAFD</color>
     <color name="payment_sdk_card_background_color">#F9FAFD</color> 
   
  // to override dimens
     <dimen name="payment_sdk_primary_font_size">17sp</dimen>
     <dimen name="payment_sdk_secondary_font_size">15sp</dimen>
     <dimen name="payment_sdk_separator_thickness">1dp</dimen>
     <dimen name="payment_sdk_stroke_thickness">.5dp</dimen>
     <dimen name="payment_sdk_input_corner_radius">8dp</dimen>
     <dimen name="payment_sdk_button_corner_radius">8dp</dimen>
     
</resourse>

Override strings: To override string you can find the keys with the default values here English, Arabic.

Demo application

Download our sample apps from here iOS Sample, Android Sample.

License

See LICENSE.

Paytabs

Support | Terms of Use | Privacy Policy

CSPSolutions-Dev/xamarin-paytabs-binding

xamarin-paytabs-binding

Features

Installation

iOS

Android

Usage (iOS)

Pay with Card

Pay with Apple Pay

Pay with Alternative Payment Methods

Tokenisation

Show/Hide Card Scanner

Theme Customization

Constants

Usage (Android)

Pay with Card

Pay with Alternative Payment Methods

Constants

Tokenisation

Show/Hide Card Scanner

Theme Customization

Demo application

License

Paytabs