Watermarks & overlays

The player exposes nine overlay slots in a 3×3 grid (top/center/bottom × start/center/end). Whatever you put there — a channel bug, a logo, a promo — the SDK manages the choreography: top slots drop below the control bar when it’s visible, bottom slots lift above it, everything clears the content-rating row, and all overlays hide during ad breaks.

OGPlayerView(
    player = player,
    overlays = mapOf(
        OverlaySlot.TOP_END to { ChannelBug() },
        OverlaySlot.BOTTOM_START to { PromoBadge() },
    ),
)

OGPlayerView(
    player: player,
    isFullscreen: $isFullscreen,
    overlays: [
        .topTrailing: AnyView(ChannelBug()),
        .bottomLeading: AnyView(PromoBadge()),
    ]
)

<og-player>
  <img slot="top-end" src="/bug.svg" width="90" alt="" />
  <span slot="bottom-start" class="promo">Next: the game at 9</span>
</og-player>

Slot names

	start	center	end
top	`TOP_START` / `.topLeading` / `top-start`	`TOP_CENTER` / `.topCenter` / `top-center`	`TOP_END` / `.topTrailing` / `top-end`
center	`CENTER_START` / `.centerLeading` / `center-start`	`CENTER` / `.center` / `center`	`CENTER_END` / `.centerTrailing` / `center-end`
bottom	`BOTTOM_START` / `.bottomLeading` / `bottom-start`	`BOTTOM_CENTER` / `.bottomCenter` / `bottom-center`	`BOTTOM_END` / `.bottomTrailing` / `bottom-end`