Merge pull request #36 from PureSwift/feature/video

VideoPlayer

Author: colemancda

AndroidSwiftUICore/Sources/AndroidSwiftUICore/Primitives/VideoPlayer.swift

@@ -0,0 +1,38 @@
+//
+//  VideoPlayer.swift
+//  AndroidSwiftUICore
+//
+//  A video player with system playback controls. The node carries the media
+//  URL; the Android interpreter hosts a platform player view, and the desktop
+//  rig shows a placeholder.
+//
+
+import Foundation
+
+/// A playable media item. Mirrors the AVKit spelling; only URL-backed
+/// playback is modeled.
+public struct AVPlayer: Sendable {
+    public var url: URL
+    public init(url: URL) { self.url = url }
+}
+
+public struct VideoPlayer: View {
+
+    internal let player: AVPlayer
+
+    public init(player: AVPlayer) {
+        self.player = player
+    }
+
+    public typealias Body = Never
+}
+
+extension VideoPlayer: PrimitiveView {
+    public func _render(in context: ResolveContext) -> RenderNode {
+        RenderNode(
+            type: "VideoPlayer",
+            id: context.path,
+            props: ["url": .string(player.url.absoluteString)]
+        )
+    }
+}

AndroidSwiftUICore/Tests/AndroidSwiftUICoreTests/EvaluatorTests.swift

@@ -6,6 +6,7 @@
 //
 
 import Testing
+import Foundation
 @testable import AndroidSwiftUICore
 
 // MARK: - Emission
@@ -261,6 +262,13 @@ struct GraphicsTests {
         #expect(node.children[0].props["latitude"] == .double(-12.045))
     }
 
+    @Test("VideoPlayer emits its media URL")
+    func videoPlayer() {
+        let node = ViewHost(VideoPlayer(player: AVPlayer(url: URL(string: "https://example.com/clip.mp4")!))).evaluate()
+        #expect(node.type == "VideoPlayer")
+        #expect(node.props["url"] == .string("https://example.com/clip.mp4"))
+    }
+
     @Test("Overlay emits base and overlay children with alignment")
     func overlay() {
         let node = ViewHost(Color.blue.overlay(alignment: .bottomTrailing) { Text("badge") }).evaluate()

Demo/App.swiftpm/Sources/Catalog.swift

@@ -37,6 +37,7 @@ struct CatalogEntry: Identifiable {
         CatalogEntry(id: "color", title: "Color", screen: AnyCatalogScreen(ColorPlayground())),
         CatalogEntry(id: "graphics", title: "Graphics", screen: AnyCatalogScreen(GraphicsPlayground())),
         CatalogEntry(id: "map", title: "Map", screen: AnyCatalogScreen(MapPlayground())),
+        CatalogEntry(id: "video", title: "Video", screen: AnyCatalogScreen(VideoPlayground())),
         CatalogEntry(id: "scroll", title: "ScrollView", screen: AnyCatalogScreen(ScrollViewPlayground())),
         CatalogEntry(id: "list", title: "List", screen: AnyCatalogScreen(ListPlayground())),
         CatalogEntry(id: "grid", title: "Grid", screen: AnyCatalogScreen(GridPlayground())),

Demo/App.swiftpm/Sources/VideoPlaygrounds.swift

@@ -0,0 +1,24 @@
+#if canImport(AndroidSwiftUI)
+import AndroidSwiftUI
+#else
+import SwiftUI
+import AVKit
+#endif
+
+import Foundation
+
+struct VideoPlayground: View {
+    var body: some View {
+        ScrollView {
+            VStack(alignment: .leading, spacing: 0) {
+                Example("Streaming video") {
+                    VStack(alignment: .leading, spacing: 8) {
+                        VideoPlayer(player: AVPlayer(url: URL(string: "https://storage.googleapis.com/exoplayer-test-media-0/BigBuckBunny_320x180.mp4")!))
+                            .cornerRadius(8)
+                        Text("Tap the video for playback controls")
+                    }
+                }
+            }
+        }
+    }
+}

Demo/app/src/main/AndroidManifest.xml

@@ -5,6 +5,7 @@
     <uses-permission android:name="android.permission.BLUETOOTH" />
     <uses-permission android:name="android.permission.BLUETOOTH_ADMIN" />
     <uses-permission android:name="android.permission.ACCESS_COARSE_LOCATION" />
+    <uses-permission android:name="android.permission.INTERNET" />
 
     <application
         android:name=".Application"

Demo/swiftui/build.gradle.kts

@@ -28,6 +28,12 @@ kotlin {
             implementation(compose.material3)
             implementation(libs.kotlinx.serialization.json)
         }
+        androidMain.dependencies {
+            // VideoPlayer: the legacy MediaPlayer stack is unreliable for
+            // remote streams, so the Android player is Media3.
+            implementation("androidx.media3:media3-exoplayer:1.4.1")
+            implementation("androidx.media3:media3-ui:1.4.1")
+        }
         // `external fun` is JVM-only; both targets are JVM, so the bridge's
         // Swift-implemented classes live in a source set they share.
         val jvmShared by creating {

Demo/swiftui/src/androidMain/kotlin/com/pureswift/swiftui/VideoPlayer.android.kt

@@ -0,0 +1,35 @@
+package com.pureswift.swiftui
+
+import androidx.compose.foundation.layout.fillMaxWidth
+import androidx.compose.foundation.layout.height
+import androidx.compose.runtime.Composable
+import androidx.compose.runtime.DisposableEffect
+import androidx.compose.runtime.remember
+import androidx.compose.ui.platform.LocalContext
+import androidx.compose.ui.viewinterop.AndroidView
+import androidx.compose.ui.unit.dp
+import androidx.media3.common.MediaItem
+import androidx.media3.exoplayer.ExoPlayer
+import androidx.media3.ui.PlayerView
+
+/// Hosts a Media3 player with its standard controls. The player prepares
+/// paused on the first frame; the user starts playback from the controls.
+@Composable
+internal actual fun RenderVideoPlayer(node: ViewNode) {
+    val url = node.string("url") ?: return
+    val context = LocalContext.current
+    val player = remember(node.id, url) {
+        ExoPlayer.Builder(context).build().apply {
+            setMediaItem(MediaItem.fromUri(url))
+            playWhenReady = false
+            prepare()
+        }
+    }
+    DisposableEffect(node.id, url) {
+        onDispose { player.release() }
+    }
+    AndroidView(
+        factory = { PlayerView(it).apply { this.player = player } },
+        modifier = node.composeModifiers().fillMaxWidth().height(220.dp),
+    )
+}

Demo/swiftui/src/commonMain/kotlin/com/pureswift/swiftui/Render.kt

@@ -258,6 +258,8 @@ private fun RenderResolved(node: ViewNode) {
 
             "Map" -> RenderMap(node)
 
+            "VideoPlayer" -> RenderVideoPlayer(node)
+
             "ProgressView" -> {
                 val value = node.double("value")
                 if (value != null) {

Demo/swiftui/src/commonMain/kotlin/com/pureswift/swiftui/VideoPlayer.kt

@@ -0,0 +1,9 @@
+package com.pureswift.swiftui
+
+import androidx.compose.runtime.Composable
+
+/// A video player for the node's `url`. Platform-specific: Android hosts a
+/// system player view with playback controls; the desktop rig shows a
+/// placeholder.
+@Composable
+internal expect fun RenderVideoPlayer(node: ViewNode)

Demo/swiftui/src/desktopMain/kotlin/com/pureswift/swiftui/VideoPlayer.desktop.kt

@@ -0,0 +1,22 @@
+package com.pureswift.swiftui
+
+import androidx.compose.foundation.background
+import androidx.compose.foundation.layout.Box
+import androidx.compose.foundation.layout.fillMaxWidth
+import androidx.compose.foundation.layout.height
+import androidx.compose.runtime.Composable
+import androidx.compose.ui.Alignment
+import androidx.compose.ui.graphics.Color
+import androidx.compose.material3.Text
+import androidx.compose.ui.unit.dp
+
+/// The desktop rig has no media stack; show a labeled placeholder.
+@Composable
+internal actual fun RenderVideoPlayer(node: ViewNode) {
+    Box(
+        contentAlignment = Alignment.Center,
+        modifier = node.composeModifiers().fillMaxWidth().height(220.dp).background(Color.Black),
+    ) {
+        Text("▶ ${node.string("url") ?: ""}", color = Color.White)
+    }
+}