# In-App Experiences

Configure and control In-App Experiences in Cordova applications.

<!-- PAGE: In-App Experiences, PATH: https://www.airship.com/docs/developer/sdk-integration/cordova/in-app-experiences/getting-started/ -->

# In-App Experiences

> Pause, resume, and control display timing for In-App Experiences.
In-App Experiences are automatically enabled when you integrate the Airship SDK. Use these methods to control when and how they are displayed.

## Pausing and Resuming Display

You can pause and resume In-App Experiences to control when they are displayed to users.

```javascript
// Pause in-app experiences
Airship.inApp.setPaused(true)

// Resume in-app experiences
Airship.inApp.setPaused(false)

// Check if paused
Airship.inApp.isPaused((isPaused) => {
  console.log('Is paused:', isPaused)
})
```


### Auto-Pause on Launch

You can configure the SDK to automatically pause In-App Experiences on launch. This is useful if you want to defer showing In-App Experiences until after onboarding or other critical app flows.

```javascript
Airship.takeOff({
  production: {
    appKey: "<APP_KEY>",
    appSecret: "<APP_SECRET>"
  },
  development: {
    appKey: "<APP_KEY>",
    appSecret: "<APP_SECRET>"
  },
  inProduction: true,
  site: "us",
  autoPauseInAppAutomationOnLaunch: true
})
```


See the [Cordova Plugin Setup guide](https://www.airship.com/docs/developer/sdk-integration/cordova/installation/getting-started/) for complete `takeOff` configuration options.

When you're ready to display In-App Experiences, call `setPaused(false)`:

```javascript
Airship.inApp.setPaused(false)
```


## Display Interval

Control the minimum time between In-App Experience displays to avoid overwhelming users.

```javascript
// Set display interval to 5 seconds
Airship.inApp.setDisplayInterval(5000)

// Get current display interval
Airship.inApp.getDisplayInterval((interval) => {
  console.log('Display interval:', interval)
})
```


The display interval is the minimum time (in milliseconds) that must pass between displaying In-App Experiences.



<!-- /PAGE: In-App Experiences -->

<!-- PAGE: Custom Views, PATH: https://www.airship.com/docs/developer/sdk-integration/cordova/in-app-experiences/custom-views/ -->

# Custom Views

> Register custom native views to use within Scenes.
A *Custom View* is a native view from your mobile or web application embedded into a Scene. Custom Views can display any native content your app exposes, so you can reuse that existing content within any screen in a Scene.

Custom Views allow you to embed native iOS and Android views within Scenes, giving you full control over design and layout while leveraging Airship's targeting and orchestration capabilities.

## Requirements

To use Custom Views in Cordova, you must extend the native Airship modules by implementing native code on each platform.

## Registering Custom Views

Custom Views must be registered on each native platform separately:

### iOS

See the [Apple Custom Views documentation](https://www.airship.com/docs/developer/sdk-integration/apple/in-app-experiences/custom-views/) for detailed implementation instructions.

Custom Views should be registered after takeOff in your native iOS code. You can add this to your `AppDelegate.swift` or a custom plugin:

```swift
import AirshipKit

// In your AppDelegate or after Airship.takeOff
AirshipCustomViewManager.shared.register(name: "my-custom-view") { args in
    // Return your SwiftUI view
    MyCustomView(args: args)
}
```


### Android

See the [Android Custom Views documentation](https://www.airship.com/docs/developer/sdk-integration/android/in-app-experiences/custom-views/) for detailed implementation instructions.

Custom Views should be registered during the `onAirshipReady` callback in your native Android code. You can use Airship's `Autopilot` to register views at startup:

```kotlin
import com.urbanairship.AirshipCustomViewManager
import com.urbanairship.Autopilot
import com.urbanairship.UAirship

class CustomAutopilot : Autopilot() {
    override fun onAirshipReady(airship: UAirship) {
        // Register custom views
        AirshipCustomViewManager.register("my-custom-view") { context, args ->
            // Return your Android View
            MyCustomView(context, args)
        }
    }
}
```


Don't forget to register your `Autopilot` in `AndroidManifest.xml`:

```xml
<meta-data
    android:name="com.urbanairship.autopilot"
    android:value="your.package.name.CustomAutopilot" />
```


## Using Custom Views

Once registered, Custom Views can be added to Scenes in the Airship dashboard:

1. Create or edit a Scene
2. Add the **Custom View** content element to a screen
3. Enter the view name (e.g., `my-custom-view`) that matches the name you registered in your native code
4. Optionally add key-value pairs to pass custom properties to the view

The native view will be displayed within the Scene with the properties you configured.



<!-- /PAGE: Custom Views -->