Swipelux
Client-side integration

Integrating on mobile

While we do not currently provide native SDKs for mobile platforms, you can still easily integrate our widget into your mobile application using a WebView component.

There are two main approaches:

  1. Use Payment Links to generate a URL that can be loaded in a WebView;
  2. Create your own page with our Web SDKs embedded and load that URL in a WebView.

For the following examples, we will use the first approach by using this Payment Link: https://track.swipelux.com?api-key=YOUR_PUBLISHABLE_API_KEY&blank=true.

iOS

Important

On iOS and other Apple platforms, ensure allowsInlineMediaPlayback is set to true in the WebView configuration to enable proper document submission during KYC verification.

let webViewConfiguration = WKWebViewConfiguration()
webViewConfiguration.allowsInlineMediaPlayback = true
WebViewController.swift
import UIKit
import WebKit
 
class WebViewController: UIViewController, WKNavigationDelegate {
  var webView: WKWebView!
 
  override func loadView() {
    let webViewConfiguration = WKWebViewConfiguration()
    webViewConfiguration.allowsInlineMediaPlayback = true
 
    webView = WKWebView(frame: .zero, configuration: webViewConfiguration)
    webView.navigationDelegate = self
    view = webView
  }
 
  override func viewDidLoad() {
    super.viewDidLoad()
 
    // Make sure to replace YOUR_PUBLISHABLE_API_KEY with your actual API key.
    let url = URL(string: "https://track.swipelux.com?api-key=YOUR_PUBLISHABLE_API_KEY&blank=true")!
    webView.load(URLRequest(url: url))
  }
}

Android

For Android, you can use the WebView component to load the Payment Link:

WebViewActivity.kt
import android.os.Bundle
import android.webkit.WebView
import android.webkit.WebViewClient
import androidx.appcompat.app.AppCompatActivity
 
class WebViewActivity : AppCompatActivity() {
  override fun onCreate(savedInstanceState: Bundle?) {
    super.onCreate(savedInstanceState)
 
    val webView = WebView(this).apply {
      settings.javaScriptEnabled = true
      settings.domStorageEnabled = true
      webViewClient = WebViewClient()
 
      // Make sure to replace YOUR_PUBLISHABLE_API_KEY with your actual API key
      loadUrl("https://track.swipelux.com?api-key=YOUR_PUBLISHABLE_API_KEY&blank=true")
    }
 
    setContentView(webView)
  }
}

React Native

For React Native, you can use the WebView component from react-native-webview.

npm install react-native-webview
PaymentWebView.tsx
import React from 'react';
import { WebView } from 'react-native-webview';
 
export function PaymentWebView() {
  return (
    <WebView
      // Make sure to replace YOUR_PUBLISHABLE_API_KEY with your actual API key
      source={{ uri: 'https://track.swipelux.com?api-key=YOUR_PUBLISHABLE_API_KEY&blank=true' }}
      allowsInlineMediaPlayback={true}
      javaScriptEnabled={true}
      domStorageEnabled={true}
    />
  );
};

Flutter

For Flutter, you can use the webview_flutter package:

payment_webview.dart
import 'package:flutter/material.dart';
import 'package:webview_flutter/webview_flutter.dart';
 
class PaymentWebView extends StatefulWidget {
  const PaymentWebView({super.key});
 
  @override
  State<PaymentWebView> createState() => _PaymentWebViewState();
}
 
class _PaymentWebViewState extends State<PaymentWebView> {
  late final WebViewController controller;
 
  @override
  void initState() {
    super.initState();
    controller = WebViewController()
      ..setJavaScriptMode(JavaScriptMode.unrestricted)
      ..loadRequest(
        // Make sure to replace YOUR_PUBLISHABLE_API_KEY with your actual API key
        Uri.parse('https://track.swipelux.com?api-key=YOUR_PUBLISHABLE_API_KEY&blank=true'),
      );
  }
 
  @override
  Widget build(BuildContext context) {
    return Scaffold(
      body: WebViewWidget(controller: controller),
    );
  }
}

For more advanced use cases or if you encounter any issues, you can create your own web page with our Web SDK embedded and load that URL in the WebView instead of using Payment Links directly.

On this page