new: add click-to-seek functionality

This commit is contained in:
2026-07-02 17:46:39 +02:00
parent caf51b1fc0
commit 3a6aa7c0bb
2 changed files with 15 additions and 5 deletions
@@ -128,7 +128,8 @@ fun PlayerScreen(
modifier = Modifier modifier = Modifier
.padding(innerPadding) .padding(innerPadding)
.fillMaxSize() .fillMaxSize()
.padding(16.dp), .padding(vertical = 16.dp)
.padding(horizontal = 8.dp),
horizontalAlignment = Alignment.CenterHorizontally, horizontalAlignment = Alignment.CenterHorizontally,
) { ) {
SubtitleList( SubtitleList(
@@ -142,6 +143,7 @@ fun PlayerScreen(
) )
PlayerControl( PlayerControl(
modifier = Modifier.padding(horizontal = 8.dp),
playbackState = uiState.playerState.playbackState, playbackState = uiState.playerState.playbackState,
playbackTiming = uiState.playerState.playbackTiming, playbackTiming = uiState.playerState.playbackTiming,
onSeek = onSeekToTimePart, onSeek = onSeekToTimePart,
@@ -1,5 +1,6 @@
package fr.ajaury.gwenedeg.player.ui package fr.ajaury.gwenedeg.player.ui
import androidx.compose.foundation.clickable
import androidx.compose.foundation.gestures.animateScrollBy import androidx.compose.foundation.gestures.animateScrollBy
import androidx.compose.foundation.interaction.collectIsDraggedAsState import androidx.compose.foundation.interaction.collectIsDraggedAsState
import androidx.compose.foundation.layout.Arrangement import androidx.compose.foundation.layout.Arrangement
@@ -8,10 +9,12 @@ import androidx.compose.foundation.layout.Column
import androidx.compose.foundation.layout.PaddingValues import androidx.compose.foundation.layout.PaddingValues
import androidx.compose.foundation.layout.fillMaxSize import androidx.compose.foundation.layout.fillMaxSize
import androidx.compose.foundation.layout.fillMaxWidth import androidx.compose.foundation.layout.fillMaxWidth
import androidx.compose.foundation.layout.padding
import androidx.compose.foundation.lazy.LazyColumn import androidx.compose.foundation.lazy.LazyColumn
import androidx.compose.foundation.lazy.LazyListState import androidx.compose.foundation.lazy.LazyListState
import androidx.compose.foundation.lazy.itemsIndexed import androidx.compose.foundation.lazy.itemsIndexed
import androidx.compose.foundation.lazy.rememberLazyListState import androidx.compose.foundation.lazy.rememberLazyListState
import androidx.compose.foundation.shape.RoundedCornerShape
import androidx.compose.material3.MaterialTheme import androidx.compose.material3.MaterialTheme
import androidx.compose.material3.Text import androidx.compose.material3.Text
import androidx.compose.runtime.Composable import androidx.compose.runtime.Composable
@@ -23,6 +26,7 @@ import androidx.compose.runtime.remember
import androidx.compose.runtime.setValue import androidx.compose.runtime.setValue
import androidx.compose.ui.Alignment import androidx.compose.ui.Alignment
import androidx.compose.ui.Modifier import androidx.compose.ui.Modifier
import androidx.compose.ui.draw.clip
import androidx.compose.ui.graphics.Color import androidx.compose.ui.graphics.Color
import androidx.compose.ui.text.font.FontStyle import androidx.compose.ui.text.font.FontStyle
import androidx.compose.ui.text.style.TextAlign import androidx.compose.ui.text.style.TextAlign
@@ -92,7 +96,7 @@ fun SubtitleList(
state = listState, state = listState,
modifier = Modifier.fillMaxSize(), modifier = Modifier.fillMaxSize(),
horizontalAlignment = Alignment.CenterHorizontally, horizontalAlignment = Alignment.CenterHorizontally,
verticalArrangement = Arrangement.spacedBy(8.dp), verticalArrangement = Arrangement.spacedBy(4.dp),
// Half-height padding so the first and last lines can reach the vertical center. // Half-height padding so the first and last lines can reach the vertical center.
contentPadding = PaddingValues(vertical = maxHeight / 2), contentPadding = PaddingValues(vertical = maxHeight / 2),
) { ) {
@@ -102,6 +106,7 @@ fun SubtitleList(
line = line, line = line,
isCurrent = isCurrent, isCurrent = isCurrent,
subtitlePreferences = subtitlePreferences, subtitlePreferences = subtitlePreferences,
onClick = { onSeek(index) },
) )
} }
} }
@@ -140,12 +145,17 @@ private fun Subtitle(
line: SubtitleLine, line: SubtitleLine,
isCurrent: Boolean, isCurrent: Boolean,
subtitlePreferences: SubtitlePreferences = SubtitlePreferences(), subtitlePreferences: SubtitlePreferences = SubtitlePreferences(),
onClick: () -> Unit = {},
) { ) {
val textAlpha = if (isCurrent) 1f else 0.35f val textAlpha = if (isCurrent) 1f else 0.35f
val contentColor = MaterialTheme.colorScheme.onSurface.copy(alpha = textAlpha) val contentColor = MaterialTheme.colorScheme.onSurface.copy(alpha = textAlpha)
Column( Column(
modifier = Modifier.fillMaxWidth(), modifier = Modifier
.clip(RoundedCornerShape(8.dp))
.clickable(onClick = onClick)
.padding(horizontal = 8.dp)
.padding(vertical = 4.dp),
horizontalAlignment = Alignment.CenterHorizontally, horizontalAlignment = Alignment.CenterHorizontally,
verticalArrangement = Arrangement.spacedBy(2.dp), verticalArrangement = Arrangement.spacedBy(2.dp),
) { ) {
@@ -176,7 +186,6 @@ private fun TranscriptionLine(
style = MaterialTheme.typography.bodyLarge.copy(fontSize = 20.sp), style = MaterialTheme.typography.bodyLarge.copy(fontSize = 20.sp),
color = contentColor, color = contentColor,
textAlign = TextAlign.Center, textAlign = TextAlign.Center,
modifier = Modifier.fillMaxWidth(),
) )
} }
@@ -190,7 +199,6 @@ private fun TranslationLine(
style = MaterialTheme.typography.bodySmall.copy(fontStyle = FontStyle.Italic), style = MaterialTheme.typography.bodySmall.copy(fontStyle = FontStyle.Italic),
color = contentColor, color = contentColor,
textAlign = TextAlign.Center, textAlign = TextAlign.Center,
modifier = Modifier.fillMaxWidth(),
) )
} }