Mobile SDK

Integrate alby into your mobile app with our SDK

The alby SDK enables you to use the Alby Widget in your app. We offer two versions of the SDK - one for Android and another one for iOS.

Requirements

Before installing the SDK make sure you already have a brand created at alby and that you've already loaded products to our system.

Documentation

Android SDK

iOS SDK

iOS

You can find a full example in our GitHub repository.

Installation

The iOS version only works for apps using SwiftUI.

You can install Alby for iOS using Swift Package Manager. Add https://github.com/albycom/alby_widget_ios as a Swift Package Repository in Xcode and follow the instructions to add AlbyWidget as a Swift Package.

Setup and Configuration

The alby widget works as an extension for any SwiftUI view.

addAlbyWidget

The addAlbyWidget function displays the Alby widget inside a sheet (modal). This is ideal for cases where you want the widget to appear in an overlay or pop-up format, giving users the option to engage with the widget without leaving the current screen.

Depending on how your view is structured the keyboard inside the bottom sheet might not work as expected. Make sure that you place the widget inside a ScrollView so the keyboard can scroll and the content be displayed.

import AlbyWidget

struct MyView: View {
  var body: some View {
    ScrollView {
      Text("Hello")
    }.addAlbyWidget(productId: "your product id", brandId: "your-brand-id")
  }
}

AlbyInlineWidgetView

AlbyInlineWidgetView is a view that allows embedding the alby widget directly into your app's UI. It’s perfect for inline use on any page, like product details or brand-specific screens, where the widget integrates seamlessly within the existing view hierarchy.

In the SwiftUI View where you want to place the widget, add the AlbyInlineWidgetView component and pass in the required brandId and productId parameters:

import AlbyWidget

VStack(spacing: 16) {
    AlbyInlineWidgetView(
        brandId: "your brand id",
        productId: "your product id"
    )
    .padding(24)
}
.padding()

You can find a full example in the GitHub repository of the SDK.

Installation

AlbyWidget for Android requires a SDK 29+ and Jetpack Compose.

Gradle Kotlin

implementation("com.alby.widget:alby-widget:<version>")

implementation 'com.alby.widget:alby-widget:<version>'

<dependency>
    <groupId>com.alby.widget</groupId>
    <artifactId>alby-widget</artifactId>
    <version><version></version>
</dependency>

<uses-permission android:name="android.permission.INTERNET" />

import com.alby.widget.AlbyWidgetScreen

AlbyWidgetScreen(brandId = "your-brand-id", productId ="your-product-id" ) {
 YourScreenGoesHere()
}

import com.alby.widget.AlbyInlineWidget

Column(
    modifier = Modifier
        .padding(innerPadding),
    verticalArrangement = Arrangement.spacedBy(16.dp),
) {
    AlbyInlineWidget(
        brandId = "your brand id",
        productId = "your product id",
        modifier = Modifier.padding(24.dp),
    )

}