make background visiable when dragging playlist item

This commit is contained in:
Christian Schabesberger 2024-09-03 14:13:56 +02:00
parent 9a71e8f0b5
commit 9c9d628f0c
2 changed files with 108 additions and 75 deletions

View File

@ -145,15 +145,16 @@ fun ReorderableStreamItemsList(
key = playlistItem.uniqueId
) { isDragging ->
StreamItem(
id = index,
uniqueId = playlistItem.uniqueId,
title = playlistItem.title,
creator = playlistItem.creator,
thumbnail = playlistItem.thumbnail,
lengthInMs = playlistItem.lengthInS.toLong() * 1000,
onClicked = { viewModel.streamSelected(it) },
onClicked = { viewModel.streamSelected(0) },
reorderableScope = this@ReorderableItem,
haptic = haptic,
onDragFinished = viewModel::onStreamItemDragFinished
onDragFinished = viewModel::onStreamItemDragFinished,
isDragging = isDragging
)
}
}

View File

@ -20,8 +20,13 @@
package net.newpipe.newplayer.ui.videoplayer.streamselect
import androidx.compose.animation.AnimatedVisibility
import androidx.compose.animation.core.tween
import androidx.compose.animation.fadeIn
import androidx.compose.animation.fadeOut
import androidx.compose.foundation.Image
import androidx.compose.foundation.background
import androidx.compose.foundation.clickable
import androidx.compose.foundation.interaction.MutableInteractionSource
import androidx.compose.foundation.layout.Box
import androidx.compose.foundation.layout.Column
@ -37,6 +42,7 @@ import androidx.compose.material.icons.Icons
import androidx.compose.material.icons.filled.DragHandle
import androidx.compose.material3.Icon
import androidx.compose.material3.IconButton
import androidx.compose.material3.MaterialTheme
import androidx.compose.material3.Surface
import androidx.compose.material3.Text
import androidx.compose.runtime.Composable
@ -55,6 +61,8 @@ import coil.compose.AsyncImage
import net.newpipe.newplayer.R
import net.newpipe.newplayer.ui.CONTROLLER_UI_BACKGROUND_COLOR
import net.newpipe.newplayer.ui.theme.VideoPlayerTheme
import net.newpipe.newplayer.ui.videoplayer.gesture_ui.SEEK_ANIMATION_FADE_IN
import net.newpipe.newplayer.ui.videoplayer.gesture_ui.SEEK_ANIMATION_FADE_OUT
import net.newpipe.newplayer.utils.BitmapThumbnail
import net.newpipe.newplayer.utils.OnlineThumbnail
import net.newpipe.newplayer.utils.ReorderHapticFeedback
@ -98,24 +106,39 @@ private fun Thumbnail(thumbnail: Thumbnail?, contentDescription: String) {
@Composable
fun StreamItem(
modifier: Modifier = Modifier,
id: Int,
uniqueId: Long,
title: String,
creator: String?,
thumbnail: Thumbnail?,
lengthInMs: Long,
onClicked: (Int) -> Unit,
onClicked: (Long) -> Unit,
onDragFinished: () -> Unit,
reorderableScope: ReorderableCollectionItemScope?,
haptic: ReorderHapticFeedback?
haptic: ReorderHapticFeedback?,
isDragging: Boolean
) {
val locale = getLocale()!!
val interactionSource = remember { MutableInteractionSource() }
Box(modifier = modifier.height(60.dp).clickable {
onClicked(uniqueId)
}) {
AnimatedVisibility(
visible = isDragging,
enter = fadeIn(animationSpec = tween(200)),
exit = fadeOut(animationSpec = tween(400))
) {
Surface(
modifier = Modifier.fillMaxSize(),
color = MaterialTheme.colorScheme.background,
shadowElevation = 8.dp
) {}
}
Row(
modifier = modifier
.padding(5.dp)
.height(60.dp)
) {
Box(
modifier = Modifier
@ -138,7 +161,11 @@ fun StreamItem(
top = 0.5.dp,
bottom = 0.5.dp
),
text = getTimeStringFromMs(lengthInMs, locale, leadingZerosForMinutes = false),
text = getTimeStringFromMs(
lengthInMs,
locale,
leadingZerosForMinutes = false
),
fontSize = 14.sp,
)
}
@ -157,7 +184,10 @@ fun StreamItem(
)
if (creator != null) {
Text(
text = creator, fontSize = 13.sp, fontWeight = FontWeight.Light, maxLines = 1,
text = creator,
fontSize = 13.sp,
fontWeight = FontWeight.Light,
maxLines = 1,
overflow = TextOverflow.Ellipsis
)
}
@ -192,6 +222,7 @@ fun StreamItem(
)
}
}
}
}
@ -202,7 +233,7 @@ fun StreamItemPreview() {
Surface(modifier = Modifier.fillMaxSize(), color = Color.DarkGray) {
Box(modifier = Modifier.fillMaxSize()) {
StreamItem(
id = 0,
uniqueId = 0,
title = "Video Title",
creator = "Video Creator",
thumbnail = null,
@ -210,7 +241,8 @@ fun StreamItemPreview() {
onClicked = {},
reorderableScope = null,
haptic = null,
onDragFinished = {}
onDragFinished = {},
isDragging = false,
)
}
}