Embed the Preference Center

Embed the Preference Center view directly in your app’s navigation instead of displaying it as an overlay.

This guide covers advanced Preference Center customization options, from styling the default UI to creating fully custom implementations.

Handling Display Requests

To use a custom Preference Center implementation or navigate to your embedded Preference Center instead of the default activity, set a listener to handle showing your custom UI:

Override default display

Set the PreferenceCenterOpenListener during the onAirshipReady callback.

Airship.preferenceCenter.openListener = object : PreferenceCenter.OnOpenListener {
    override fun onOpenPreferenceCenter(preferenceCenterId: String): Boolean {
        // Navigate to custom preference center UI

        // true to prevent default behavior
        // false for default Airship handling
        return true
    }
}

Set the PreferenceCenterOpenListener during the onAirshipReady callback.

PreferenceCenter.shared().setOpenListener(preferenceCenterId -> {
    // Navigate to custom preference center UI

    // true to prevent default behavior
    // false for default Airship handling
    return true;
});

Embedding with Jetpack Compose

When embedding Preference Center composables, you can choose between an all-in-one screen with a customizable top bar and a content-only Preference Center view, without a top bar.

Both composables must be wrapped in a PreferenceCenterTheme, which allows the theme to be customized.

PreferenceCenterScreen
PreferenceCenterTheme {
    PreferenceCenterScreen(identifier = "my-first-pref-center")
}

PreferenceCenterContent
PreferenceCenterTheme {
    PreferenceCenterContent(identifier = "my-first-pref-center")
}

Customizing the theme
val lightColors = PreferenceCenterColors.lightDefaults(
    background = Color(0xDEDEDE),
    surface = Color(0xFFFFFF),
    accent = Color(0x6200EE),
)

val darkColors = PreferenceCenterColors.darkDefaults(
    background = Color(0x121212),
    surface = Color(0x1E1E1E),
    accent = Color(0xBB86FC),
)

val typography = PreferenceCenterTypography.defaults(
    fontFamily = FontFamily(context.resources.getFont(R.font.roboto_regular))
)

PreferenceCenterTheme(
    colors = if (isSystemInDarkTheme()) darkColors else lightColors,
    typography = typography
) {
    // PreferenceCenterScreen OR PreferenceCenterContent
}

Embedding with XML Views

When embedding the PreferenceCenterFragment, either use a FragmentContainerView or create the fragment directly. You must specify the ID of the Preference center to be displayed when creating the fragment. The static create on PreferenceCenter will handle passing the given id to the fragment as an argument:

Instantiating a PreferenceCenterFragment

val fragment = PreferenceCenterFragment.create(preferenceCenterId = "my-first-pref-center")
PreferenceCenterFragment fragment = PreferenceCenterFragment.create("my-first-pref-center");

You will need to override the open behavior to navigate to the embedded fragment instead of letting Airship launch the PreferenceCenterActivity.