diff --git a/composeApp/src/commonMain/kotlin/mg/dot/feufaro/solfa/TimeUnitObject.kt b/composeApp/src/commonMain/kotlin/mg/dot/feufaro/solfa/TimeUnitObject.kt index caf0371..8c9865b 100644 --- a/composeApp/src/commonMain/kotlin/mg/dot/feufaro/solfa/TimeUnitObject.kt +++ b/composeApp/src/commonMain/kotlin/mg/dot/feufaro/solfa/TimeUnitObject.kt @@ -28,6 +28,7 @@ import androidx.compose.ui.focus.focusRequester import androidx.compose.ui.geometry.Offset import androidx.compose.ui.geometry.Size import androidx.compose.ui.graphics.Color +import androidx.compose.ui.graphics.RectangleShape import androidx.compose.ui.graphics.SolidColor import androidx.compose.ui.graphics.drawscope.Stroke import androidx.compose.ui.input.pointer.pointerInput @@ -476,13 +477,17 @@ fun TimeUnitComposable( } } +data class TUOWidthMeasure(val width: Dp, val isReady: Boolean) + @Composable -fun bestTUOWidth(items: List): Dp { +fun bestTUOWidth(items: List): TUOWidthMeasure { val textMeasurer = rememberTextMeasurer() val density = LocalDensity.current - var maxWidth by remember { mutableStateOf(0.dp) } + var maxWidth by remember(items) { mutableStateOf(0.dp) } + var isReady by remember(items) { mutableStateOf(false) } LaunchedEffect(items) { + isReady = false maxWidth = 0.dp items.forEach { val textLayoutResult: TextLayoutResult = textMeasurer.measure( @@ -496,8 +501,9 @@ fun bestTUOWidth(items: List): Dp { maxWidth = textWidth } } + isReady = true } - return maxWidth + 13.dp + return TUOWidthMeasure(maxWidth + 13.dp, isReady) } @Composable fun AutoResizingText( @@ -609,9 +615,13 @@ fun LazyVerticalGridTUO( val horizontalArrangementSpacing: Dp = 0.dp val columnGroupString = regexMeasure?.groupValues?.get(1) ?: "1" val columnGroup = columnGroupString.toInt().coerceAtLeast(1) - val itemMinBaseWidth = bestTUOWidth(tuoList) + val tuoWidthMeasure = bestTUOWidth(tuoList) + val itemMinBaseWidth = tuoWidthMeasure.width val gridWidthDp = with(density) { gridWidthPx.toDp() } + // on affiche un loader pour éviter le "saut" visuel + val isLayoutReady = tuoWidthMeasure.isReady && gridWidthDp > 0.dp + val gridCount by sharedScreenModel.gridCount.collectAsState() var gridColumnCount: Int = remember(gridWidthDp, itemMinBaseWidth, columnGroup) { @@ -680,6 +690,26 @@ fun LazyVerticalGridTUO( val totalSyllables = sharedScreenModel.synchronizedSyllables.value.size //println("Sync complète effectuée SUR stz: ${sharedScreenModel.stanza.value}! Total colonnes : $totalSyllables") } + if (!isLayoutReady) { + Box( + modifier = Modifier + .fillMaxWidth() + .height(200.dp), + contentAlignment = Alignment.Center + ) { + CircularProgressIndicator( + modifier = Modifier.size(64.dp), + strokeWidth = 3.dp + ) + Text( + text = "𝄞 ♫", + style = TextStyle( + fontSize = 28.sp, + color = MaterialTheme.colorScheme.primary + ) + ) + } + } else { Column( modifier = Modifier.fillMaxWidth() ){ @@ -1084,6 +1114,7 @@ fun LazyVerticalGridTUO( } } } +} @Composable fun makeSpaceBetweenSyllables(