---
title: "Connect with Flutter"
description: "Connect a Flutter app to the native SDKs and verify an Experience on iOS or Android."
sidebar:
  label: "Flutter"
search:
  tags: ["sdk", "setup", "flutter"]
  keywords: ["Dart", "Flutter", "install", "initialize", "integration_test"]
---

The Flutter SDK displays native Nuxie Experiences in your iOS and Android app. Use its Dart client to send events, handle purchases, and update widgets when feature access changes. Requires Flutter 3.41+ and Dart 3.11+.

1. **Installation**

    <span id="get-the-package" />

    ## Installation [toc]

    From the [Flutter SDK checkout](https://github.com/nuxieai/nuxie-flutter), prepare the native dependencies:

    ```sh title="Prepare native dependencies"
    python3 scripts/prepare-native.py
    ```

    Add the package to `pubspec.yaml`, then run `flutter pub get`:

    ```yaml title="pubspec.yaml"
    dependencies:
      nuxie_flutter:
        path: /absolute/path/to/nuxie-flutter/packages/nuxie_flutter
    ```

    For iOS 15+, enable Swift Package Manager:

    ```yaml title="pubspec.yaml · iOS"
    flutter:
      config:
        enable-swift-package-manager: true
    ```

    For Android API 23+, use Java 17+, compile SDK 36, and a `FlutterFragmentActivity` host. The preparation command creates the native source checkout under `.native/android`. Add its composite build to your app's `android/settings.gradle.kts`:

    ```kotlin title="android/settings.gradle.kts"
    includeBuild("/absolute/path/to/nuxie-flutter/.native/android") {
        dependencySubstitution {
            substitute(module("ai.nuxie:nuxie-android"))
                .using(project(":nuxie-android"))
        }
    }
    ```

    Set your `MainActivity` to inherit from `FlutterFragmentActivity`:

    ```kotlin title="MainActivity.kt"
    import io.flutter.embedding.android.FlutterFragmentActivity

    class MainActivity : FlutterFragmentActivity()
    ```

    For iOS, Swift Package Manager resolves the native SDK revision declared by the plugin. See [native setup](https://github.com/nuxieai/nuxie-flutter/blob/main/docs/native-setup.md) for local native source builds.

    <span id="configure-before-running-your-app" />

2. **Initialize**

    ## Initialize [toc]

    Copy your app's public keys from **Connect your app**. Use `pk_test_` keys in development builds and `pk_live_` keys in release builds. Keep the default service environment for both; the key selects preview or live content.

    After `WidgetsFlutterBinding.ensureInitialized()`, configure Nuxie before `runApp`:

    ```dart title="main.dart" {6-7}
    import 'package:nuxie_flutter/nuxie_flutter.dart';

    final nuxie = Nuxie.instance;
    await nuxie.configure(const NuxieConfiguration(
      apiKeys: NuxieApiKeys(
        ios: String.fromEnvironment('NUXIE_IOS_API_KEY'),
        android: String.fromEnvironment('NUXIE_ANDROID_API_KEY'),
      ),
    ));
    ```

    Place this in your asynchronous `main` function and handle configuration errors before `runApp`. Supply the platform keys when running Flutter:

    ```sh title="Run with your app keys"
    flutter run \
      --dart-define=NUXIE_IOS_API_KEY=YOUR_IOS_PUBLIC_KEY \
      --dart-define=NUXIE_ANDROID_API_KEY=YOUR_ANDROID_PUBLIC_KEY
    ```

    <span id="check-the-connection" />

    Run your app on a device or simulator. **Connect your app** shows **Connected** after Nuxie receives a request from the SDK.

    <span id="prepare-the-experience-you-will-test" />
    <span id="add-a-test-trigger" />

3. **Trigger an Experience**

    ## Trigger an Experience [toc]

    [Publish an Experience](/docs/guides/publishing) for this app with the event trigger `integration_test`. Set its re-entry rule to **Every time** if you want to show it repeatedly while integrating. Add this call to a button handler after setup:

    ```dart
    await nuxie.trigger('integration_test');
    ```

    Tapping the button sends the event. Nuxie displays the Experience when the customer matches its audience and delivery rules. For an existing Experience, replace `integration_test` with its published event name.

    <span id="show-the-experience" />

    **Connect your app** changes to **Shown** after the SDK reports that the Experience appeared.

    <span id="try-a-remote-update" />

4. **Update an Experience**

    ## Update an Experience [toc]

    Edit the Experience and publish your changes. Bring the app back to the foreground to fetch the update, then send the event again with a customer who can re-enter. New Journeys use the updated version; a Journey already in progress keeps the version it started with. The app code stays the same.

    <span id="continue" />

    See the [SDK reference](/docs/reference/flutter) for identity, feature access, and App Actions. [Delivery](/docs/guides/delivery) explains trigger and audience configuration.