Expandable Player Modifier

A custom Jetpack Compose modifier that adds an expandable media player to your screen, inspired by SoundCloud's mini-player.

Features

• Supports vertical dragging to expand/collapse the player.
• Customizable height, corner radius, and padding for minimized and maximized states.
• Smooth animations for transitions.
• Fully composable and integrates seamlessly with Jetpack Compose UI.

Demo

Usage

Here's an example of how to use the expandable modifier in your Composable:

@Composable
fun ExampleDemo() {
    val scope = rememberCoroutineScope()
    val settings = ExpandableSettings(
        minimizedHeight = 70.dp,
        maximizedHeight = 650.dp,
        bottomPadding = 100.dp,
        expandedBottomPadding = 8.dp,
        cornerRadius = 35.dp
    )
    val handler = remember { MinimizableHandler(scope, settings) }

    Box(
        modifier = Modifier
            .fillMaxSize(),
        contentAlignment = Alignment.BottomCenter
    ) {
        // Your content goes here
        PlayerView(
            modifier = Modifier
                .fillMaxWidth()
                .expandable(handler = handler, scope = scope),
            miniHandler = handler
        )
    }
}

Settings

Customize the behavior using ExpandableSettings:

data class ExpandableSettings(
    val minimizedHeight: Dp,
    val maximizedHeight: Dp,
    val bottomPadding: Dp,
    val expandedBottomPadding: Dp,
    val cornerRadius: Dp
)

How It Works

The expandable modifier responds to gestures and adjusts its height, corner radius, and alpha based on the expansion state. You can expand or collapse the player programmatically using the MinimizableHandler.

License

This project is licensed under the MIT License. See the LICENSE file for details.