PayTabs SDK makes the integration with PayTabs payment gateway very easy by providing a ready-made payment screen that handles the card entry and billing & shipping information, and completes the missing details.


In this article you will be going to know about:


SDK Features

  • SDK 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 are easy to customize.
  • Apple Pay supported.
  • The SDK size became very light because we removed all the third-party dependencies.
  • Supporting dark mode.
  • Supporting alternative payment methods.

Requirements

  • iOS 10.0+, Swift 5.0+
  • Xcode 10.0+
  • Create a PayTabs merchant account relative to your country.

Installation

CocoaPods

CocoaPods is a dependency manager for Cocoa projects. For usage and installation instructions, visit their website. To integrate PayTabs SDK into your Xcode project using CocoaPods, specify it in your Podfile:

pod 'PayTabsSDK', '~> 6.1.7'

Carthage

Carthage is a decentralized dependency manager that builds your dependencies and provides you with binary frameworks. To integrate PayTabs SDK into your Xcode project using Carthage, specify it in your Cartfile:

github "paytabscom/paytabs-ios-library-sample" ~> 6.1.7

Manual

To install the SDK manually, simply follow the below steps:

  1. Download the framework.
  2. Navigate to General section of your Target.
  3. Drag PaymentSDK.xcframework file to Frameworks, Libraries, and Embedded Content section.



Prerequisites


Before starting the integrations with PayTabs SDK you should check the Prerequisites below:

  • To give Card Scanner access permission to the camera, and to do that you should add the following key & value to your app info.plist file.
<key>NSCameraUsageDescription</key> 
<string>Write here your message to the user</string>


Usage


Import the PaymentSDK in your code

import PaymentSDK


Pay with Card

  1. Configure the billing & shipping info, the shipping info is optional
let billingDetails = PaymentSDKBillingDetails(name: "John Smith",
                                            email: "[email protected]",
                                            phone: "+2011111111",
                                            addressLine: "address",
                                            city: "Dubai",
                                           state: "Dubai",
                                           countryCode: "ae", // ISO alpha 2
                                           zip: "12345")
                                                   
let shippingDetails = PaymentSDKShippingDetails(name: "John Smith",
                                            email: "[email protected]",
                                            phone: "+2011111111",
                                            addressLine: "address",
                                            city: "Dubai",
                                           state: "Dubai",
                                           countryCode: "ae", // ISO alpha 2
                                           zip: "12345")

                                             

  1. Create the object PaymentSDKConfiguration and fill it with your credentials and payment details.
let configuration = PaymentSDKConfiguration(profileID: profileID,
                                       serverKey: serverKey,
                                       clientKey: clientKey,
                                       currency: "AED",
                                       amount: 5.0,
                                       merchantCountryCode: "AE")
            .cartDescription("Flowers")
            .cartID("1234")
            .screenTitle("Pay with Card")
            .billingDetails(billingDetails)


  1. You are now ready to start payment and handle PaymentManagerDelegate
PaymentManager.startCardPayment(on: self, 
                             configuration: configuration,
                             delegate: self)


Pay with Apple Pay

  1. Follow the guide Steps to configure Apple Pay., to learn how to configure ApplePay with PayTabs.

  2. Do steps 1 and 2 from Pay with Card although you can ignore Billing & Shipping details and Apple Pay will handle it, also you must pass the merchant name and merchant identifier parameters.

let configuration = PaymentSDKConfiguration(profileID: profileID,
                                       serverKey: serverKey,
                                       clientKey: clientKey,
                                       currency: "AED",
                                       amount: 5.0,
                                       merchantCountryCode: "AE")
            .cartDescription("Flowers")
            .cartID("1234")
            .screenTitle("Pay with Card")
            .merchantName("Flowers Store")
            .merchantAppleBundleID("merchant.com.bundleID")
            .simplifyApplePayValidation(true)
  1. To simplify ApplePay validation on all users' billing info, pass simplifyApplePayValidation parameter in the configuration with true.
configuration.simplifyApplePayValidation = true


  1. Call startApplePayPayment to start payment
PaymentManager.startApplePayPayment(on: self, 
                             configuration: configuration,
                             delegate: self)


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.

  1. Do steps 1 and 2 from Pay with Card
  2. Choose one or more of the payment methods you want to support
configuration.alternativePaymentMethods = [.stcPay]


  1. Call startAlternativePaymentMethod to start payment
PaymentManager.startAlternativePaymentMethod(on: self, 
                             configuration: configuration,
                             delegate: self)


Delegates

Using the delegates you will be able to receive the transaction details and errors.

extension ViewController: PaymentManagerDelegate {
    func paymentManager(didFinishTransaction transactionDetails: PaymentSDKTransactionDetails?, error: Error?) {
        if let transactionDetails = transactionDetails {
            print("Response Code: " + (transactionDetails.paymentResult?.responseCode ?? ""))
            print("Result: " + (transactionDetails.paymentResult?.responseMessage ?? ""))
            print("Token: " + (transactionDetails.token ?? ""))
            print("Transaction Reference: " + (transactionDetails.transactionReference ?? ""))
            print("Transaction Time: " + (transactionDetails.paymentResult?.transactionTime ?? "" ))
        } else if let error = error {
            // Handle errors
        }
    }
}


Force Shipping Info Validation

By default, the validation on shipping info is disabled. However, if you want to enable it please write the following line in your code

configuration.forceShippingInfo = true


Show Billing or Shipping Info Section

By default, the billing and shipping info section is hidden. Setting its flag to true to let the SDK internally handle the missing billing & shipping info.

configuration.showBillingInfo = true
configuration.showShippingInfo = true


Tokenization


To enable tokenization (for recurring or any other services that depend on auto-detection from the customers instead of saving credit cards details), please follow the below instructions.

  1. Request token
configuration.tokeniseType = .userOptinoal // read more about the tokeniseType in the enums section 
configuration.tokenFormat = .hex32 // read more about the tokenFormat in the enums section  


After passing those parameters, you will receive token and transaction references in the delegate, save them for future usage.


  1. Pass the token & transaction reference
configuration.token = token configuration.transactionReference = transactionreference


Theme


Use the following guide to customize the colors, font, and logo by configuring the theme and passing it to the payment configuration.

UI guide

let theme = PaymentSDKTheme.default
theme.logoImage = UIImage(named: "Logo") //Change merchant logo.
theme.backgroundColor = .blue
theme.buttonFontColor = .red
configuration.theme = theme

Localization


You can use the strings file below to copy the key and add it to your app's localizable file and overwrite the value to yours.


Enums

Those enums will help you in customizing your configuration.

  • Tokenise types 


The default type is none


public enum TokeniseType: Int, Codable {
    case none // tokenise is off
    case merchantMandatory // tokenise is forced
    case userMandatory // tokenise is forced as per user approval
    case userOptinoal // tokenise if optional as per user approval
}


  • Token formats

The default format is hex32


public enum TokenFormat: String {
    case none = "1"
    case hex32 = "2"
    case alphaNum20 = "3"
    case digit22 = "4"
    case digit16 = "5"
    case alphaNum32 = "6"
}


  • Transaction Type


The default type is sale


public enum TransactionType: String, CaseIterable {
    case sale
    case authorize = "auth"
}
configuration.transactionType = .sale


  • Alternative Payment Methods

public enum AlternativePaymentMethod: String {
    case unionPay = "unionpay"
    case stcPay = "stcpay"
    case valu
    case meezaQR = "meezaqr"
    case omannet
    case knetCredit  = "knetcredit"
    case knetDebit  = "knetdebit"
    case fawry
}
configuration.transactionType = .sale


Demo application

You can try our demo application by checking our complete example.



License

Simply navigate to the following link to see our LICENSE.