PlayerDefaults
@UnstableApi
object PlayerDefaults
Contains the default values used by Player.
This object provides the standard Material3 components that make up the default player interface, including structural layouts like TopControls, CenterControls, and BottomControls.
The components have opinionated styling properties to maintain a consistent aesthetic when building custom controls or overriding specific slots within the provided layouts.
Summary
Public functions |
|
|---|---|
Unit |
@ComposableA Material3 columnar layout that display controls that are typically positioned at the bottom of the player interface. |
Unit |
@ComposableA Material3 horizontal layout with controls that are typically found in the center of the player interface. |
Unit |
@ComposableA Composable for displaying an error message overlay on top of the player. |
Unit |
@ComposableA Material3 horizontal layout with controls typically found at the top of the player interface. |
Public functions
BottomControls
@Composable
fun BottomControls(
player: Player?,
visible: Boolean,
modifier: Modifier = Modifier,
above: @Composable ColumnScope.(Player?) -> Unit = {},
left: @Composable (Player?) -> Unit = { PositionText(it, Modifier.padding(end = PlayerTokens.BottomControlsHorizontalPadding)) },
right: @Composable (Player?) -> Unit = { DurationText(it, Modifier.padding(start = PlayerTokens.BottomControlsHorizontalPadding)) },
below: @Composable ColumnScope.(Player?) -> Unit = {},
progressSlider: @Composable (Player?) -> Unit = { ProgressSlider(it) }
): Unit
A Material3 columnar layout that display controls that are typically positioned at the bottom of the player interface.
This component provides a flexible slot-based structure for building player controls. The layout is organised as follows:
+-------------------------------------------------+
| above |
+-------+---------------------------------+-------+
| left | progressSlider | right |
+-------+---------------------------------+-------+
| below |
+-------------------------------------------------+
By default, this layout provides a ProgressSlider in the center. To its left, it displays the current media position using PositionText, and to its right, it displays the total media duration using DurationText. The above and below slots are empty by default.
| Parameters | |
|---|---|
player: Player? |
The |
visible: Boolean |
Whether the layout should be visible. When |
modifier: Modifier = Modifier |
The |
above: @Composable ColumnScope.(Player?) -> Unit = {} |
Slot for content positioned above the slider. |
left: @Composable (Player?) -> Unit = {
PositionText(it, Modifier.padding(end = PlayerTokens.BottomControlsHorizontalPadding))
} |
Slot for content positioned to the left of the slider. Defaults to |
right: @Composable (Player?) -> Unit = {
DurationText(it, Modifier.padding(start = PlayerTokens.BottomControlsHorizontalPadding))
} |
Slot for content positioned to the right of the slider. Defaults to |
below: @Composable ColumnScope.(Player?) -> Unit = {} |
Slot for content positioned below the slider. |
progressSlider: @Composable (Player?) -> Unit = { ProgressSlider(it) } |
Slot for the main progress slider. It expands to fill available width and defaults to |
CenterControls
@Composable
fun CenterControls(
player: Player?,
visible: Boolean,
modifier: Modifier = Modifier,
horizontalArrangement: Arrangement.Horizontal = Arrangement.spacedBy(PlayerTokens.CenterControlsSpacing, Alignment.CenterHorizontally),
verticalAlignment: Alignment.Vertical = Alignment.CenterVertically,
backSecondary: @Composable (Player?) -> Unit = { PreviousButton(it, modifier = mediumButtonModifier) },
back: @Composable (Player?) -> Unit = { SeekBackButton(it, modifier = mediumButtonModifier) },
central: @Composable (Player?) -> Unit = { PlayPauseButton(it, modifier = largeButtonModifier, iconSize = PlayerTokens.LargeIconSize) },
forward: @Composable (Player?) -> Unit = { SeekForwardButton(it, modifier = mediumButtonModifier) },
forwardSecondary: @Composable (Player?) -> Unit = { NextButton(it, modifier = mediumButtonModifier) }
): Unit
A Material3 horizontal layout with controls that are typically found in the center of the player interface.
This component provides a flexible slot-based structure for the center player controls. The layout is organized as a centered row of buttons:
+---------------------------------------------------------------+
| |
| +-------------+--------+---------+---------+----------------+ |
| |backSecondary| back | central | forward |forwardSecondary| |
| +-------------+--------+---------+---------+----------------+ |
| |
+---------------------------------------------------------------+
By default, it displays a PreviousButton, SeekBackButton, PlayPauseButton, SeekForwardButton, and NextButton in that order. The central play/pause button is slightly larger than the others.
| Parameters | |
|---|---|
player: Player? |
The |
visible: Boolean |
Whether the layout should be visible. When |
modifier: Modifier = Modifier |
The |
horizontalArrangement: Arrangement.Horizontal = Arrangement.spacedBy(PlayerTokens.CenterControlsSpacing, Alignment.CenterHorizontally) |
The horizontal arrangement of the layout's children. |
verticalAlignment: Alignment.Vertical = Alignment.CenterVertically |
The vertical alignment of the layout's children. |
backSecondary: @Composable (Player?) -> Unit = {
PreviousButton(it, modifier = mediumButtonModifier)
} |
Slot for the outermost left control. Defaults to |
back: @Composable (Player?) -> Unit = { SeekBackButton(it, modifier = mediumButtonModifier) } |
Slot for the inner left control. Defaults to |
central: @Composable (Player?) -> Unit = {
PlayPauseButton(it, modifier = largeButtonModifier, iconSize = PlayerTokens.LargeIconSize)
} |
Slot for the central control. Defaults to a large |
forward: @Composable (Player?) -> Unit = {
SeekForwardButton(it, modifier = mediumButtonModifier)
} |
Slot for the inner right control. Defaults to |
forwardSecondary: @Composable (Player?) -> Unit = {
NextButton(it, modifier = mediumButtonModifier)
} |
Slot for the outermost right control. Defaults to |
ErrorOverlay
@Composable
fun ErrorOverlay(
player: Player?,
modifier: Modifier = Modifier,
color: Color = Color.Unspecified,
customErrorMessage: CharSequence? = null,
errorMessageProvider: ErrorMessageProvider<PlaybackException>? = rememberDefaultErrorMessageProvider()
): Unit
A Composable for displaying an error message overlay on top of the player.
| Parameters | |
|---|---|
player: Player? |
The |
modifier: Modifier = Modifier |
The |
color: Color = Color.Unspecified |
The |
customErrorMessage: CharSequence? = null |
An optional custom message to display permanently. |
errorMessageProvider: ErrorMessageProvider<PlaybackException>? = rememberDefaultErrorMessageProvider() |
An optional |
TopControls
@Composable
fun TopControls(
player: Player?,
visible: Boolean,
modifier: Modifier = Modifier,
content: @Composable BoxScope.(Player?) -> Unit = {}
): Unit
A Material3 horizontal layout with controls typically found at the top of the player interface.
This component acts as a visibility wrapper and provides a flexible Box-based structure. Because it executes the content within a BoxScope, you can easily align individual elements to specific corners (e.g., Alignment.TopEnd or Alignment.TopStart). By default, the content is empty.