This guide walks you through the initial setup in three simple phases: Setup, Integration, and Launch.
1. Setup
Create Your First Screen
Head over to the Builder and start designing your first screen. We recommend experimenting freely — no need to perfect it right away. Once you’re happy with the layout, come back here to proceed with connecting products and integrations.
Your screen can be a paywall, onboarding experience, or any other user flow you want to test or ship fast.
Add Products (Optional, but recommended for paywalls)
If your screen involves in-app purchases or subscriptions, you’ll need to create products in your Qonversion project first.
- These products will appear in the Builder’s dropdown for easy linking.
- If you’re only designing onboarding or feature-explainer screens, you can skip this step for now.
Learn about Entitlements.
Connect Stores
Connecting your Apple App Store and Google Play accounts enables:
- Real-time subscription status tracking
- Purchase validation and fraud protection
- In-depth analytics on conversion, revenue, and retention
Setup typically takes under 10 minutes with our step-by-step guides.
Connect Stores
2. Integrate SDK
Android
On Android the No-Codes SDK is distributed as a separate package, but it includes the Qonversion SDK as a dependency.
build.gradle file:
implementation 'io.qonversion:no-codes:1.+'
Migrating to the latest Qonversion SDK versionIf you are utilizing our subscription management and analytics SDK (io.qonversion.android.sdk:sdk), please be aware that the No-Codes SDK includes the latest version of the Qonversion SDK. Therefore, you need to manage the migration from previous major versions to the latest ones. Our migration guides located in the relevant documentation section will assist you with this process.After that you can remove the Qonversion SDK dependency from your build.gradle file and leave only the No-Codes SDK dependency there.
3. Initialize SDKs and Set Delegates
To display screens and process purchases correctly, initialize both SDKs in your app and assign delegates for handling screen behavior.
1. Initialize Qonversion SDK
Swift
Kotlin
Java
React Native
Flutter
Unity
Cordova
Capacitor
import Qonversion
func application(_ application: UIApplication, didFinishLaunchingWithOptions launchOptions: [UIApplicationLaunchOptionsKey: Any]?) -> Bool {
let qonversionConfig = Qonversion.Configuration(projectKey: "projectKey", launchMode: .subscriptionManagement)
Qonversion.initWithConfig(qonversionConfig)
return true
}
import com.qonversion.android.sdk.Qonversion
import com.qonversion.android.sdk.QonversionConfig
import com.qonversion.android.sdk.dto.QLaunchMode
public class App : Application {
override fun onCreate() {
super.onCreate()
val qonversionConfig = QonversionConfig.Builder(
this,
"projectKey",
QLaunchMode.SubscriptionManagement
).build()
Qonversion.initialize(qonversionConfig)
}
}
import com.qonversion.android.sdk.Qonversion;
import com.qonversion.android.sdk.QonversionConfig;
import com.qonversion.android.sdk.dto.QLaunchMode;
public class App extends Application {
@Override
public void onCreate() {
super.onCreate();
final QonversionConfig qonversionConfig = new QonversionConfig.Builder(
this,
"projectKey",
QLaunchMode.SubscriptionManagement
).build();
Qonversion.initialize(qonversionConfig);
}
}
const config = new QonversionConfigBuilder(
'projectKey',
LaunchMode.SUBSCRIPTION_MANAGEMENT
).build();
Qonversion.initialize(config);
final config = new QonversionConfigBuilder(
'projectKey',
QLaunchMode.subscriptionManagement
).build();
Qonversion.initialize(config);
QonversionConfig config = new QonversionConfigBuilder(
"projectKey",
LaunchMode.SubscriptionManagement
).Build();
Qonversion.Initialize(config);
const config = new Qonversion.ConfigBuilder(
'projectKey',
Qonversion.LaunchMode.SUBSCRIPTION_MANAGEMENT,
).build();
Qonversion.initialize(config);
const config = new QonversionConfigBuilder(
'projectKey',
LaunchMode.SUBSCRIPTION_MANAGEMENT
).build();
Qonversion.initialize(config);
2. Initialize No-Codes SDK
Swift
Kotlin
Java
React Native
Flutter
Unity
Cordova
Capacitor
let noCodesConfig = NoCodesConfiguration(projectKey: "projectKey")
NoCodes.initialize(with: noCodesConfig)
import io.qonversion.nocodes.NoCodes
import io.qonversion.nocodes.NoCodesConfig
val noCodesConfig = NoCodesConfig.Builder(this, "projectKey").build()
NoCodes.initialize(noCodesConfig)
import io.qonversion.nocodes.NoCodes;
import io.qonversion.nocodes.NoCodesConfig;
final NoCodesConfig noCodesConfig = new NoCodesConfig.Builder(this, "projectKey").build();
NoCodes.initialize(noCodesConfig);
const noCodesConfig = new NoCodesConfigBuilder('projectKey')
.build();
NoCodes.initialize(noCodesConfig);
final noCodesConfig = new NoCodesConfigBuilder(projectKey).build();
NoCodes.initialize(noCodesConfig);
var noCodesConfig = new NoCodesConfigBuilder("projectKey")
.Build();
NoCodes.Initialize(noCodesConfig);
const noCodesConfig = new Qonversion.NoCodesConfigBuilder('projectKey')
.build();
Qonversion.NoCodes.initialize(noCodesConfig);
const noCodesConfig = new NoCodesConfigBuilder('projectKey')
.build();
NoCodes.initialize(noCodesConfig);
3. Set No-Codes SDK Delegates (Optional)
Swift
Kotlin
Java
React Native
Flutter
Unity
Cordova
Capacitor
NoCodes.shared.set(delegate: self)
NoCodes.shared.set(screenCustomizationDelegate: self)
// Or pass via initialization:
let noCodesConfig = NoCodesConfiguration(
projectKey: "projectKey",
delegate: self,
screenCustomizationDelegate: self
)
NoCodes.shared.setDelegate(this)
NoCodes.shared.setScreenCustomizationDelegate(this)
// Or pass via initialization:
val noCodesConfig = NoCodesConfig.Builder(this, "projectKey")
.setDelegate(this)
.setScreenCustomizationDelegate(this)
.build()
NoCodes.getSharedInstance().setDelegate(this);
NoCodes.getSharedInstance().setScreenCustomizationDelegate(this);
// Or pass via initialization:
final NoCodesConfig noCodesConfig = new NoCodesConfig.Builder(this, "projectKey")
.setDelegate(this)
.setScreenCustomizationDelegate(this)
.build();
const noCodesConfig = new NoCodesConfigBuilder('projectKey')
.setNoCodesListener(this)
.build();
_screenShownStream = NoCodes.getSharedInstance().screenShownStream.listen((event) {
// handle screen shown
});
_finishedStream = NoCodes.getSharedInstance().finishedStream.listen((event) {
// handle finished
});
_actionStartedStream = NoCodes.getSharedInstance().actionStartedStream.listen((event) {
// handle action started
});
var noCodesConfig = new NoCodesConfigBuilder("projectKey")
.SetNoCodesDelegate(this)
.Build();
const noCodesConfig = new Qonversion.NoCodesConfigBuilder('projectKey')
.setNoCodesListener(this)
.build();
const noCodesConfig = new NoCodesConfigBuilder('projectKey')
.setNoCodesListener(this)
.build();
4. Launch
Display Your No-Code Screen
Once everything is set up, display your screen inside the app using its Context Key.
Swift
Kotlin
Java
React Native
Flutter
Unity
Cordova
Capacitor
NoCodes.shared.showNoCode(withContextKey: "yourContextKey")
NoCodes.shared.showScreen("yourContextKey")
NoCodes.getSharedInstance().showScreen("yourContextKey");
NoCodes.getSharedInstance().showScreen('yourContextKey');
NoCodes.getSharedInstance().showScreen('yourContextKey');
NoCodes.GetSharedInstance().ShowScreen("yourContextKey");
Qonversion.NoCodes.getSharedInstance().showScreen('yourContextKey');
NoCodes.getSharedInstance().showScreen('yourContextKey');
Make Your First Purchase
It’s time to test the full flow:
- Launch your app
- Display the screen you created
- Trigger a test purchase
- Confirm that everything works as expected: purchase completes, entitlements are unlocked, and analytics start flowing