diff --git a/mediaplayer-kmp/src/androidMain/kotlin/YouTubePlayer.android.kt b/mediaplayer-kmp/src/androidMain/kotlin/YouTubePlayer.android.kt index 1f86526..40d9fb3 100644 --- a/mediaplayer-kmp/src/androidMain/kotlin/YouTubePlayer.android.kt +++ b/mediaplayer-kmp/src/androidMain/kotlin/YouTubePlayer.android.kt @@ -16,6 +16,7 @@ import androidx.annotation.OptIn import androidx.annotation.RequiresApi import androidx.compose.animation.animateContentSize import androidx.compose.foundation.background +import androidx.compose.foundation.clickable import androidx.compose.foundation.layout.Arrangement import androidx.compose.foundation.layout.Box import androidx.compose.foundation.layout.Column @@ -25,6 +26,8 @@ import androidx.compose.foundation.layout.fillMaxSize import androidx.compose.foundation.layout.fillMaxWidth import androidx.compose.foundation.layout.padding import androidx.compose.foundation.layout.width +import androidx.compose.foundation.pager.VerticalPager +import androidx.compose.foundation.pager.rememberPagerState import androidx.compose.material.icons.Icons import androidx.compose.material.icons.filled.Pause import androidx.compose.material.icons.filled.PlayArrow @@ -33,6 +36,7 @@ import androidx.compose.material.icons.filled.VolumeUp import androidx.compose.material3.CircularProgressIndicator import androidx.compose.material3.Icon import androidx.compose.material3.IconButton +import androidx.compose.material3.MaterialTheme import androidx.compose.material3.Slider import androidx.compose.material3.SliderDefaults import androidx.compose.material3.Text @@ -49,6 +53,7 @@ import androidx.compose.ui.graphics.Color import androidx.compose.ui.platform.LocalConfiguration import androidx.compose.ui.platform.LocalContext import androidx.compose.ui.platform.LocalLifecycleOwner +import androidx.compose.ui.text.style.TextAlign import androidx.compose.ui.unit.dp import androidx.compose.ui.viewinterop.AndroidView import androidx.lifecycle.Lifecycle @@ -556,4 +561,95 @@ fun isAudioFile(url: String?): Boolean { ) == true || url?.matches( Regex(".*(radio|stream|icecast|shoutcast|audio|listen).*", RegexOption.IGNORE_CASE) ) == true +} + +@Composable +actual fun ReelsView( + videoUrls: List, + modifier: Modifier, + autoPlay: Boolean, + onInteraction: (Int, String) -> Unit +) { + val pagerState = rememberPagerState(pageCount = {videoUrls.size}) + + VerticalPager( + state = pagerState, + modifier = modifier + .fillMaxSize() + .background(Color.Black) + ) { pageIndex -> + ReelsPage( + videoUrl = videoUrls[pageIndex], + pageIndex = pageIndex, + autoPlay = autoPlay && pagerState.currentPage == pageIndex, + onInteraction = onInteraction + ) + } +} + +@Composable +fun ReelsPage( + videoUrl: String, + pageIndex: Int, + autoPlay: Boolean, + onInteraction: (Int, String) -> Unit, + isPlaying: (Boolean) -> Unit = {}, + isLoading: (Boolean) -> Unit = {}, + onVideoEnded: () -> Unit = {}, +) { + Box( + modifier = Modifier + .fillMaxSize() + .background(Color.Black) + ) { + YoutubeVideoPlayer( + youtubeURL = videoUrl, + autoPlay = autoPlay, + modifier = Modifier.fillMaxSize(), + isPlaying = isPlaying, + isLoading = isLoading, + onVideoEnded = onVideoEnded + ) + + Column( + verticalArrangement = Arrangement.SpaceBetween, + modifier = Modifier + .fillMaxSize() + .padding(16.dp) + ) { + Text( + text = "Video $pageIndex", + color = Color.White, + textAlign = TextAlign.Start, + style = MaterialTheme.typography.titleLarge + ) + + Row( + horizontalArrangement = Arrangement.SpaceBetween, + modifier = Modifier.fillMaxWidth() + ) { + Text( + text = "❤️ Like", + color = Color.White, + modifier = Modifier.clickable { + onInteraction(pageIndex, "Like") + } + ) + Text( + text = "💬 Comment", + color = Color.White, + modifier = Modifier.clickable { + onInteraction(pageIndex, "Comment") + } + ) + Text( + text = "📤 Share", + color = Color.White, + modifier = Modifier.clickable { + onInteraction(pageIndex, "Share") + } + ) + } + } + } } \ No newline at end of file diff --git a/mediaplayer-kmp/src/commonMain/kotlin/YouTubePlayer.kt b/mediaplayer-kmp/src/commonMain/kotlin/YouTubePlayer.kt index 19f7546..2efd726 100644 --- a/mediaplayer-kmp/src/commonMain/kotlin/YouTubePlayer.kt +++ b/mediaplayer-kmp/src/commonMain/kotlin/YouTubePlayer.kt @@ -1,6 +1,12 @@ +import androidx.compose.foundation.layout.fillMaxSize +import androidx.compose.foundation.layout.padding +import androidx.compose.foundation.pager.HorizontalPager +import androidx.compose.foundation.pager.VerticalPager +import androidx.compose.foundation.pager.rememberPagerState import androidx.compose.runtime.Composable import androidx.compose.ui.Modifier import androidx.compose.ui.graphics.Color +import androidx.compose.ui.unit.dp @Composable expect fun VideoPlayer(modifier: Modifier, url: String, autoPlay: Boolean) @@ -17,4 +23,60 @@ expect fun MediaPlayer( playIconColor: Color, sliderTrackColor: Color, sliderIndicatorColor: Color -) \ No newline at end of file +) +enum class PagerType { + Horizontal, + Vertical +} +@Composable +fun ReelsView( + videoUrls: List, + pagerType: PagerType, + modifier: Modifier = Modifier, + autoPlay: Boolean = true, + onInteraction: (Int, String) -> Unit = { _, _ -> } +) { + val pagerState = rememberPagerState(pageCount = {videoUrls.size}) + + when(pagerType){ + PagerType.Horizontal -> { + HorizontalPager( + state = pagerState, + modifier = modifier, + ) { page -> + VideoPlayerScreen( + url = videoUrls[page], + autoPlay = autoPlay, + onInteraction = { onInteraction(page, videoUrls[page]) } + ) + } + } + PagerType.Vertical -> { + VerticalPager( + state = pagerState, + modifier = modifier, + ) { page -> + VideoPlayerScreen( + url = videoUrls[page], + autoPlay = autoPlay, + onInteraction = { onInteraction(page, videoUrls[page]) } + ) + } + } + } +} + +@Composable +fun VideoPlayerScreen( + url: String, + autoPlay: Boolean, + onInteraction: () -> Unit +) { + VideoPlayer( + modifier = Modifier + .fillMaxSize() + .padding(8.dp), + url = url, + autoPlay = autoPlay + ) +} \ No newline at end of file diff --git a/mediaplayer-kmp/src/iosMain/kotlin/YouTubePlayer.ios.kt b/mediaplayer-kmp/src/iosMain/kotlin/YouTubePlayer.ios.kt index c6636c0..7a4cac4 100644 --- a/mediaplayer-kmp/src/iosMain/kotlin/YouTubePlayer.ios.kt +++ b/mediaplayer-kmp/src/iosMain/kotlin/YouTubePlayer.ios.kt @@ -1,3 +1,4 @@ +import androidx.compose.foundation.gestures.Orientation import androidx.compose.foundation.layout.aspectRatio import androidx.compose.foundation.layout.fillMaxWidth import androidx.compose.material3.Text @@ -8,8 +9,14 @@ import androidx.compose.ui.graphics.Color import androidx.compose.ui.interop.UIKitView import androidx.compose.ui.viewinterop.UIKitInteropProperties import androidx.compose.ui.viewinterop.UIKitView +import kotlinx.cinterop.BetaInteropApi import kotlinx.cinterop.CValue +import kotlinx.cinterop.CValues +import kotlinx.cinterop.DoubleVar import kotlinx.cinterop.ExperimentalForeignApi +import kotlinx.cinterop.cValuesOf +import kotlinx.cinterop.convert +import kotlinx.cinterop.memScoped import platform.AVFoundation.AVPlayer import platform.AVFoundation.AVPlayerItem import platform.AVFoundation.AVPlayerLayer @@ -18,11 +25,30 @@ import platform.AVFoundation.pause import platform.AVFoundation.play import platform.AVKit.AVPlayerViewController import platform.CoreGraphics.CGRect +import platform.CoreGraphics.CGSize +import platform.Foundation.NSIndexPath import platform.Foundation.NSURL import platform.QuartzCore.CATransaction import platform.QuartzCore.kCATransactionDisableActions +import platform.UIKit.UICollectionView +import platform.UIKit.UICollectionViewCell +import platform.UIKit.UICollectionViewDataSourceProtocol +import platform.UIKit.UICollectionViewFlowLayout +import platform.UIKit.UICollectionViewScrollDirection +import platform.* +import platform.CoreGraphics.CGPoint +import platform.CoreGraphics.CGRectGetMidX +import platform.CoreGraphics.CGRectGetMidY +import platform.Foundation.NSCoder +import platform.UIKit.UICollectionViewDelegateProtocol +import platform.UIKit.UIColor.Companion.blackColor +import platform.UIKit.UINib +import platform.UIKit.UIScrollView import platform.UIKit.UIView +import platform.UIKit.UIViewController +import platform.UIKit.row import platform.WebKit.WKWebView +import platform.darwin.NSInteger import platform.darwin.NSObject @Composable