Skip to content

KhubaibKhan4/MediaPlayer-KMP

Repository files navigation

MediaPlayer-KMP

Maven Central GitHub License GitHub Issues GitHub Pull Requests GitHub Last Commit GitHub Stars SavePalestine

Supported Platforms Supported Platforms Supported Platforms Supported Platforms Supported Platforms


Buy Me a Coffee at ko-fi.com

Untitledvideo-MadewithClipchamp57-ezgif com-video-to-gif-converter

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.
  • Local Content Support.
  • Playback Support.

Installation

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

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
            showControls: Boolean = true,
    )
}

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
            showControls: Boolean = true,
    )
}

Play Local File

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

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

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,
        showControls: Boolean = true,
)

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

Embed Content from 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()
)

JavaScript execution + element querying

val viewer = HtmlContentViewerFactory().createHtmlContentViewer()

viewer.loadUrl("https://example.com")
viewer.setPageLoadListener {
    viewer.evaluateJavaScript("document.title") { title ->
        println("Page title: $title")
    }
}

🤝 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:

LinkedIn Twitter Email

💰 You can help me by Donating

BuyMeACoffee PayPal Patreon Ko-Fi

Screenshots

Screenshot 1 Screenshot 2 Screenshot 3
Screenshot 2 Screenshot_20240710_153958
Screenshot 1
Screenshot 2
Screenshot 2024-07-10 153852
Screenshot 2024-07-10 153944

Embedded Content Support

Mobile Desktop
Screenshot 1 Screenshot 2

Demo

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

Desktop Demo

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

Star History

Star History Chart

Stargazers

Stargazers repo roster for @KhubaibKhan4/MediaPlayer-KMP

Forkers

Forkers repo roster for @KhubaibKhan4/MediaPlayer-KMP

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.

Support Us:

  • We need your support for doing more open source contributions.

Code of Conduct

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.

About

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.

Topics

Resources

Code of conduct

Security policy

Stars

Watchers

Forks

Releases

Sponsor this project

Packages

Used by

Contributors

Languages