Creepso/NuvioStreaming
1
0
Fork 0
mirror of https://github.com/tapframe/NuvioStreaming.git synced 2026-05-17 15:32:01 +00:00
Code Issues Projects Releases Packages Wiki Activity Actions

feat: improved slider behavior, precision, and UI consistency

Browse source
This commit is contained in:
Alex Schwemler 2026-05-06 20:49:23 +02:00
parent 8e201a6986
commit 064a7ccb70
1 changed files with 30 additions and 33 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

63
composeApp/src/commonMain/kotlin/com/nuvio/app/features/settings/PlaybackSettingsPage.kt
View file

@ -13,6 +13,7 @@ import androidx.compose.foundation.layout.height
import androidx.compose.foundation.layout.heightIn import androidx.compose.foundation.layout.heightIn
import androidx.compose.foundation.layout.padding import androidx.compose.foundation.layout.padding
import androidx.compose.foundation.layout.size import androidx.compose.foundation.layout.size
import androidx.compose.foundation.layout.wrapContentWidth
import androidx.compose.foundation.lazy.LazyColumn import androidx.compose.foundation.lazy.LazyColumn
import androidx.compose.foundation.lazy.LazyListScope import androidx.compose.foundation.lazy.LazyListScope
import androidx.compose.foundation.lazy.LazyRow import androidx.compose.foundation.lazy.LazyRow
@ -46,6 +47,7 @@ import androidx.compose.ui.hapticfeedback.HapticFeedbackType
import androidx.compose.ui.platform.LocalHapticFeedback import androidx.compose.ui.platform.LocalHapticFeedback
import androidx.compose.ui.text.font.FontWeight import androidx.compose.ui.text.font.FontWeight
import androidx.compose.ui.text.input.KeyboardType import androidx.compose.ui.text.input.KeyboardType
import androidx.compose.ui.text.style.TextOverflow
import androidx.compose.ui.unit.dp import androidx.compose.ui.unit.dp
import androidx.lifecycle.compose.collectAsStateWithLifecycle import androidx.lifecycle.compose.collectAsStateWithLifecycle
import com.nuvio.app.features.addons.AddonRepository import com.nuvio.app.features.addons.AddonRepository
@ -327,10 +329,9 @@ private fun PlaybackSettingsSection(
) { ) {
Row( Row(
modifier = Modifier.fillMaxWidth(), modifier = Modifier.fillMaxWidth(),
horizontalArrangement = Arrangement.SpaceBetween,
verticalAlignment = Alignment.CenterVertically, verticalAlignment = Alignment.CenterVertically,
) { ) {
Column(modifier = Modifier.weight(1f)) { Column(modifier = Modifier.weight(1f).padding(end = 12.dp)) {
Text( Text(
text = stringResource(Res.string.settings_playback_stream_timeout), text = stringResource(Res.string.settings_playback_stream_timeout),
style = MaterialTheme.typography.bodyLarge, style = MaterialTheme.typography.bodyLarge,
@ -338,21 +339,22 @@ private fun PlaybackSettingsSection(
) )
Text( Text(
text = stringResource(Res.string.settings_playback_stream_timeout_description), text = stringResource(Res.string.settings_playback_stream_timeout_description),
style = MaterialTheme.typography.bodySmall, style = MaterialTheme.typography.bodyMedium,
color = MaterialTheme.colorScheme.onSurfaceVariant, color = MaterialTheme.colorScheme.onSurfaceVariant,
) )
} }
ValueBox(text = timeoutLabel, modifier = Modifier.wrapContentWidth()) ValueBox(text = timeoutLabel, modifier = Modifier.wrapContentWidth())
} }
var sliderValue by remember(timeoutSec) { mutableFloatStateOf(timeoutSec.toFloat()) } var sliderValue by remember(timeoutSec) { mutableFloatStateOf(timeoutSec.toFloat()) }
var lastHapticStep by remember(timeoutSec) { mutableStateOf(timeoutSec) } var lastHapticStep by remember(timeoutSec) { mutableStateOf(timeoutSec.toFloat()) }
Slider( Slider(
value = sliderValue, value = sliderValue,
onValueChange = { onValueChange = {
sliderValue = it val snapped = snapToStep(it, 1f)
val steppedValue = it.toInt() sliderValue = snapped
if (steppedValue != lastHapticStep) {
lastHapticStep = steppedValue if (snapped != lastHapticStep) {
lastHapticStep = snapped
hapticFeedback.performHapticFeedback(HapticFeedbackType.TextHandleMove) hapticFeedback.performHapticFeedback(HapticFeedbackType.TextHandleMove)
} }
}, },
@ -360,7 +362,7 @@ private fun PlaybackSettingsSection(
PlayerSettingsRepository.setStreamAutoPlayTimeoutSeconds(sliderValue.toInt()) PlayerSettingsRepository.setStreamAutoPlayTimeoutSeconds(sliderValue.toInt())
}, },
valueRange = 0f..11f, valueRange = 0f..11f,
steps = 10, steps = calculateSteps(0f, 11f, 1f),
colors = SliderDefaults.colors( colors = SliderDefaults.colors(
thumbColor = MaterialTheme.colorScheme.primary, thumbColor = MaterialTheme.colorScheme.primary,
activeTrackColor = MaterialTheme.colorScheme.primary, activeTrackColor = MaterialTheme.colorScheme.primary,
@ -593,10 +595,9 @@ private fun PlaybackSettingsSection(
) { ) {
Row( Row(
modifier = Modifier.fillMaxWidth(), modifier = Modifier.fillMaxWidth(),
horizontalArrangement = Arrangement.SpaceBetween,
verticalAlignment = Alignment.CenterVertically, verticalAlignment = Alignment.CenterVertically,
) { ) {
Column(modifier = Modifier.weight(1f)) { Column(modifier = Modifier.weight(1f).padding(end = 12.dp)) {
Text( Text(
text = stringResource(Res.string.settings_playback_threshold_percentage), text = stringResource(Res.string.settings_playback_threshold_percentage),
style = MaterialTheme.typography.bodyLarge, style = MaterialTheme.typography.bodyLarge,
@ -604,7 +605,7 @@ private fun PlaybackSettingsSection(
) )
Text( Text(
text = stringResource(Res.string.settings_playback_threshold_percentage_description), text = stringResource(Res.string.settings_playback_threshold_percentage_description),
style = MaterialTheme.typography.bodySmall, style = MaterialTheme.typography.bodyMedium,
color = MaterialTheme.colorScheme.onSurfaceVariant, color = MaterialTheme.colorScheme.onSurfaceVariant,
) )
} }
@ -612,15 +613,16 @@ private fun PlaybackSettingsSection(
Res.string.settings_playback_threshold_percentage_value, Res.string.settings_playback_threshold_percentage_value,
formatStep(thresholdPercent)), modifier = Modifier.wrapContentWidth()) formatStep(thresholdPercent)), modifier = Modifier.wrapContentWidth())
} }
var sliderVal by remember(thresholdPercent) { mutableFloatStateOf(thresholdPercent) } var sliderValue by remember(thresholdPercent) { mutableFloatStateOf(thresholdPercent) }
var lastHapticPercent by remember(thresholdPercent) { mutableStateOf(thresholdPercent.toInt()) } var lastHapticPercent by remember(thresholdPercent) { mutableStateOf(thresholdPercent) }
Slider( Slider(
value = sliderVal, value = sliderVal,
onValueChange = { onValueChange = {
sliderVal = it val snapped = snapToStep(it, 0.5f)
val stepped = it.toInt() sliderValue = snapped
if (stepped != lastHapticPercent) {
lastHapticPercent = stepped if (snapped != lastHapticPercent) {
lastHapticPercent = snapped
hapticFeedback.performHapticFeedback(HapticFeedbackType.TextHandleMove) hapticFeedback.performHapticFeedback(HapticFeedbackType.TextHandleMove)
} }
}, },
@ -646,10 +648,9 @@ private fun PlaybackSettingsSection(
) { ) {
Row( Row(
modifier = Modifier.fillMaxWidth(), modifier = Modifier.fillMaxWidth(),
horizontalArrangement = Arrangement.SpaceBetween,
verticalAlignment = Alignment.CenterVertically, verticalAlignment = Alignment.CenterVertically,
) { ) {
Column(modifier = Modifier.weight(1f)) { Column(modifier = Modifier.weight(1f).padding(end = 12.dp)) {
Text( Text(
text = stringResource(Res.string.settings_playback_minutes_before_end), text = stringResource(Res.string.settings_playback_minutes_before_end),
style = MaterialTheme.typography.bodyLarge, style = MaterialTheme.typography.bodyLarge,
@ -657,28 +658,24 @@ private fun PlaybackSettingsSection(
) )
Text( Text(
text = stringResource(Res.string.settings_playback_minutes_before_end_description), text = stringResource(Res.string.settings_playback_minutes_before_end_description),
style = MaterialTheme.typography.bodySmall, style = MaterialTheme.typography.bodyMedium,
color = MaterialTheme.colorScheme.onSurfaceVariant, color = MaterialTheme.colorScheme.onSurfaceVariant,
) )
} }
ValueBox(text = stringResource( ValueBox(text = stringResource(
Res.string.settings_playback_minutes_value, Res.string.settings_playback_minutes_value,
thresholdMinutes.toInt(), formatStep(thresholdMinutes)), modifier = Modifier.wrapContentWidth())
),
style = MaterialTheme.typography.bodyMedium,
color = MaterialTheme.colorScheme.primary,
fontWeight = FontWeight.SemiBold,
)
} }
var sliderVal by remember(thresholdMinutes) { mutableFloatStateOf(thresholdMinutes) } var sliderValue by remember(thresholdMinutes) { mutableFloatStateOf(thresholdMinutes) }
var lastHapticMin by remember(thresholdMinutes) { mutableStateOf(thresholdMinutes.toInt()) } var lastHapticMin by remember(thresholdMinutes) { mutableStateOf(thresholdMinutes) }
Slider( Slider(
value = sliderVal, value = sliderVal,
onValueChange = { onValueChange = {
sliderVal = it val snapped = snapToStep(it, 0.5f)
val stepped = it.toInt() sliderValue = snapped
if (stepped != lastHapticMin) {
lastHapticMin = stepped if (snapped != lastHapticMin) {
lastHapticMin = snapped
hapticFeedback.performHapticFeedback(HapticFeedbackType.TextHandleMove) hapticFeedback.performHapticFeedback(HapticFeedbackType.TextHandleMove)
} }
}, },