Standalone Address Widget

The Address capture Widget uses a prebuilt form to capture an address. Your customer can prefill the form with either an address or a partial address if available. They can then use the autocomplete field to look up their address by searching for key parts such as their postcode, zip code and so on.

Overview

The Address capture Widget captures the following fields. These fields are mandatory for your customer to add, and optional for the merchant to provide.

iOS

How to initialize the Address widget sheet in iOS

1. Overview

The Address Capture Widget collects your customer's billing location. As a standalone widget it manages all required inputs and validations, and provides an address autocomplete function using Apple MapKit SDK.

The widget displays as a SwiftUI sliding bottom sheet. Once your customer has confirmed their address, the widget returns the Address object back to the application.

The Address Widget view is as follows:

AddressSheetView(address: Address, isPresented: Binding<Bool>, onCompletion: Binding<MobileSDK.Address>)

An example of the widget before any customer details have been populated is as follows. The widget is in a SwiftUI View:

import SwiftUI
import MobileSDK

struct AddressExampleView: View {
    var body: some View {
        AddressWidget { result in
            switch result {
            case .success(let address):
                // Handle the address result
            case .failure(let error): 
                // Handle the error
            }
        }
    }
}

2. Parameter definitions

The following definitions provide a more detailed overview of the parameters included in the Address widget:

MobileSDK.AddressWidget

MobileSDK.Address

Android

How to use the AddressDetailsWidget

1. Overview

The Address widget captures billing address details. This section details how to initialize and use the AddressDetailsWidget composable in your application.

The following sample code demonstrates the definition of the AddressDetailsWidget:

@Composable
fun AddressDetailsWidget(
    modifier: Modifier,
    address: BillingAddress?,
    completion: (BillingAddress) -> Unit
) {...}

The following sample code example demonstrates how to use the widget in your application:

// Initialize the AddressDetailsWidget
AddressDetailsWidget(
   modifier = Modifier
        .fillMaxWidth()
        .padding(16.dp), // optional
    address = null, // optional (pre-populate fields)
    completion = { billingAddress ->
        // Handle captured address - Update UI or perform actions
       Log.d("CardDetailsWidget", "Billing address returned. $billingAddress")
    }
)

2. Parameter definitions

This subsection describes the various parameters required by the AddressDetailsWidget composable. It provides information on the purpose of each parameter and its significance in configuring the behavior of the AddressDetailsWidget.

AddressDetailsWidget

BillingAddress

3. Callback Explanation

Completion Callback

The completion callback is invoked after the address details is captured. It receives a BillingAddress once the address details have been saved.