Displaying No-Codes

// You can initialize using only project key
let configuration = NoCodesConfiguration(projectKey: "projectKey")
NoCodes.initialize(with: configuration)

// You can initialize using only project key
val noCodesConfig = NoCodesConfig.Builder(this, "projectKey").build()
NoCodes.initialize(noCodesConfig)

// You can initialize using only project key
final NoCodesConfig noCodesConfig = new NoCodesConfig.Builder(this, "projectKey").build();
NoCodes.initialize(noCodesConfig);

// You can initialize using only project key
const noCodesConfig = new NoCodesConfigBuilder('projectKey')
  .build();
NoCodes.initialize(noCodesConfig);

// You can initialize using only project key
final noCodesConfig = new NoCodesConfigBuilder(projectKey).build();
NoCodes.initialize(noCodesConfig);

// You can initialize using only project key
var noCodesConfig = new NoCodesConfigBuilder("projectKey")
    .Build();
NoCodes.Initialize(noCodesConfig);

// You can initialize using only project key
const noCodesConfig = new Qonversion.NoCodesConfigBuilder('projectKey')
  .build();
Qonversion.NoCodes.initialize(noCodesConfig);

// You can initialize using only project key
const noCodesConfig = new NoCodesConfigBuilder('projectKey')
  .build();
NoCodes.initialize(noCodesConfig);

Then you can set the delegates for handling events and customizing screens as follows - (optional):

// The first delegate is used for main events (e.g., screen opened, button tapped).
NoCodes.shared.set(delegate: self)
// The second is for screen customization (if you want to override default styles).
NoCodes.shared.set(screenCustomizationDelegate: self)

// Delegates can be also passed via the initialization through the configuration:
let noCodesConfig = NoCodesConfiguration(projectKey: "projectKey", delegate: self, screenCustomizationDelegate: self)

// The first delegate is used for main events (e.g., screen opened, button tapped).
NoCodes.shared.setDelegate(this)
// The second is for screen customization (if you want to override default styles).
NoCodes.shared.setScreenCustomizationDelegate(this)

// Delegates can be also passed via the initialization through the configuration:
val noCodesConfig = NoCodesConfig.Builder(this, "projectKey")
  .setDelegate(this)
  .setScreenCustomizationDelegate(this)
  .build()

// The first delegate is used for main events (e.g., screen opened, button tapped).
NoCodes.getSharedInstance().setDelegate(this);
// The second is for screen customization (if you want to override default styles).
NoCodes.getSharedInstance().setScreenCustomizationDelegate(this);

// Delegates can be also passed via the initialization through the configuration:
final NoCodesConfig noCodesConfig = new NoCodesConfig.Builder(this, "projectKey")
  .setDelegate(this)
  .setScreenCustomizationDelegate(this)
  .build();

// Set the listener via the initialization through the configuration
// It is used for main events (e.g., screen opened, button tapped).
const noCodesConfig = new NoCodesConfigBuilder('projectKey')
  .setNoCodesListener(this)
.build();

// Set presentation style config before showing screen if needed
const screenConfig = new ScreenPresentationConfig(ScreenPresentationStyle.FULL_SCREEN, true);
NoCodes.getSharedInstance().setScreenPresentationConfig(screenConfig, 'yourContextKey');

// Set presentation style config before showing screen if needed
final config = NoCodesPresentationConfig(
    animated: true,
    presentationStyle: NoCodesPresentationStyle.fullScreen,
);

NoCodes.getSharedInstance().setScreenPresentationConfig(config, contextKey: 'yourContextKey');

// Subscribe to separate NoCodes event streams
_screenShownStream = NoCodes.getSharedInstance().screenShownStream.listen((event) {
    // add functionality here
});

_finishedStream = NoCodes.getSharedInstance().finishedStream.listen((event) {
    // add functionality here
});

_actionStartedStream = NoCodes.getSharedInstance().actionStartedStream.listen((event) {
    // add functionality here
});

_actionFailedStream = NoCodes.getSharedInstance().actionFailedStream.listen((event) {
    // add functionality here
});

_actionFinishedStream = NoCodes.getSharedInstance().actionFinishedStream.listen((event) {
    // add functionality here
});

_screenFailedToLoadStream = NoCodes.getSharedInstance().screenFailedToLoadStream.listen((event) {
    // add functionality here
});

// Set the delegate via the initialization through the configuration
// It is used for main events (e.g., screen opened, button tapped).
var noCodesConfig = new NoCodesConfigBuilder("projectKey")
    .SetNoCodesDelegate(this)
    .Build();
NoCodes.Initialize(noCodesConfig);

// Set presentation style config before showing screen if needed
var screenConfig = new ScreenPresentationConfig(ScreenPresentationStyle.FullScreen, true);
NoCodes.GetSharedInstance().SetScreenPresentationConfig(screenConfig, "yourContextKey");

// Set the listener via the initialization through the configuration
// It is used for main events (e.g., screen opened, button tapped).
const noCodesConfig = new Qonversion.NoCodesConfigBuilder('projectKey')
  .setNoCodesListener(this)
.build();

// Set presentation style config before showing screen if needed
const screenConfig = new Qonversion.ScreenPresentationConfig(Qonversion.ScreenPresentationStyle.FULL_SCREEN, true);
Qonversion.NoCodes.getSharedInstance().setScreenPresentationConfig(screenConfig, 'yourContextKey');

// Set the listener via the initialization through the configuration
// It is used for main events (e.g., screen opened, button tapped).
const noCodesConfig = new NoCodesConfigBuilder('projectKey')
  .setNoCodesListener(this)
.build();

// Set presentation style config before showing screen if needed
const screenConfig = new ScreenPresentationConfig(ScreenPresentationStyle.FULL_SCREEN, true);
NoCodes.getSharedInstance().setScreenPresentationConfig(screenConfig, 'yourContextKey');

After initializing the SDK, you can move forward and display the No-Codes screen:

NoCodes.shared.showScreen(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');

If you want to use Qonversion No-Codes with your own purchase infrastructure, see how you can do it in two simple steps.

Loading screens before presentation

By default, showScreen is fire-and-present: it presents a loading view immediately and fetches the content afterwards, so your app learns the outcome through delegate callbacks only after the screen is already on screen. If you want to decide up front — an “ask-first” flow — use loadScreen. It awaits the screen’s availability and data (from cache or network) before anything is presented, so you can either present the screen or show your own fallback UI without the SDK loading view ever appearing. A successful load warms the shared screens cache, so the following showScreen call with the same context key renders from cache.

do {
  _ = try await NoCodes.shared.loadScreen(withContextKey: "yourContextKey")  // warms the cache
  NoCodes.shared.showScreen(withContextKey: "yourContextKey")                // renders from cache
} catch {
  presentOwnFallbackUI()                                                     // SDK screen never shown
}

// Kotlin coroutines
lifecycleScope.launch {
  try {
    NoCodes.shared.loadScreen("yourContextKey")   // warms the cache
    NoCodes.shared.showScreen("yourContextKey")   // renders from cache
  } catch (e: NoCodesException) {
    presentOwnFallbackUi()                        // SDK screen never shown
  }
}

// Or the callback-based variant — the callback is invoked on the main thread
NoCodes.shared.loadScreen("yourContextKey", object : NoCodesScreenLoadCallback {
  override fun onSuccess(screen: QNoCodeScreen) {
    NoCodes.shared.showScreen("yourContextKey")
  }

  override fun onError(error: NoCodesError) {
    presentOwnFallbackUi()
  }
})

// The callback is invoked on the main thread
NoCodes.getSharedInstance().loadScreen("yourContextKey", new NoCodesScreenLoadCallback() {
  @Override
  public void onSuccess(@NonNull QNoCodeScreen screen) {
    NoCodes.getSharedInstance().showScreen("yourContextKey");
  }

  @Override
  public void onError(@NonNull NoCodesError error) {
    presentOwnFallbackUi();
  }
});

try {
  const screen = await NoCodes.getSharedInstance().loadScreen('yourContextKey'); // warms the cache
  NoCodes.getSharedInstance().showScreen('yourContextKey');                      // renders from cache
} catch (e) {
  presentOwnFallbackUi();                                                        // SDK screen never shown
}

try {
  final screen = await NoCodes.getSharedInstance().loadScreen('yourContextKey'); // warms the cache
  NoCodes.getSharedInstance().showScreen('yourContextKey');                      // renders from cache
} on QonversionException {
  presentOwnFallbackUi();                                                        // SDK screen never shown
}

NoCodes.GetSharedInstance().LoadScreen(
    "yourContextKey",
    onSuccess: screen => NoCodes.GetSharedInstance().ShowScreen("yourContextKey"),
    onError: error => PresentOwnFallbackUi()
);

try {
  const screen = await Qonversion.NoCodes.getSharedInstance().loadScreen('yourContextKey');
  Qonversion.NoCodes.getSharedInstance().showScreen('yourContextKey');
} catch (e) {
  presentOwnFallbackUi();
}

try {
  const screen = await NoCodes.getSharedInstance().loadScreen('yourContextKey');
  NoCodes.getSharedInstance().showScreen('yourContextKey');
} catch (e) {
  presentOwnFallbackUi();
}

The returned screen exposes its id, contextKey, and the typed default variables configured on it in the builder (see Reading default variables below). The error lets you branch on the failure: a screen not found error (NoCodesError.type == .screenNotFound on iOS, error code ScreenNotFound on Android) means the screen is genuinely absent for that context key — show your fallback; any other code indicates a transient network or load failure — you may retry.

loadScreen is an optional, additional entry point — not a prerequisite for showScreen. Screens marked as preloadable in the No-Codes Builder are fetched automatically at SDK initialization (see Screens Preloading), and showScreen works on its own.Two minor differences from a direct showScreen call: loadScreen does not flush pending user properties, so the targeting basis may differ slightly; and on-demand loads cache the screen without pre-embedded images (image embedding is applied during init-time preloading only).

Available starting from the following SDK versions:

Platform	Minimum Version
iOS	6.13.0
Android	No-Codes 1.10.0
React Native	10.9.0
Flutter	11.8.0
Cordova	7.7.0
Capacitor	1.6.0
Unity	9.7.0

Reading default variables

The screen returned by loadScreen carries the typed default variables configured on it in the No-Code Builder — defaultVariables. Each variable has a kind:

custom — a Screen Variable authored in the builder’s Variables section;
product — a product slot: the variable key is the slot name and the value is the default Qonversion product ID assigned to it;
selectedProduct — the screen’s Default Product (Product Slots panel → Default Product): the Qonversion product ID selected by default when the screen opens. Read it via the typed shortcut screen.defaultSelectedProductId — no key needed.

Each variable preserves its configured native type (boolean / string / number) instead of being stringified:

public struct NoCodesScreenVariable {
  public let kind: NoCodesScreenVariableKind  // .custom, .product, .selectedProduct, or .unknown
  public let key: String    // variable name (`variable.<key>` in the builder) or slot name
  public let type: String   // "boolean", "string" or "number"
  public let value: NoCodesScreenVariableValue
}

public enum NoCodesScreenVariableValue {
  case bool(Bool)
  case string(String)
  case number(Double)
  case none                 // a null/absent configured default

  var stringValue: String { get }  // any value as a plain string ("" for none)
}

data class QScreenVariable(
  val kind: Kind,                  // Custom, Product, SelectedProduct, or Unknown
  val key: String,                 // variable name (`variable.<key>` in the builder) or slot name
  val type: String,                // "boolean", "string" or "number"
  val value: QScreenVariableValue, // Bool / Str / Num / None — preserves the native type
)

// QScreenVariableValue.asString(): any value as a plain string ("" for None)

For example, to read a variable by key, the default product of a slot, and the screen’s default selected product. Keys are only unique within a kind — a custom variable and a product slot may share a name — so the by-key lookup accepts an optional kind filter:

let screen = try await NoCodes.shared.loadScreen(withContextKey: "yourContextKey")

if case .bool(let showTrial) = screen.defaultVariable(forKey: "show_trial", kind: .custom)?.value {
  print("show_trial = \(showTrial)")
}

let primarySlotProduct = screen.defaultVariable(forKey: "primary", kind: .product)?.value.stringValue
let defaultSelected = screen.defaultSelectedProductId

val screen = NoCodes.shared.loadScreen("yourContextKey")

val showTrial = (screen.defaultVariable("show_trial", QScreenVariable.Kind.Custom)?.value
    as? QScreenVariableValue.Bool)?.value ?: false

val primarySlotProduct = screen.defaultVariable("primary", QScreenVariable.Kind.Product)?.value?.asString()
val defaultSelected = screen.defaultSelectedProductId

defaultVariables is an empty list when the screen has none configured (or on older payloads), so it is always safe to iterate. The kind set may grow — values unknown to your SDK version arrive as .unknown / Unknown instead of failing the load.

These values are the defaults configured on the screen, read back at load time. Conditional slot overrides and runtime mutations inside the running screen are not reflected, and they are not the same as the custom variables you pass into a screen from your app (see Passing custom variables).

Passing custom variables

You can pass dynamic values from your app into a No-Code screen and reference them in conditional logic, dynamic text, or component visibility rules. Variables are scoped to a specific contextKey, so different screens can receive different values, and each value is queried at the moment a screen is about to be shown — including sub-screens reached via in-screen navigation. For native SDKs, implement a delegate that returns a Map/dictionary keyed by contextKey. For cross-platform SDKs, pass the values directly to showScreen.

// 1. Implement NoCodesCustomVariablesDelegate
extension MyClass: NoCodesCustomVariablesDelegate {
  func customVariables(for contextKey: String) -> [String: String] {
    return ["button_color": "red", "username": "Alex"]
  }
}

// 2. Provide it to the SDK
NoCodes.shared.set(customVariablesDelegate: self)
// Or via configuration:
let configuration = NoCodesConfiguration(projectKey: "projectKey", customVariablesDelegate: self)

// 1. Implement CustomVariablesDelegate
class MyActivity : AppCompatActivity(), CustomVariablesDelegate {
  override fun getCustomVariables(contextKey: String): Map<String, String> {
    return mapOf("button_color" to "red", "username" to "Alex")
  }
}

// 2. Provide it to the SDK
NoCodes.shared.setCustomVariablesDelegate(this)
// Or via configuration:
val noCodesConfig = NoCodesConfig.Builder(this, "projectKey")
  .setCustomVariablesDelegate(this)
  .build()

// 1. Implement CustomVariablesDelegate
public class MyActivity extends AppCompatActivity implements CustomVariablesDelegate {
  @NonNull
  @Override
  public Map<String, String> getCustomVariables(@NonNull String contextKey) {
    Map<String, String> variables = new HashMap<>();
    variables.put("button_color", "red");
    variables.put("username", "Alex");
    return variables;
  }
}

// 2. Provide it to the SDK
NoCodes.getSharedInstance().setCustomVariablesDelegate(this);
// Or via configuration:
final NoCodesConfig noCodesConfig = new NoCodesConfig.Builder(this, "projectKey")
  .setCustomVariablesDelegate(this)
  .build();

const customVariables = { button_color: 'red', username: 'Alex' };
NoCodes.getSharedInstance().showScreen('yourContextKey', customVariables);

final customVariables = {'button_color': 'red', 'username': 'Alex'};
NoCodes.getSharedInstance().showScreen('yourContextKey', customVariables: customVariables);

var customVariables = new Dictionary<string, string> {
  { "button_color", "red" },
  { "username", "Alex" }
};
NoCodes.GetSharedInstance().ShowScreen("yourContextKey", customVariables);

const customVariables = { button_color: 'red', username: 'Alex' };
Qonversion.NoCodes.getSharedInstance().showScreen('yourContextKey', customVariables);

const customVariables = { button_color: 'red', username: 'Alex' };
NoCodes.getSharedInstance().showScreen('yourContextKey', customVariables);

Values must be strings. Inside the screen, variables are injected into the JavaScript context via window.noCodesSetVariable(name, value) and then become available in conditional logic, dynamic text bindings, and visibility rules.

Delegates

Earlier, we discussed how to set delegates. Now, let’s explore their purpose.

Main delegate

The main delegate is needed so that you can receive messages about what is happening during the execution of No-Codes, as well as to provide us with the screen from which to start navigation and display the No-Codes screen. Let’s go through this step by step.

Unity Warning

Unity NoCodes delegate events are delivered on iOS only. On Android, the No-Codes screen runs as a separate Activity on top of Unity’s Activity and Unity’s game loop is paused while the screen is shown, so delegate events do not fire.

controllerForNavigation (iOS only)

func controllerForNavigation() -> UIViewController?

In this function, you must return a UIViewController from which we will start displaying the No-Codes flow. If you do not provide one, we will take the topmost screen in the current stack.

Screen shown event

func noCodesHasShownScreen(id: String)

fun onScreenShown(screenId: String)

void onScreenShown(String screenId)

onScreenShown: (id: string) => {}

_screenShownStream = NoCodes.getSharedInstance().screenShownStream.listen((event) {
    // add functionality here
});

void OnScreenShown(string contextKey)

onScreenShown: (id: string) => {}

onScreenShown: (id: string) => {}

This function notifies about the display of a screen with a specific identifier.

To read the screen’s configured default variables and product slots, load the screen entity via loadScreen and use its defaultVariables — see Reading default variables.

Action execution start event

func noCodesStartsExecuting(action: NoCodesAction)

fun onActionStartedExecuting(action: QAction)

void onActionStartedExecuting(QAction action)

onActionStartedExecuting: (action: NoCodesAction) => {}

_actionStartedStream = NoCodes.getSharedInstance().actionStartedStream.listen((event) {
    // add functionality here
});

void OnActionStarted(NoCodesAction action)

onActionStartedExecuting: (action: Qonversion.NoCodesAction) => {}

onActionStartedExecuting: (action: NoCodesAction) => {}

This function notifies you that executing the action you set up through our dashboard has begun.

Action execution fail event

func noCodesFailedToExecute(action: NoCodesAction, error: Error?)

fun onActionFailedToExecute(action: QAction) {
  // For details look at the `error` property of the action
}

void onActionFailedToExecute(QAction action) {
  // For details look at the `error` property of the action
}

onActionFailedToExecute: (action: NoCodesAction) => {}

_actionFailedStream = NoCodes.getSharedInstance().actionFailedStream.listen((event) {
    // add functionality here
});

void OnActionFailed(NoCodesAction action)

onActionFailedToExecute: (action: Qonversion.NoCodesAction) => {}

onActionFailedToExecute: (action: NoCodesAction) => {}

This function notifies you that executing the action you set up through our dashboard has failed.

Action execution finish event

func noCodesFinishedExecuting(action: NoCodesAction)

fun onActionFinishedExecuting(action: QAction)

void onActionFinishedExecuting(QAction action)

onActionFinishedExecuting: (action: NoCodesAction) => {}

_actionFinishedStream = NoCodes.getSharedInstance().actionFinishedStream.listen((event) {
    // add functionality here
});

void OnActionFinished(NoCodesAction action)

onActionFinishedExecuting: (action: Qonversion.NoCodesAction) => {}

onActionFinishedExecuting: (action: NoCodesAction) => {}

This function notifies you that the action you set up through our dashboard has been executed.

Custom action received event

func noCodesReceivedCustomAction(value: String)

fun onCustomAction(value: String)

void onCustomAction(String value)

onCustomAction: (value: string) => {}

_customActionStream = NoCodes.getSharedInstance().customActionStream.listen((event) {
    // event.value identifies the triggered action
});

// Implement the optional NoCodesCustomActionDelegate interface alongside your NoCodesDelegate
void OnCustomAction(string value)

onCustomAction: (value: string) => {}

onCustomAction: (value: string) => {}

This function is called when a Custom action is triggered on the screen. Custom actions are not executed by the SDK — implement your own handling here; the value string configured in the builder identifies which action was triggered. The screen stays open; close it using NoCodes.shared.close() if needed. If no value was configured, an empty string is delivered. Available starting from the following SDK versions:

Platform	Minimum Version
iOS	6.13.0
Android	No-Codes 1.10.0
React Native	10.9.0
Flutter	11.8.0
Cordova	7.7.0
Capacitor	1.6.0
Unity	9.7.0

Screen finished event

func noCodesFinished()

fun onFinished()

void onFinished()

onFinished: () => {}

_finishedStream = NoCodes.getSharedInstance().finishedStream.listen((event) {
    // add functionality here
});

void OnFinished()

onFinished: () => {}

onFinished: () => {}

This function notifies that the No-Codes flow has been completed and No-Codes has been finished.

Screen loading failed

func noCodesFailedToLoadScreen(error: Error?)

fun onScreenFailedToLoad(error: NoCodesError)

void onScreenFailedToLoad(NoCodesError error)

onScreenFailedToLoad: (error: NoCodesError) => {}

_screenFailedToLoadStream = NoCodes.getSharedInstance().screenFailedToLoadStream.listen((event) {
    // add functionality here
});

void OnScreenFailedToLoad(NoCodesError error)

onScreenFailedToLoad: (error: Qonversion.NoCodesError) => {}

onScreenFailedToLoad: (error: NoCodesError) => {}

This function is called when No-Codes screen loading has failed.

Localization

By default, No-Code screens automatically detect the device’s system language and display the appropriate localization if available. You can override this behavior by setting a custom locale, which takes priority over the automatic system language detection. The locale should be in standard format (e.g., "en", "en-US", "de", "de-DE"). Pass nil/null to reset to the system default locale. Setting locale during initialization:

var config = NoCodesConfiguration(
    projectKey: "your_project_key",
    locale: "de-DE"
)
NoCodes.initialize(with: config)

val config = NoCodesConfig.Builder(context, "your_project_key")
    .setLocale("de-DE")
    .build()
NoCodes.initialize(config)

NoCodesConfig config = new NoCodesConfig.Builder(context, "your_project_key")
    .setLocale("de-DE")
    .build();
NoCodes.initialize(config);

const noCodesConfig = new NoCodesConfigBuilder("projectKey")
    .setLocale("de-DE")
    .build();
NoCodes.initialize(noCodesConfig);

final noCodesConfig = NoCodesConfigBuilder("projectKey")
    .setLocale("de-DE")
    .build();
NoCodes.initialize(noCodesConfig);

var noCodesConfig = new NoCodesConfigBuilder("projectKey")
    .SetLocale("de-DE")
    .Build();
NoCodes.Initialize(noCodesConfig);

const noCodesConfig = new Qonversion.NoCodesConfigBuilder("projectKey")
    .setLocale("de-DE")
    .build();
Qonversion.NoCodes.initialize(noCodesConfig);

const noCodesConfig = new NoCodesConfigBuilder("projectKey")
    .setLocale("de-DE")
    .build();
NoCodes.initialize(noCodesConfig);

Setting locale after initialization:

NoCodes.shared.setLocale("fr-FR")
NoCodes.shared.showScreen(withContextKey: "your_context_key")

// Reset to system default
NoCodes.shared.setLocale(nil)

NoCodes.shared.setLocale("fr-FR")
NoCodes.shared.showScreen("your_context_key")

// Reset to system default
NoCodes.shared.setLocale(null)

NoCodes.getSharedInstance().setLocale("fr-FR");
NoCodes.getSharedInstance().showScreen("your_context_key");

// Reset to system default
NoCodes.getSharedInstance().setLocale(null);

NoCodes.getSharedInstance().setLocale("fr-FR");
NoCodes.getSharedInstance().showScreen("yourContextKey");

// Reset to system default
NoCodes.getSharedInstance().setLocale(null);

NoCodes.getSharedInstance().setLocale("fr-FR");
NoCodes.getSharedInstance().showScreen("yourContextKey");

// Reset to system default
NoCodes.getSharedInstance().setLocale(null);

NoCodes.GetSharedInstance().SetLocale("fr-FR");
NoCodes.GetSharedInstance().ShowScreen("yourContextKey");

// Reset to system default
NoCodes.GetSharedInstance().SetLocale(null);

Qonversion.NoCodes.getSharedInstance().setLocale("fr-FR");
Qonversion.NoCodes.getSharedInstance().showScreen("yourContextKey");

// Reset to system default
Qonversion.NoCodes.getSharedInstance().setLocale(null);

NoCodes.getSharedInstance().setLocale("fr-FR");
NoCodes.getSharedInstance().showScreen("yourContextKey");

// Reset to system default
NoCodes.getSharedInstance().setLocale(null);

Theme

No-Code screens support light and dark themes. By default, screens automatically adapt to the device’s system appearance (Auto mode). You can override this behavior by setting a specific theme, which takes priority over the automatic system theme detection.

Currently, the theme only affects skeleton loader colors, with full theming support for the No-Code Builder coming soon

Available theme modes:

Auto (default) - Follows the device’s system appearance
Light - Forces light theme regardless of device settings
Dark - Forces dark theme regardless of device settings

Setting theme during initialization:

var config = NoCodesConfiguration(
    projectKey: "your_project_key",
    theme: .dark
)
NoCodes.initialize(with: config)

val config = NoCodesConfig.Builder(context, "your_project_key")
    .setTheme(NoCodesTheme.Dark)
    .build()
NoCodes.initialize(config)

NoCodesConfig config = new NoCodesConfig.Builder(context, "your_project_key")
    .setTheme(NoCodesTheme.Dark)
    .build();
NoCodes.initialize(config);

const noCodesConfig = new NoCodesConfigBuilder("projectKey")
    .setTheme(NoCodesTheme.DARK)
    .build();
NoCodes.initialize(noCodesConfig);

final noCodesConfig = NoCodesConfigBuilder("projectKey")
    .setTheme(NoCodesTheme.dark)
    .build();
NoCodes.initialize(noCodesConfig);

var noCodesConfig = new NoCodesConfigBuilder("projectKey")
    .SetTheme(NoCodesTheme.Dark)
    .Build();
NoCodes.Initialize(noCodesConfig);

const noCodesConfig = new Qonversion.NoCodesConfigBuilder("projectKey")
    .setTheme(Qonversion.NoCodesTheme.DARK)
    .build();
Qonversion.NoCodes.initialize(noCodesConfig);

const noCodesConfig = new NoCodesConfigBuilder("projectKey")
    .setTheme(NoCodesTheme.DARK)
    .build();
NoCodes.initialize(noCodesConfig);

Setting theme after initialization:

NoCodes.shared.setTheme(.light)
NoCodes.shared.showScreen(withContextKey: "your_context_key")

// Reset to auto (follow system appearance)
NoCodes.shared.setTheme(.auto)

NoCodes.shared.setTheme(NoCodesTheme.Light)
NoCodes.shared.showScreen("your_context_key")

// Reset to auto (follow system appearance)
NoCodes.shared.setTheme(NoCodesTheme.Auto)

NoCodes.getSharedInstance().setTheme(NoCodesTheme.Light);
NoCodes.getSharedInstance().showScreen("your_context_key");

// Reset to auto (follow system appearance)
NoCodes.getSharedInstance().setTheme(NoCodesTheme.Auto);

NoCodes.getSharedInstance().setTheme(NoCodesTheme.LIGHT);
NoCodes.getSharedInstance().showScreen("yourContextKey");

// Reset to auto (follow system appearance)
NoCodes.getSharedInstance().setTheme(NoCodesTheme.AUTO);

NoCodes.getSharedInstance().setTheme(NoCodesTheme.light);
NoCodes.getSharedInstance().showScreen("yourContextKey");

// Reset to auto (follow system appearance)
NoCodes.getSharedInstance().setTheme(NoCodesTheme.auto);

NoCodes.GetSharedInstance().SetTheme(NoCodesTheme.Light);
NoCodes.GetSharedInstance().ShowScreen("yourContextKey");

// Reset to auto (follow system appearance)
NoCodes.GetSharedInstance().SetTheme(NoCodesTheme.Auto);

Qonversion.NoCodes.getSharedInstance().setTheme(Qonversion.NoCodesTheme.LIGHT);
Qonversion.NoCodes.getSharedInstance().showScreen("yourContextKey");

// Reset to auto (follow system appearance)
Qonversion.NoCodes.getSharedInstance().setTheme(Qonversion.NoCodesTheme.AUTO);

NoCodes.getSharedInstance().setTheme(NoCodesTheme.LIGHT);
NoCodes.getSharedInstance().showScreen("yourContextKey");

// Reset to auto (follow system appearance)
NoCodes.getSharedInstance().setTheme(NoCodesTheme.AUTO);

Screen customization

Use the screen customization delegate to customize the screen opening animation. For example, to enable or disable the animation (iOS only), specify the type of opening: push/popover (iOS only)/full screen. You can also pass a statusBarHidden flag that determines whether to show or hide the status bar when displaying the screen (iOS only). For example:

func presentationConfigurationForScreen(contextKey: String) -> NoCodesPresentationConfiguration {
  return NoCodesPresentationConfiguration(animated: true, presentationStyle: .push)
}

override fun getPresentationConfigurationForScreen(contextKey: String): QScreenPresentationConfig {
  return QScreenPresentationConfig(QScreenPresentationStyle.Push)
}

@NonNull
@Override
public QScreenPresentationConfig getPresentationConfigurationForScreen(@NonNull String contextKey) {
  return new QScreenPresentationConfig(QScreenPresentationStyle.Push);
}

// Set presentation style config before showing screen if needed
const screenConfig = new ScreenPresentationConfig(ScreenPresentationStyle.FULL_SCREEN, true);

NoCodes.getSharedInstance().setScreenPresentationConfig(screenConfig, 'yourContextKey');

// Set presentation style config before showing screen if needed
final config = NoCodesPresentationConfig(
    animated: true,
    presentationStyle: NoCodesPresentationStyle.fullScreen,
);

NoCodes.getSharedInstance().setScreenPresentationConfig(config, contextKey: 'yourContextKey');

// Set presentation style config before showing screen if needed
var screenConfig = new ScreenPresentationConfig(ScreenPresentationStyle.FullScreen, true);

NoCodes.GetSharedInstance().SetScreenPresentationConfig(screenConfig, "yourContextKey");

// Set presentation style config before showing screen if needed
const screenConfig = new Qonversion.ScreenPresentationConfig(Qonversion.ScreenPresentationStyle.FULL_SCREEN, true);

Qonversion.NoCodes.getSharedInstance().setScreenPresentationConfig(screenConfig, 'yourContextKey');

// Set presentation style config before showing screen if needed
const screenConfig = new ScreenPresentationConfig(ScreenPresentationStyle.FULL_SCREEN, true);

NoCodes.getSharedInstance().setScreenPresentationConfig(screenConfig, 'yourContextKey');

Custom loading view

By default, the SDK displays a skeleton loading view while the No-Code screen is loading. You can replace it with your own custom loading view by implementing the noCodesCustomLoadingView() method in the screen customization delegate. Your custom view must conform to the NoCodesLoadingView protocol (iOS) or implement the NoCodesLoadingView interface (Android). The SDK calls startAnimating() when the loading begins and stopAnimating() when the screen content is ready.

// Conform to NoCodesLoadingView
class MyLoadingView: UIView, NoCodesLoadingView {
  func startAnimating() {
    // Start your loading animation
  }

  func stopAnimating() {
    // Stop your loading animation
  }
}

// Return it from the screen customization delegate
func noCodesCustomLoadingView() -> NoCodesLoadingView? {
  return MyLoadingView(frame: .zero)
}

// Implement NoCodesLoadingView
class MyLoadingView(context: Context) : FrameLayout(context), NoCodesLoadingView {
  override fun startAnimating() {
    // Start your loading animation
  }

  override fun stopAnimating() {
    // Stop your loading animation
  }
}

// Return it from the screen customization delegate
override fun noCodesCustomLoadingView(): View? {
  return MyLoadingView(context)
}

// Implement NoCodesLoadingView
public class MyLoadingView extends FrameLayout implements NoCodesLoadingView {
  @Override
  public void startAnimating() {
    // Start your loading animation
  }

  @Override
  public void stopAnimating() {
    // Stop your loading animation
  }
}

// Return it from the screen customization delegate
@Nullable
@Override
public View noCodesCustomLoadingView() {
  return new MyLoadingView(context);
}

If noCodesCustomLoadingView() returns nil / null, the default skeleton loading view will be used.

Screens Preloading Success and Failure Actions

Overview

Get Started

Testing

Features

No-Code Builder

Remote Config

Experiments

Platform Resources

Stores Setup

SDK Migration Guides

AI-Ready

API Reference Guide

API Reference Guide v4

Loading screens before presentation

Reading default variables

Passing custom variables

Delegates

Main delegate

Unity Warning

controllerForNavigation (iOS only)

Screen shown event

Action execution start event

Action execution fail event

Action execution finish event

Custom action received event

Screen finished event

Screen loading failed

Localization

Theme

Screen customization

Custom loading view

​Loading screens before presentation

​Reading default variables

​Passing custom variables

​Delegates

​Main delegate

​Unity Warning

controllerForNavigation (iOS only)

Screen shown event

​Action execution start event

​Action execution fail event

​Action execution finish event

​Custom action received event

​Screen finished event

​Screen loading failed

​Localization

​Theme

​Screen customization

​Custom loading view

Loading screens before presentation

Reading default variables

Passing custom variables

Delegates

Main delegate

Unity Warning

Action execution start event

Action execution fail event

Action execution finish event

Custom action received event

Screen finished event

Screen loading failed

Localization

Theme

Screen customization

Custom loading view