fix loadingcircle and loadingcircle color

2024-07-29 13:56:08 +02:00 · 2024-07-29 13:56:08 +02:00 · e5294a198d
parent abdb48ec46
commit e5294a198d
6 changed files with 159 additions and 87 deletions
--- a/new-player/src/main/java/net/newpipe/newplayer/model/VideoPlayerViewModel.kt
+++ b/new-player/src/main/java/net/newpipe/newplayer/model/VideoPlayerViewModel.kt
@ -57,7 +57,8 @@ data class VideoPlayerUIState(
    val contentRatio: Float,
    val embeddedUiRatio: Float,
    val contentFitMode: ContentScale,
-    val seekerPosition: Float
+    val seekerPosition: Float,
+    val isLoading: Boolean
 ) : Parcelable {
    companion object {
        val DEFAULT = VideoPlayerUIState(
@ -68,7 +69,8 @@ data class VideoPlayerUIState(
            contentRatio = 16 / 9F,
            embeddedUiRatio = 16F / 9F,
            contentFitMode = ContentScale.FIT_INSIDE,
-            seekerPosition = 0F
+            seekerPosition = 0F,
+            isLoading = true
        )
    }
 }
@ -179,6 +181,14 @@ class VideoPlayerViewModelImpl @Inject constructor(
                    super.onVideoSizeChanged(videoSize)
                    updateContentRatio(VideoSize.fromMedia3VideoSize(videoSize))
                }
+
+                override fun onIsLoadingChanged(isLoading: Boolean) {
+                    super.onIsLoadingChanged(isLoading)
+                    mutableUiState.update {
+                        it.copy(isLoading = isLoading)
+                    }
+                    Log.i(TAG, if (isLoading) "Player started loading" else "Player finished loading")
+                }
            })
        }
    }
@ -276,7 +286,6 @@ class VideoPlayerViewModelImpl @Inject constructor(
        mutableUiState.update {
            it.copy(seekerPosition = progressPercentage)
        }
-        Log.i(TAG, "Progress: $progress, Duration: $duration")
    }

    override fun hideUi() {
--- a/new-player/src/main/java/net/newpipe/newplayer/ui/VideoPlayerControllerUI.kt
+++ b/new-player/src/main/java/net/newpipe/newplayer/ui/VideoPlayerControllerUI.kt
@ -23,29 +23,25 @@ package net.newpipe.newplayer.ui
 import android.view.MotionEvent
 import androidx.activity.compose.BackHandler
 import androidx.compose.animation.AnimatedVisibility
-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
 import androidx.compose.foundation.layout.PaddingValues
 import androidx.compose.foundation.layout.Row
-import androidx.compose.foundation.layout.Spacer
 import androidx.compose.foundation.layout.WindowInsets
 import androidx.compose.foundation.layout.defaultMinSize
 import androidx.compose.foundation.layout.displayCutout
 import androidx.compose.foundation.layout.fillMaxSize
 import androidx.compose.foundation.layout.fillMaxWidth
-import androidx.compose.foundation.layout.ime
+import androidx.compose.foundation.layout.height
 import androidx.compose.foundation.layout.padding
 import androidx.compose.foundation.layout.size
 import androidx.compose.foundation.layout.systemBars
 import androidx.compose.foundation.layout.systemGestures
 import androidx.compose.foundation.layout.union
 import androidx.compose.foundation.layout.waterfall
-import androidx.compose.foundation.layout.windowInsetsBottomHeight
+import androidx.compose.foundation.layout.width
 import androidx.compose.foundation.layout.windowInsetsPadding
-import androidx.compose.foundation.layout.windowInsetsTopHeight
 import androidx.compose.material.icons.Icons
 import androidx.compose.material.icons.automirrored.filled.List
 import androidx.compose.material.icons.automirrored.filled.MenuBook
@ -64,10 +60,12 @@ import androidx.compose.material.icons.filled.Subtitles
 import androidx.compose.material.icons.filled.Translate
 import androidx.compose.material3.Button
 import androidx.compose.material3.ButtonDefaults
+import androidx.compose.material3.CircularProgressIndicator
 import androidx.compose.material3.DropdownMenu
 import androidx.compose.material3.DropdownMenuItem
 import androidx.compose.material3.Icon
 import androidx.compose.material3.IconButton
+import androidx.compose.material3.MaterialTheme
 import androidx.compose.material3.Slider
 import androidx.compose.material3.Surface
 import androidx.compose.material3.Text
@ -101,6 +99,7 @@ fun VideoPlayerControllerUI(
    fullscreen: Boolean,
    uiVissible: Boolean,
    seekPosition: Float,
+    isLoading: Boolean,
    play: () -> Unit,
    pause: () -> Unit,
    prevStream: () -> Unit,
@ -113,10 +112,17 @@ fun VideoPlayerControllerUI(
    seekingFinished: () -> Unit
 ) {

+    if (fullscreen) {
+        BackHandler {
+            switchToEmbeddedView()
+        }
+    }
+
    val insets =
        WindowInsets.systemBars
            .union(WindowInsets.displayCutout)
            .union(WindowInsets.waterfall)
+
    if (!uiVissible) {
        TouchUi(
            modifier = Modifier
@ -128,62 +134,72 @@ fun VideoPlayerControllerUI(
            fullscreen = fullscreen
        )
    }
+
    AnimatedVisibility(uiVissible) {
        Surface(
            modifier = Modifier.fillMaxSize(), color = Color(0x75000000)
-        ) {
-            TouchUi(
+        ) {}
+    }
+
+    if (isLoading) {
+        Box(modifier = Modifier.fillMaxSize()) {
+            CircularProgressIndicator(
                modifier = Modifier
-                    .fillMaxSize()
-                    .windowInsetsPadding(WindowInsets.systemGestures),
-                hideUi = hideUi,
-                showUi = showUi,
-                uiVissible = uiVissible,
-                fullscreen = fullscreen
+                    .width(64.dp)
+                    .height(64.dp)
+                    .align(Alignment.Center),
+                color = MaterialTheme.colorScheme.onSurface
            )
-
-            Box {
-                CenterUI(
-                    modifier = Modifier.align(Alignment.Center),
-                    isPlaying = isPlaying,
-                    play = play,
-                    pause = pause,
-                    prevStream = prevStream,
-                    nextStream = nextStream
-                )
-            }
-
-            Box(
-                modifier = if (fullscreen) Modifier.windowInsetsPadding(insets) else Modifier
-            ) {
-                TopUI(
-                    modifier = Modifier
-                        .align(Alignment.TopStart)
-                        .fillMaxWidth()
-                        .defaultMinSize(minHeight = 45.dp)
-                        .padding(top = 4.dp, start = 16.dp, end = 16.dp)
-                )
-
-                BottomUI(
-                    modifier = Modifier
-                        .align(Alignment.BottomStart)
-                        .padding(start = 16.dp, end = 16.dp)
-                        .defaultMinSize(minHeight = 40.dp)
-                        .fillMaxWidth(),
-                    isFullscreen = fullscreen,
-                    seekPosition,
-                    switchToFullscreen,
-                    switchToEmbeddedView,
-                    seekPositionChanged,
-                    seekingFinished
-                )
-            }
-
        }
    }
-    if (fullscreen) {
-        BackHandler {
-            switchToEmbeddedView()
+
+    AnimatedVisibility(uiVissible) {
+        TouchUi(
+            modifier = Modifier
+                .fillMaxSize()
+                .windowInsetsPadding(WindowInsets.systemGestures),
+            hideUi = hideUi,
+            showUi = showUi,
+            uiVissible = uiVissible,
+            fullscreen = fullscreen
+        )
+
+        Box(modifier = Modifier.fillMaxSize()) {
+            CenterUI(
+                modifier = Modifier.align(Alignment.Center),
+                isPlaying = isPlaying,
+                isLoading = isLoading,
+                play = play,
+                pause = pause,
+                prevStream = prevStream,
+                nextStream = nextStream
+            )
+        }
+
+        Box(
+            modifier = if (fullscreen) Modifier.windowInsetsPadding(insets) else Modifier
+        ) {
+            TopUI(
+                modifier = Modifier
+                    .align(Alignment.TopStart)
+                    .fillMaxWidth()
+                    .defaultMinSize(minHeight = 45.dp)
+                    .padding(top = 4.dp, start = 16.dp, end = 16.dp)
+            )
+
+            BottomUI(
+                modifier = Modifier
+                    .align(Alignment.BottomStart)
+                    .padding(start = 16.dp, end = 16.dp)
+                    .defaultMinSize(minHeight = 40.dp)
+                    .fillMaxWidth(),
+                isFullscreen = fullscreen,
+                seekPosition,
+                switchToFullscreen,
+                switchToEmbeddedView,
+                seekPositionChanged,
+                seekingFinished
+            )
        }
    }
 }
@ -370,6 +386,7 @@ private fun MainMenu() {
 private fun CenterUI(
    modifier: Modifier,
    isPlaying: Boolean,
+    isLoading: Boolean,
    play: () -> Unit,
    pause: () -> Unit,
    nextStream: () -> Unit,
@ -380,32 +397,34 @@ private fun CenterUI(
        horizontalArrangement = Arrangement.SpaceBetween,
        modifier = modifier,
    ) {
-        CenterControllButton(
-            buttonModifier = Modifier.size(80.dp),
-            iconModifier = Modifier.size(40.dp),
-            icon = Icons.Filled.SkipPrevious,
-            contentDescriptoion = stringResource(R.string.widget_description_previous_stream),
-            onClick = prevStream
-        )
+        if (!isLoading) {
+            CenterControllButton(
+                buttonModifier = Modifier.size(80.dp),
+                iconModifier = Modifier.size(40.dp),
+                icon = Icons.Filled.SkipPrevious,
+                contentDescriptoion = stringResource(R.string.widget_description_previous_stream),
+                onClick = prevStream
+            )

-        CenterControllButton(
-            buttonModifier = Modifier.size(80.dp),
-            iconModifier = Modifier.size(60.dp),
-            icon = if (isPlaying) Icons.Filled.Pause else Icons.Filled.PlayArrow,
-            contentDescriptoion = stringResource(
-                if (isPlaying) R.string.widget_description_pause
-                else R.string.widget_description_play
-            ),
-            onClick = if (isPlaying) pause else play
-        )
+            CenterControllButton(
+                buttonModifier = Modifier.size(80.dp),
+                iconModifier = Modifier.size(60.dp),
+                icon = if (isPlaying) Icons.Filled.Pause else Icons.Filled.PlayArrow,
+                contentDescriptoion = stringResource(
+                    if (isPlaying) R.string.widget_description_pause
+                    else R.string.widget_description_play
+                ),
+                onClick = if (isPlaying) pause else play
+            )

-        CenterControllButton(
-            buttonModifier = Modifier.size(80.dp),
-            iconModifier = Modifier.size(40.dp),
-            icon = Icons.Filled.SkipNext,
-            contentDescriptoion = stringResource(R.string.widget_description_next_stream),
-            onClick = nextStream
-        )
+            CenterControllButton(
+                buttonModifier = Modifier.size(80.dp),
+                iconModifier = Modifier.size(40.dp),
+                icon = Icons.Filled.SkipNext,
+                contentDescriptoion = stringResource(R.string.widget_description_next_stream),
+                onClick = nextStream
+            )
+        }
    }
 }

@ -421,7 +440,7 @@ private fun CenterControllButton(
        onClick = onClick,
        contentPadding = PaddingValues(0.dp),
        colors = ButtonDefaults.buttonColors(
-            containerColor = Color.Transparent, contentColor = video_player_onSurface
+            containerColor = Color.Transparent,
        ),
        modifier = buttonModifier
    ) {
@ -502,6 +521,7 @@ fun VideoPlayerControllerUIPreviewEmbeded() {
                fullscreen = false,
                uiVissible = true,
                seekPosition = 0.3F,
+                isLoading = false,
                play = {},
                pause = {},
                prevStream = {},
@ -525,6 +545,7 @@ fun VideoPlayerControllerUIPreviewLandscape() {
                fullscreen = true,
                uiVissible = true,
                seekPosition = 0.3F,
+                isLoading = true,
                play = {},
                pause = {},
                prevStream = {},
@ -549,6 +570,7 @@ fun VideoPlayerControllerUIPreviewPortrait() {
                fullscreen = true,
                uiVissible = true,
                seekPosition = 0.3F,
+                isLoading = false,
                play = {},
                pause = {},
                prevStream = {},
--- a/new-player/src/main/java/net/newpipe/newplayer/ui/VideoPlayerLoadingPlaceholder.kt
+++ b/new-player/src/main/java/net/newpipe/newplayer/ui/VideoPlayerLoadingPlaceholder.kt
@ -27,6 +27,7 @@ fun VideoPlayerLoadingPlaceholder(aspectRatio: Float = 3F / 1F) {
        Box(contentAlignment = Alignment.Center) {
            CircularProgressIndicator(modifier = Modifier
                .width(64.dp)
+                .height(64.dp)
                .align((Alignment.Center)))
        }
    }
--- a/new-player/src/main/java/net/newpipe/newplayer/ui/VideoPlayerUI.kt
+++ b/new-player/src/main/java/net/newpipe/newplayer/ui/VideoPlayerUI.kt
@ -119,6 +119,7 @@ fun VideoPlayerUI(
                fullscreen = uiState.fullscreen,
                uiVissible = uiState.uiVissible,
                seekPosition = uiState.seekerPosition,
+                isLoading = uiState.isLoading,
                play = viewModel::play,
                pause = viewModel::pause,
                prevStream = viewModel::prevStream,
--- a/new-player/src/main/java/net/newpipe/newplayer/ui/theme/Color.kt
+++ b/new-player/src/main/java/net/newpipe/newplayer/ui/theme/Color.kt
@ -20,10 +20,20 @@

 package net.newpipe.newplayer.ui.theme

+import androidx.compose.foundation.layout.fillMaxSize
+import androidx.compose.material3.Surface
+import androidx.compose.runtime.Composable
+import androidx.compose.ui.Modifier
 import androidx.compose.ui.graphics.Color
+import androidx.compose.ui.tooling.preview.Preview
+import net.newpipe.newplayer.ui.PreviewBackgroundSurface
+import net.newpipe.newplayer.ui.VideoPlayerControllerUI

 val video_player_primary = Color(0xFFE53935)
-val video_player_onPrimary = Color(0xFF452B00)
+
+// The color of buttons, and the LoadingCircle
+val video_player_onPrimary = Color(0xFFF8F8F8)
+
 val video_player_primaryContainer = Color(0xFF633F00)
 val video_player_onPrimaryContainer = Color(0xFFFFDDB3)
 val video_player_secondary = Color(0xFFDDC2A1)
@ -41,9 +51,14 @@ val video_player_onErrorContainer = Color(0xFFFFDAD6)
 val video_player_background = Color(0xFF1F1B16)
 val video_player_onBackground = Color(0xFFEAE1D9)
 val video_player_surface = Color(0xFF000000)
-val video_player_onSurface = Color(0xFFEAE1D9)
+
+// The color of the Text and icons
+val video_player_onSurface = Color(0xFFF8F8F8)
+
+// The color of the menu Icons
+val video_player_onSurfaceVariant = Color(0xFFF8F8F8)
+
 val video_player_surfaceVariant = Color(0xFF4F4539)
-val video_player_onSurfaceVariant = Color(0xFFD3C4B4)
 val video_player_outline = Color(0xFF9C8F80)
 val video_player_inverseOnSurface = Color(0xFF1F1B16)
 val video_player_inverseSurface = Color(0xFFEAE1D9)
@ -53,3 +68,27 @@ val video_player_surfaceTint = Color(0xFFFFB951)
 val video_player_outlineVariant = Color(0xFF4F4539)
 val video_player_scrim = Color(0xFF000000)

+@Preview(device = "spec:width=1080px,height=600px,dpi=440,orientation=landscape")
+@Composable
+fun VideoPlayerControllerUIPreviewEmbeddedColorpreview() {
+    VideoPlayerTheme {
+        PreviewBackgroundSurface {
+            VideoPlayerControllerUI(isPlaying = false,
+                fullscreen = false,
+                uiVissible = true,
+                seekPosition = 0.3F,
+                isLoading = false,
+                play = {},
+                pause = {},
+                prevStream = {},
+                nextStream = {},
+                switchToFullscreen = {},
+                switchToEmbeddedView = {},
+                showUi = {},
+                hideUi = {},
+                seekPositionChanged = {},
+                seekingFinished = {})
+        }
+    }
+}
+
--- a/test-app/src/main/java/net/newpipe/newplayer/testapp/MainActivity.kt
+++ b/test-app/src/main/java/net/newpipe/newplayer/testapp/MainActivity.kt
@ -59,7 +59,7 @@ class MainActivity : AppCompatActivity() {

        startStreamButton.setOnClickListener {
            newPlayer.playWhenReady = true
-            newPlayer.setStream(getString(R.string.portrait_video_example))
+            newPlayer.setStream(getString(R.string.ccc_6502_video))
        }

        videoPlayerViewModel.newPlayer = newPlayer