MediaPlayer-KMP

Overview

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.

Features

• Platform Agnostic: Supports Android, iOS, Web, and Desktop platforms through Kotlin Multiplatform.
• Compose Multiplatform Integration: Seamlessly integrates with JetBrains Compose Multiplatform UI framework.
• YouTube Video Playback: Easily load and play YouTube videos with minimal setup.
• Audio Player Playback: Easily load and play Audios with minimal setup.
• Event Handling: Provides callbacks and event listeners for video playback actions and events.
• Streaming Support: Provides Streaming Support For the Video and Audio Links.
• AutoPlay: AutoPlayer Support Implementation.
• Auth Token: Authentication Token Implementation.
• ReelsView Support: Reels View Support Implementation.

Future Plans

• Desktop Playback Support.
• Audio player Customisation Support.
• **Video and Audio picker for Android, iOS, Web and Desktop.

Installation

You can include MediaPlayer-KMP in your project by adding the following dependency:

Version Catelog

[versions]
mediaPlayerKMP = "2.0.5"

[libraries]
alert-kmp = { module = "io.github.khubaibkhan4:mediaplayer-kmp", version.ref = "mediaPlayerKMP" }

implementation("io.github.khubaibkhan4:mediaplayer-kmp:2.0.5")

Usage

YouTube Video Player

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
     )
}

Video Player

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
     )
}

Audio Player Support

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
    )
}

Authentication Token Support

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
)

Reels View Support

@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
        onInteraction = { page, url ->
            println("User interacted with page $page, video URL: $url")
        }
    )
}

Future Plans

• Uri Content Setup with Player.
• Playback Support.

🤝 Connect with Me

Let's chat about potential projects, job opportunities, or any other collaboration! Feel free to connect with me through the following channels:

💰 You can help me by Donating

Screenshots

Demo

Untitled.video.-.Made.with.Clipchamp.57.mp4

Desktop Demo

Untitled.video.-.Made.with.Clipchamp.54.mp4

Star History

Stargazers

Forkers

Contribution Guidelines

We welcome contributions to the MediaPlayer-KMP Library Project! To contribute, please follow these guidelines:

• Reporting Bugs: If you encounter a bug, please open an issue and provide detailed information about the bug, including steps to reproduce it.
• Suggesting Features: We encourage you to suggest new features or improvements by opening an issue and describing your idea.
• Submitting Pull Requests: If you'd like to contribute code, please fork the repository, create a new branch for your changes, and submit a pull request with a clear description of the changes.

Code of Conduct

We expect all contributors and users of the Alert-KMP Library Project to adhere to our code of conduct. Please review the Code of Conduct for details on expected behavior and reporting procedures.