From e5294a198dfc602ac0caf3a07e68acc3a72995a7 Mon Sep 17 00:00:00 2001 From: Christian Schabesberger Date: Mon, 29 Jul 2024 13:56:08 +0200 Subject: [PATCH] fix loadingcircle and loadingcircle color --- .../newplayer/model/VideoPlayerViewModel.kt | 15 +- .../newplayer/ui/VideoPlayerControllerUI.kt | 182 ++++++++++-------- .../ui/VideoPlayerLoadingPlaceholder.kt | 1 + .../net/newpipe/newplayer/ui/VideoPlayerUI.kt | 1 + .../net/newpipe/newplayer/ui/theme/Color.kt | 45 ++++- .../newpipe/newplayer/testapp/MainActivity.kt | 2 +- 6 files changed, 159 insertions(+), 87 deletions(-) diff --git a/new-player/src/main/java/net/newpipe/newplayer/model/VideoPlayerViewModel.kt b/new-player/src/main/java/net/newpipe/newplayer/model/VideoPlayerViewModel.kt index f10637b..6324449 100644 --- 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() { diff --git a/new-player/src/main/java/net/newpipe/newplayer/ui/VideoPlayerControllerUI.kt b/new-player/src/main/java/net/newpipe/newplayer/ui/VideoPlayerControllerUI.kt index d9d15bb..5f4d206 100644 --- 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 = {}, diff --git a/new-player/src/main/java/net/newpipe/newplayer/ui/VideoPlayerLoadingPlaceholder.kt b/new-player/src/main/java/net/newpipe/newplayer/ui/VideoPlayerLoadingPlaceholder.kt index 1af153b..31351fa 100644 --- 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))) } } diff --git a/new-player/src/main/java/net/newpipe/newplayer/ui/VideoPlayerUI.kt b/new-player/src/main/java/net/newpipe/newplayer/ui/VideoPlayerUI.kt index f33ba3f..798eb38 100644 --- 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, diff --git 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 index b2c22dd..86a21cf 100644 --- 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 = {}) + } + } +} + diff --git a/test-app/src/main/java/net/newpipe/newplayer/testapp/MainActivity.kt b/test-app/src/main/java/net/newpipe/newplayer/testapp/MainActivity.kt index 032bef5..33b5c61 100644 --- 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