Usage - Native Apps

Set Up VisaCheckoutButton

There are multiple ways to work with the VisaCheckoutButton. VisaCheckoutButton is a subclass of UIView, so it may be used as any other UIView and supports the target-action pattern.

The recommended way to use the VisaCheckoutButton is to create an instance and prepare the button with profile and purchase information using the onCheckout(profile:purchaseInfo:presenting:completion:) method. This method will provide the button with the needed information to configure Visa Checkout and prepare for a button tap.

The following code snippet sets the profile and purchase information for the button.

Swift:

let profile = Profile(environment: .sandbox, apiKey: "abc123...", profileName: nil)
let amount = CurrencyAmount(double: 23.09)
let purchaseInfo = PurchaseInfo(total: amount, currency: .usd)

checkoutButton.onCheckout(profile: profile, purchaseInfo: purchaseInfo, presenting: self) { result in
    switch result.statusName {
    case kVisaCheckoutResultPaymentSuccess:
        print("success")
    case kVisaCheckoutResultPaymentCancel:
        print("canceled")
    case kVisaCheckoutResultPaymentError:
        print("error")
    default:
        print("default")
    }
}

Objective-C:

VisaProfile *profile = [[VisaProfile alloc] initWithEnvironment:VisaEnvironmentSandbox apiKey:@"abc123..." profileName:nil];
VisaCurrencyAmount *amount = [[VisaCurrencyAmount alloc] initWithDouble:23.09];
VisaPurchaseInfo *purchaseInfo = [[VisaPurchaseInfo alloc] initWithTotal:amount currency:VisaCurrencyUsd];

[self.checkoutButton onCheckoutWithProfile:profile purchaseInfo:purchaseInfo presentingViewController:self completion:^(VisaCheckoutResult * _Nonnull result) {
    if ([result.statusName isEqualToString:kVisaCheckoutResultPaymentSuccess]) {
        NSLog(@"success");
    } else if ([result.statusName isEqualToString:kVisaCheckoutResultPaymentCancel]) {
        NSLog(@"canceled");
    } else if ([result.statusName isEqualToString:kVisaCheckoutResultPaymentError]) {
        NSLog(@"error");
    } else {
        NSLog(@"default");
    }
}];


If using Interface Builder to create your button, you only need to drag an instance of UIView to your View Controller, set the custom class to VisaCheckoutButton, then hook up your IBOutlet.

An example creating the VisaCheckoutButton in Interface Builder:

Setting the Interface Builder view class


Note: You also have the option to launch the Visa Checkout SDK directly. For instance, you may want to create a custom button using the VisaCheckoutButton.miniButtonImage. Call the VisaCheckoutSDK.configureManualCheckoutSession(profile:purchaseInfo:presenting:onReady:result:) method directly in viewDidLoad to get a handler for invoking the Visa Checkout SDK manually.

The following code snippet shows how to launch the SDK manually:

Swift:

override func viewDidLoad() {
    super.viewDidLoad()
    configureVisaCheckout()
}

func configureVisaCheckout() {
    let profile = Profile(environment: .sandbox, apiKey: "abc123...", profileName: nil)
    let amount = CurrencyAmount(double: 23.09)
    let purchaseInfo = PurchaseInfo(total: amount, currency: .usd)

    VisaCheckoutSDK.configureManualCheckoutSession(profile: profile, purchaseInfo: purchaseInfo, presenting: self, onReady: { [weak self] launchHandle in
        // store launch handler for later use on button tap
        self?.launchHandle = launchHandle
    }) { [weak self] result in
        self?.configureVisaCheckout()
        switch result.statusName {
        case kVisaCheckoutResultPaymentSuccess:
            print("success")
        case kVisaCheckoutResultPaymentCancel:
            print("canceled")
        case kVisaCheckoutResultPaymentError:
            print("error")
        default:
            print("default")
        }
    }
}

and later on button tap:

guard let launchCheckout = self.launchHandle else {
    return
}

launchCheckout()

Objective-C:

- (void)viewDidLoad {
    [super viewDidLoad];
    [self configureVisaCheckout];
}

- (void)configureVisaCheckout {
    VisaProfile *profile = [[VisaProfile alloc] initWithEnvironment:VisaEnvironmentSandbox apiKey:@"Q16SNCS9I5KB7IVHKRZB21eU3k-CMLMaAq6ku-MCTaiGL5xfU" profileName:nil];
    VisaCurrencyAmount *amount = [[VisaCurrencyAmount alloc] initWithDouble:23.09];
    VisaPurchaseInfo *purchaseInfo = [[VisaPurchaseInfo alloc] initWithTotal:amount currency:VisaCurrencyUsd];

    __weak typeof (self) _self = self;
    [VisaCheckoutSDK
     configureManualCheckoutSessionWithProfile:profile
     purchaseInfo:purchaseInfo
     presentingViewController:self
     onReady:^(LaunchHandle  _Nonnull launchHandle) {
         // store launch handler for later use on button tap
         _self.launchCheckoutHandle = launchHandle;
     } result:^(VisaCheckoutResult * _Nonnull result) {
         [_self configureVisaCheckout];
         if ([result.statusName isEqualToString:kVisaCheckoutResultPaymentSuccess]) {
             NSLog(@"success");
         } else if ([result.statusName isEqualToString:kVisaCheckoutResultPaymentCancel]) {
             NSLog(@"canceled");
         } else if ([result.statusName isEqualToString:kVisaCheckoutResultPaymentError]) {
             NSLog(@"error");
         } else {
             NSLog(@"default");
         }
     }];
}

and later on button tap:

if (self.launchCheckoutHandle) {
    self.launchCheckoutHandle();
}

Enable Face ID

In iOS 11, applications that use Face ID are required to have an entry for the NSFaceIDUsageDescription (Privacy - Face ID Usage Description) key in their Info.plist file. This String lets you describe the reason your app uses Face ID and is displayed to users upon a Face ID authentication prompt. It is highly recommended to include this key in your app’s Info.plist since a main feature of the Visa Checkout Plugin is easier authentication. This key is required in the main bundle’s Info.plist and could have a value of any String. The simplest solution is using an empty string “”, since the subtext isn’t really necessary and then you don’t have to worry about localizing the String.