UI Options Guide

Configure the StreamLayer Element at runtime with SLRAppHost. Control Launch Button visibility, notification modes, tooltip behavior, and more.

UI Options Guide

The StreamLayer SDK exposes a rich set of runtime configuration options through the SLRAppHost interface. Use these options to control which SDK features are visible, how the StreamLayer Element behaves, and how the SDK communicates with your host app.

/**
 * Interface which get access to all available options of single [StreamLayerFragment] instance.
 */
interface SLRAppHost {

    /**
     * Visibility of the Launch button. By default it's true.
     */
    var isLaunchButtonEnabled: Boolean

    /**
     * Visibility of the Whos is watching view. By default it's true.
     */
    var isWhoIsWatchingViewEnabled: Boolean

    /**
     * Behavior of in-app notifications view. By default it's NotificationMode.ALL .
     */
    var inAppNotificationsMode: NotificationMode

    /**
     * Visibility of the Predictions point button. By default it's true.
     */
    var isPredictionsPointsEnabled: Boolean

    /**
     * Position of the Predictions point button. By default it's false.
     */
    var isPredictionsPointsStartSide: Boolean

    /**
     * Visibility of the Tooltips. By default it's true.
     */
    var isTooltipsEnabled: Boolean

    /**
     * State of the Menu - can it be closed or not. By default it's false.
     */
    var isMenuAlwaysOpened: Boolean

    /**
     * Visibility of the Profile menu item. By default it's true.
     */
    var isMenuProfileEnabled: Boolean

    /**
     * Show labels for menu items in portrait, on landscape labels show always
     */
    var isMenuLabelsVisible: Boolean

    /**
     * Top space of the Overlay height in portrait. By default it's 0.
     */
    var overlayHeightSpace: Int

    /**
     * Width of the Overlay in landscape. By default it's 0.
     */
    var overlayWidth: Int

    /**
     * Position of the Overlay in landscape. By default it's true.
     */
    var isOverlayStartSide: Boolean

    /**
     * Change style of the Overlay in landscape. By default it's false.
     */
    var isPortraitOverlayStyleEnabled: Boolean


    /**
     * Register a callback to handle requests from the SDK.
     */
    var delegate: Delegate?

    /**
     * A function to open SDK ui overlay.
     */
    fun showOverlay(overlay: Overlay)

    /**
     * A function to close SDK ui overlay.
     */
    fun hideOverlay()

    /**
     * A function to close SDK ui menu.
     */
    fun hideMenu()

    /**
     * SDK Tooltips enabled for customization. SDK gives control to the host app to provide a custom View for each type of the Tooltip
     */
    sealed class Tooltip {

    }

    /**
     * Overlays which can be opened from host app.
     */
    sealed class Overlay {
        object Statistics : Overlay()
        object Twitter : Overlay()
        object Games : Overlay()
        object Highlights : Overlay()
    }

    /**
     * Behavior of in-app notifications view.
     */
    sealed class NotificationMode {

        /**
         * Supported in-app notification types.
         */
        enum class Feature {
            CHAT,
            TWITTER,
            GAMES,
            HIGHLIGHTS,
            CUSTOM
        }

        /**
         * Selected in-app notification are enabled.
         */
        data class List(val features: kotlin.collections.List<Feature>) : NotificationMode()

        /**
         * All in-app notification are enabled.
         */
        object All : NotificationMode()

        /**
         * All in-app notification are disabled.
         */
        object Silent : NotificationMode()

    }

    /**
     * Click action of different SDK's views.
     */
    data class ActionClicked(val source: Source) {

        /**
         * Source of action.
         */
        enum class Source {
        }
    }

    /**
     * Visibility changing action of different SDK's views.
     */
    data class ActionShown(val source: Source, val isShown: Boolean) {

        /**
         * Source of action.
         */
        enum class Source {
            OVERLAY
        }
    }

    /**
     * Callback interface invoked when the SDK delegates control over Tooltip to the HOST app.
     */
    interface TooltipHandler {


        enum class Position {
            START, TOP, END, BOTTOM, UNSET
        }

        /**
         * Called when the SDK requests View for specified Tooltip.
         */
        fun getView(position: Position, onClose: () -> Unit): View
    }


    /**
     * Callback interface invoked when the SDK delegates control to the HOST app.
     */
    interface Delegate {

        /**
         * Called when the SDK requests audio ducking.
         */
        fun requestAudioDucking(level: Float)

        /**
         * Called when the SDK disable audio ducking.
         */
        fun disableAudioDucking()

        /**
         * Called when the SDK requests to change audio volume.
         */
        fun setAudioVolume(value: Float)

        /**
         * Called when the SDK requests audio volume updates.
         */
        fun getAudioVolumeListener(): Flow<Float>

        /**
         * Called when the SDK requests to video stream.
         */
        fun requestStream(id: String)

        /**
         * Called when the SDK requests TooltipHandler for specific Tooltip.
         */
        fun getTooltipHandler(tooltip: Tooltip): TooltipHandler? = null

        /**
         * Called when the SDK Action was clicked. Returns false if you want to override
         * default behavior. Otherwise returns true.
         */
        fun onActionClicked(action: ActionClicked): Boolean = true

        /**
         * Called when the SDK Action visibility was changed.
         */
        fun onActionShown(action: ActionShown) {}
    }

}

Configuring Options at Runtime

The SDK provides the StreamLayer.withStreamLayerUI() extension function for applying configuration changes to the active StreamLayerFragment:

fun FragmentActivity.withStreamLayerUI(change: SLRAppHost.() -> Unit)

Call this function on the Activity that hosts StreamLayerFragment. The SDK locates the fragment automatically and applies the changes. The following example demonstrates every available option:

// call this function on Activity which contains StreamLayerFragment
withStreamLayerUI {

    // hide Launch button
    copy(isLaunchButtonEnabled = false)

    // hide Who is watching view
    copy(isWhoIsWatchingViewEnabled = false)

    // hide Notifications view
    copy(inAppNotificationsMode = SLRAppHost.NotificationMode.Silent)

    // hide Prediction points view
    copy(isPredictionsPointsEnabled = false)

    // hide Tooltips view
    copy(isTooltipsEnabled = false)

    // make Menu always visible
    copy(isMenuAlwaysOpened = true)

    // hide Profile menu item
    copy(isMenuProfileEnabled = false)

    // set Overlay height top margin in pixels for portrait orientation
    copy(overlayHeightSpace = 200)

    // set position of Overlay for landscape orientation
    copy(isOverlayStartSide = false)

    // hide opened Overlay
    hideOverlay()

    // hide opened Menu
    hideMenu()

    // show Overlay
    showOverlay(SLRAppHost.Overlay.Statistics)

}

Related