CheckoutImplementation OverviewMobile App Payments

Swift SDK

Embed the Coinflow card tokenization form natively in a SwiftUI app.

Overview

CoinflowCardForm is a SwiftUI SDK that embeds Coinflow’s card tokenization form directly into iOS apps. The user enters their card inside your app, the SDK returns a payment token, and your backend charges the card via the standard Coinflow checkout API.

  • Package: coinflow-swift
  • Distribution: Swift Package Manager
  • Current version: 0.1.0

Requirements

  • iOS 15+
  • Swift 5.9+
  • Xcode 15+

Installation

In Xcode: File → Add Package Dependencies… and enter:

https://github.com/coinflow-labs-us/coinflow-swift

Select version 0.1.0 (or “Up to Next Major”), then add the CoinflowCardForm library product to your app target.

Integration

1

Add the card form view

Drop CoinflowCardFormView into your SwiftUI layout and pass a CardFormCoordinator you’ll use to trigger tokenization.

1import SwiftUI
2import CoinflowCardForm
3
4struct PaymentView: View {
5    @StateObject private var coordinator = CardFormCoordinator()
6
7    var body: some View {
8        VStack {
9            CoinflowCardFormView(
10                variant: .cardForm,
11                merchantId: "your-merchant-id",
12                env: .sandbox,
13                coordinator: coordinator
14            )
15            .frame(height: 52)
16
17            Button("Pay") {
18                Task { await tokenize() }
19            }
20        }
21    }
22
23    private func tokenize() async {
24        do {
25            let response = try await coordinator.tokenize()
26            print("Token: \(response.token)")
27        } catch {
28            // surface error to user
29        }
30    }
31}

your-merchant-id is an example placeholder. Use your actual merchant ID from the merchant dashboard, or contact the Coinflow integrations team. Typically you’d inject it via a build setting or environment variable rather than hard-coding it.

2

Configure the environment

Switch env based on build configuration:

1#if DEBUG
2let env: CoinflowEnv = .sandbox
3#else
4let env: CoinflowEnv = .prod
5#endif
  • .sandbox — test cards, no real money
  • .prod — live cards, real money
3

Charge the token server-side

coordinator.tokenize() returns a TokenizeResponse:

  • token: String — payment token to send to your backend
  • expMonth: String?, expYear: String? — populated only for variants that collect expiry

Send the token to your server and call Coinflow’s checkout API to charge it. See the Checkout API reference for the full request shape.

Variants

1CoinflowCardFormView(variant: .cardForm, ...)         // full card entry
2CoinflowCardFormView(variant: .cardNumberForm, ...)   // number + expiry only
3CoinflowCardFormView(variant: .cvvForm, token: "...", ...) // CVV only for saved card
VariantCapturesUse case
.cardFormNumber, expiry, CVVStandard one-shot capture
.cardNumberFormNumber + expiryFirst step of a two-step flow
.cvvFormCVV onlyRe-collecting CVV for a card-on-file token

Theming

MerchantTheme styles the rendered form. All fields optional.

1let theme = MerchantTheme(
2    primary: "#165DFB",
3    background: "#ffffff",
4    textColor: "#05092E",
5    ctaColor: "#165DFB",
6    font: "Red Hat Display",
7    style: .rounded
8)
9
10CoinflowCardFormView(theme: theme, /* ... */)
FieldPurpose
primary, ctaColorAccent / action colors (hex strings)
background, backgroundAccent, backgroundAccent2Form background tones
textColor, textColorAccent, textColorActionInput and label text colors
font, fontSize, fontWeightTypography. font must be available on the device.
styleInput shape: .rounded, .sharp, .pill
cardNumberPlaceholder, cvvPlaceholder, expirationPlaceholderOverride input placeholder text
showCardIconToggle the card brand icon (Visa/Mastercard/Amex)

Resources