Enables seamless YouTube video and audio playback across multiple platforms, integrating with JetBrains Compose Multiplatform. Features include authentication tokens, event handling, and reels view support.
MediaPlayer-KMP is a Kotlin Multiplatform (KMP) library that allows you to display and play YouTube videos across Android, iOS, Web, and Desktop platforms using JetBrains Compose Multiplatform. It provides a unified API for video playback that seamlessly integrates into Kotlin's multiplatform ecosystem.
You can include MediaPlayer-KMP in your project by adding the following dependency:
Version Catelog
[versions]
mediaPlayerKMP = "2.0.9"
[libraries]
alert-kmp = { module = "io.github.khubaibkhan4:mediaplayer-kmp", version.ref = "mediaPlayerKMP" }
implementation("io.github.khubaibkhan4:mediaplayer-kmp:2.0.9")
For the YouTube Player, you just need to provide the youtube video link. It will automatically detect it & will launch the YouTube Player.
import io.github.khubaibkhan4.mediaplayer.VideoPlayer
fun main() {
VideoPlayer(modifier = Modifier.fillMaxWidth().height(340.dp),
url = "https://www.youtube.com/watch?v=AD2nEllUMJw", // Automatically Detect the URL, Wether to Play YouTube Video or .mp4 e.g
showControls: Boolean = true,
)
}
For the YouTube Player, you just need to provide the youtube video link. It will automatically detect it & will launch the YouTube Player. It almost supports all the video extensions.
import io.github.khubaibkhan4.mediaplayer.VideoPlayer
fun main() {
VideoPlayer(modifier = Modifier.fillMaxWidth().height(340.dp),
url = "https://freetestdata.com/wp-content/uploads/2022/02/Free_Test_Data_1MB_MP4.mp4", // Automatically Detect the URL, Wether to Play YouTube Video or .mp4 e.g
showControls: Boolean = true,
)
}
To Play Local files, you just need to provide the file path.
import io.github.khubaibkhan4.mediaplayer.VideoPlayer
fun main() {
VideoPlayerScreen(
url = filePath,
autoPlay = false,
onInteraction = {},
showControls = true
)
}
Audio Player Support is Implemented. It supports mp3 wav aac ogg m4a. It Supports Play
Back, Volume Up, Down and Stability as well.
import io.github.khubaibkhan4.mediaplayer.VideoPlayer
fun main() {
MediaPlayer(
modifier = Modifier.fillMaxWidth(),
url = "https://commondatastorage.googleapis.com/codeskulptor-demos/DDR_assets/Kangaroo_MusiQue_-_The_Neverwritten_Role_Playing_Game.mp3",
startTime = Color.Black,
endTime = Color.Black,
volumeIconColor = Color.Black,
playIconColor = Color.Blue,
sliderTrackColor = Color.LightGray,
sliderIndicatorColor = Color.Blue,
showControls: Boolean = true,
)
}
Providing the Auth Tokens are pretty simple. You just need to add the headers. You can add the headers with key and value pairs.
MediaPlayer(
modifier = Modifier.fillMaxSize(),
url = "https://example.com/protected-video.mp4",
headers = mapOf(
"Authorization" to "Bearer your_token",
"Custom-Header" to "YourValue"
),
startTime = Color.Red,
endTime = Color.Blue,
autoPlay = true,
volumeIconColor = Color.Green,
playIconColor = Color.Yellow,
sliderTrackColor = Color.Gray,
sliderIndicatorColor = Color.Magenta,
showControls: Boolean = true,
)
@Composable
fun MainScreen() {
val videoUrls = listOf(
"https://www.example.com/video1.mp4",
"https://www.example.com/video2.mp4",
"https://www.example.com/video3.mp4"
)
ReelsView(
videoUrls = videoUrls,
pagerType = PagerType.Vertical, // Choose PagerType.Vertical or PagerType.Horizontal
modifier = Modifier.fillMaxSize(),
autoPlay = true, // Enable auto-play for videos
showControls: Boolean = true,
onInteraction = { page, url ->
println("User interacted with page $page, video URL: $url")
}
)
}
val viewer = HtmlContentViewerFactory().createHtmlContentViewer()
val htmlEmbedFeature = HtmlEmbedFeature(viewer)
htmlEmbedFeature.embedHtml(
url = "https://github.com/KhubaibKhan4/MediaPlayer-KMP/",
options = EmbedOptions(
customCss = "body { background-color: #f0f0f0; }",
onPageLoaded = { println("Page loaded successfully!") },
onError = { error -> println("Error loading page: $error") }
)
)
HtmlContentViewerView(
viewer = viewer,
modifier = Modifier
.fillMaxSize()
)
val viewer = HtmlContentViewerFactory().createHtmlContentViewer()
viewer.loadUrl("https://example.com")
viewer.setPageLoadListener {
viewer.evaluateJavaScript("document.title") { title ->
println("Page title: $title")
}
}
Let's chat about potential projects, job opportunities, or any other collaboration! Feel free to connect with me through the following channels:
 |  |  |
|---|---|---|
 |
 |
|---|
 |
| Mobile | Desktop |
|---|---|
 |  |
https://github.com/KhubaibKhan4/MediaPlayer-KMP/assets/98816544/657ad29d-5129-4f78-af56-ad354ba0935d
https://github.com/KhubaibKhan4/MediaPlayer-KMP/assets/98816544/efd68685-2f41-4445-ad76-c183869ab93a
Stargazers
Forkers
We welcome contributions to the MediaPlayer-KMP Library Project! To contribute, please follow these guidelines:
We expect all contributors and users of the MediaPlayer-KMP Library Project to adhere to our code of conduct. Please review the Code of Conduct for details on expected behavior and reporting procedures.
Surfaced from shared tags and platforms — no rankings paid for.