Chat Options

ChatOption controls the appearance of livestream chat messages. It allows customization of chat text styling including color and shadow effects, plus V2 pinned-message colors.

Overview

ChatOption provides styling for chat messages that appear during livestreams. It allows you to customize:

Chat text color
Text shadow effects (color, offset, radius)

Creating ChatOption

Using Builder

val chatOption = ChatOption.Builder()
    .chatStyle(
        ChatStyle(
            textColor = Color.WHITE,
            textShadow = TextShadow(
                color = Color.BLACK,
                offsetX = 1f,
                offsetY = 1f,
                radius = 2f
            )
        )
    )
    .build()

Using DSL (Recommended)

val viewOptions = viewOptions {
    chatOptions {
        chatStyle(
            ChatStyle(
                textColor = Color.WHITE,
                textShadow = TextShadow(
                    color = Color.parseColor("#66000000"),
                    offsetX = 0f,
                    offsetY = 0.5f,
                    radius = 7f
                )
            )
        )
    }
}

Properties

chatStyle

Type: ChatStyle Default: White text with default shadow

Configures the visual appearance of chat text.

chatOptions {
    chatStyle(
        ChatStyle(
            textColor = Color.WHITE,
            textShadow = TextShadow(
                color = Color.BLACK,
                offsetX = 1f,
                offsetY = 1f,
                radius = 2f
            )
        )
    )
}

ChatStyle Properties

textColor

Type: Int (color) Default: White (Color.WHITE)

Color of the chat message text.

ChatStyle(
    textColor = Color.WHITE
)

textShadow

Type: TextShadow Default: Semi-transparent black shadow with default offsets

Shadow effect applied to chat text for better readability.

ChatStyle(
    textShadow = TextShadow(
        color = Color.parseColor("#66000000"),
        offsetX = 0f,
        offsetY = 0.5f,
        radius = 7f
    )
)

TextShadow Properties

color

Type: Int (color) Default: Semi-transparent black (#66000000)

Color of the text shadow. Use semi-transparent colors for subtle effects.

TextShadow(
    color = Color.parseColor("#80000000") // 50% black
)

offsetX

Type: Float Default: 0f

Horizontal offset of the shadow in pixels. Positive values shift right, negative shift left.

TextShadow(
    offsetX = 2f // Shift shadow 2px to the right
)

offsetY

Type: Float Default: 0.5f

Vertical offset of the shadow in pixels. Positive values shift down, negative shift up.

TextShadow(
    offsetY = 2f // Shift shadow 2px down
)

radius

Type: Float Default: 7f

Blur radius of the shadow. Larger values create softer shadows.

TextShadow(
    radius = 10f // Softer, more blurred shadow
)

Pinned message style

Available since 6.35.1 in the V2 livestream player. Configure pinned messages separately from normal chat text:

import android.graphics.Color
import com.firework.common.chat.PinMessageStyle
import com.firework.viewoptions.ChatOption
import com.firework.viewoptions.ViewOptions

val options = ViewOptions.Builder()
    .chatOption(
        ChatOption.Builder()
            .pinMessageStyle(
                PinMessageStyle(
                    textColor = Color.WHITE,
                    backgroundColor = 0xB3000000.toInt(),
                )
            )
            .build()
    )
    .build()

Pass these options to the player or StoryBlock initialization. The equivalent DSL is chatOptions { pinMessageStyle(PinMessageStyle(...)) }.

Setting

Default

Effect

ChatOption.pinMessageStyle

null

Uses the default pinned-message style.

PinMessageStyle.textColor

0xFFFFFFFF

Message text and paging controls.

PinMessageStyle.backgroundColor

0xB3000000

Outer container background; alpha is used as supplied.

An opaque background stays opaque; the default is approximately 70% black. This configuration applies to the V2 pinned-message experience. See multiple pinned messages for navigation behavior.

Default Values

Property

Default Value

textColor

Color.WHITE

TextShadow.color

#66000000 (semi-transparent black)

TextShadow.offsetX

0f

TextShadow.offsetY

0.5f

TextShadow.radius

7f

Complete Examples

Default Chat Style

val viewOptions = viewOptions {
    chatOptions {
        chatStyle(
            ChatStyle(
                textColor = Color.WHITE,
                textShadow = TextShadow(
                    color = Color.parseColor("#66000000"),
                    offsetX = 0f,
                    offsetY = 0.5f,
                    radius = 7f
                )
            )
        )
    }
}

No Shadow (Clean Look)

val viewOptions = viewOptions {
    chatOptions {
        chatStyle(
            ChatStyle(
                textColor = Color.WHITE,
                textShadow = null // No shadow
            )
        )
    }
}

Important Notes

Chat styling only applies to livestream content
Chat messages are not available in compact mode for StoryBlock
Shadow effects improve text readability over video backgrounds
Use semi-transparent shadow colors for natural appearance
Large shadow radius values may impact performance
Text color should contrast with typical video content
Consider accessibility when choosing colors
Chat styling is applied globally to all livestream chat in the app