Update ui: arrange Floatting Action Button horizontally

This commit is contained in:
Hasinjato 2026-09-28 14:11:21 +03:00
parent 1a4854743d
commit cc71d4c340

View file

@ -706,16 +706,16 @@ fun MainScreenWithDrawer(
modifier = Modifier.fillMaxWidth() modifier = Modifier.fillMaxWidth()
) { ) {
if (!solfaKeyboardState.isVisible) { if (!solfaKeyboardState.isVisible) {
Column( Row(
modifier = Modifier.fillMaxWidth().padding(5.dp), modifier = Modifier.fillMaxWidth().padding(5.dp),
horizontalAlignment = Alignment.End, horizontalArrangement = Arrangement.spacedBy(7.dp, Alignment.End),
verticalArrangement = Arrangement.spacedBy(7.dp) verticalAlignment = Alignment.CenterVertically
) { ) {
if (isEditMode) { if (isEditMode) {
AnimatedVisibility( AnimatedVisibility(
visible = true, visible = true,
enter = fadeIn() + scaleIn() + slideInVertically { it / 2 }, enter = fadeIn() + scaleIn() + slideInHorizontally { it / 2 },
exit = fadeOut() + scaleOut() + slideOutVertically { it / 2 } exit = fadeOut() + scaleOut() + slideOutHorizontally { it / 2 }
) { ) {
MyFAB( MyFAB(
onClick = { onClick = {
@ -733,15 +733,14 @@ fun MainScreenWithDrawer(
AnimatedVisibility( AnimatedVisibility(
visible = true, visible = true,
enter = fadeIn() + scaleIn() + slideInVertically { it / 2 }, enter = fadeIn() + scaleIn() + slideInHorizontally { it / 2 },
exit = fadeOut() + scaleOut() + slideOutVertically { it / 2 } exit = fadeOut() + scaleOut() + slideOutHorizontally { it / 2 }
) { ) {
MyFAB( MyFAB(
onClick = { onClick = {
scope.launch { scope.launch {
try { try {
val initialDir = val initialDir = solfaScreenModel.fileRepository.getAppPublicFolder().absolutePath
solfaScreenModel.fileRepository.getAppPublicFolder().absolutePath
saveLauncher.launch(fileName, initialDir) saveLauncher.launch(fileName, initialDir)
} catch (e: Exception) { } catch (e: Exception) {
e.printStackTrace() e.printStackTrace()
@ -754,8 +753,8 @@ fun MainScreenWithDrawer(
AnimatedVisibility( AnimatedVisibility(
visible = true, visible = true,
enter = fadeIn() + scaleIn() + slideInVertically { it / 2 }, enter = fadeIn() + scaleIn() + slideInHorizontally { it / 2 },
exit = fadeOut() + scaleOut() + slideOutVertically { it / 2 } exit = fadeOut() + scaleOut() + slideOutHorizontally { it / 2 }
) { ) {
MyFAB( MyFAB(
onClick = { onClick = {
@ -765,45 +764,64 @@ fun MainScreenWithDrawer(
) )
} }
} else if (!isQrVisible) { } else if (!isQrVisible) {
if (!showMidiCtrl) {
AnimatedVisibility( AnimatedVisibility(
visible = isExpanded and !showMidiCtrl, visible = isExpanded,
enter = fadeIn() + scaleIn() + slideInVertically { it / 2 }, enter = fadeIn() + scaleIn() + slideInHorizontally { it / 2 },
exit = fadeOut() + scaleOut() + slideOutVertically { it / 2 } exit = fadeOut() + scaleOut() + slideOutHorizontally { it / 2 }
) {
Row(
verticalAlignment = Alignment.CenterVertically,
horizontalArrangement = Arrangement.spacedBy(4.dp)
) { ) {
Row {
Column {
MyFAB( MyFAB(
onClick = { onClick = { sharedScreenModel.descGridCount(1) },
sharedScreenModel.descGridCount(1)
},
size = 30.dp, size = 30.dp,
icon = Icons.Default.Remove icon = Icons.Default.Remove
) )
}
Column {
MyFAB( MyFAB(
onClick = { onClick = { sharedScreenModel.addGridCount(1) },
sharedScreenModel.addGridCount(1)
},
size = 30.dp, size = 30.dp,
icon = Icons.Default.Add icon = Icons.Default.Add
) )
} }
} }
AnimatedVisibility(
visible = isExpanded,
enter = fadeIn() + scaleIn() + slideInHorizontally { it / 2 },
exit = fadeOut() + scaleOut() + slideOutHorizontally { it / 2 }
) {
MyFAB(
onClick = {
sharedScreenModel.showSearchMenu(true)
scope.launch {
delay(100)
focusRequester.requestFocus()
} }
sharedScreenModel.setExpandedFAB(!isExpanded)
},
icon = if (isSearchActive) Icons.Default.Close else Icons.Default.Search
)
}
AnimatedVisibility( AnimatedVisibility(
visible = isExpanded and !showMidiCtrl, visible = isExpanded,
enter = fadeIn() + scaleIn() + slideInVertically { it / 2 }, enter = fadeIn() + scaleIn() + slideInHorizontally { it / 2 },
exit = fadeOut() + scaleOut() + slideOutVertically { it / 2 } exit = fadeOut() + scaleOut() + slideOutHorizontally { it / 2 }
) { ) {
Row( Box(
verticalAlignment = Alignment.CenterVertically, modifier = Modifier.size(55.dp),
horizontalArrangement = Arrangement.spacedBy(8.dp) contentAlignment = Alignment.BottomEnd
) { ) {
AnimatedVisibility( androidx.compose.animation.AnimatedVisibility(
visible = isShareExpanded, visible = isShareExpanded,
enter = fadeIn() + expandHorizontally(), enter = fadeIn() + slideInVertically { it / 2 } + scaleIn(),
exit = fadeOut() + shrinkHorizontally() exit = fadeOut() + slideOutVertically { it / 2 } + scaleOut(),
modifier = Modifier
.align(Alignment.BottomEnd)
.offset(y = (-65).dp)
.wrapContentWidth(unbounded = true)
) { ) {
Row( Row(
horizontalArrangement = Arrangement.spacedBy(8.dp), horizontalArrangement = Arrangement.spacedBy(8.dp),
@ -832,19 +850,27 @@ fun MainScreenWithDrawer(
scope.launch { scope.launch {
withContext(Dispatchers.IO) { withContext(Dispatchers.IO) {
try { try {
val cleanS = songTitle.replace(' ','_') val cleanS =
val exportName = "${cleanS.ifEmpty { "partition" }}.mid" songTitle.replace(' ', '_')
val exportName =
val savedPath = solfaScreenModel.fileRepository.pickSavePath( "${cleanS.ifEmpty { "partition" }}.mid"
val savedPath =
solfaScreenModel.fileRepository.pickSavePath(
defaultName = exportName, defaultName = exportName,
title = "Enregistrer le fichier MIDI" title = "Enregistrer le fichier MIDI"
) )
if (!savedPath.isNullOrEmpty()) { if (!savedPath.isNullOrEmpty()) {
val transpositionInterval = sharedScreenModel.transpositionInterval.value val transpositionInterval =
val bpm = sharedScreenModel.getBpmFlow().value ?: 120f sharedScreenModel.transpositionInterval.value
val bpm =
solfaScreenModel.generateMidiFile(bpm, savedPath, transpositionInterval) sharedScreenModel.getBpmFlow().value
?: 120f
solfaScreenModel.generateMidiFile(
bpm,
savedPath,
transpositionInterval
)
println("Fichier MIDI enregistré avec succès sous : $savedPath") println("Fichier MIDI enregistré avec succès sous : $savedPath")
} }
} catch (e: Exception) { } catch (e: Exception) {
@ -864,20 +890,20 @@ fun MainScreenWithDrawer(
) )
} }
} }
}
if (!showMidiCtrl && !isSearchActive) {
AnimatedVisibility( AnimatedVisibility(
visible = isExpanded, visible = isExpanded,
enter = fadeIn() + scaleIn() + slideInVertically { it / 2 }, enter = fadeIn() + scaleIn() + slideInHorizontally { it / 2 },
exit = fadeOut() + scaleOut() + slideOutVertically { it / 2 } exit = fadeOut() + scaleOut() + slideOutHorizontally { it / 2 }
) { ) {
MyFAB( MyFAB(
onClick = { onClick = {
sharedScreenModel.setMidiCtrl(!showMidiCtrl) sharedScreenModel.setMidiCtrl(!showMidiCtrl)
}, },
icon = if (showMidiCtrl) Icons.Filled.StopCircle else Icons.Filled.PlayCircle icon = Icons.Filled.PlayCircle
) )
} }
if (!showMidiCtrl && !isSearchActive) {
MyFAB( MyFAB(
onClick = { onClick = {
sharedScreenModel.setExpandedFAB(!isExpanded) sharedScreenModel.setExpandedFAB(!isExpanded)
@ -887,13 +913,20 @@ fun MainScreenWithDrawer(
icon = if (isExpanded) Icons.Filled.Close else Icons.Filled.Menu icon = if (isExpanded) Icons.Filled.Close else Icons.Filled.Menu
) )
} }
}
AnimatedVisibility( AnimatedVisibility(
visible = showMidiCtrl, visible = showMidiCtrl,
enter = fadeIn() + scaleIn() + slideInVertically { it / 2 }, enter = fadeIn() + scaleIn() + slideInHorizontally { it / 2 },
exit = fadeOut() + scaleOut() + slideOutVertically { it / 2 } exit = fadeOut() + scaleOut() + slideOutHorizontally { it / 2 }
) {
Row(
modifier = Modifier.fillMaxWidth(),
horizontalArrangement = Arrangement.Start,
verticalAlignment = Alignment.CenterVertically
) { ) {
Box( Box(
modifier = Modifier.fillMaxWidth(0.9f) modifier = Modifier.fillMaxWidth()
.padding(top = 15.dp)
) { ) {
if (player != null) { if (player != null) {
MidiControlPanel( MidiControlPanel(
@ -927,13 +960,26 @@ fun MainScreenWithDrawer(
} else { } else {
Text("Sélectionner un morceau") Text("Sélectionner un morceau")
} }
Box(
modifier = Modifier
.align(Alignment.TopEnd)
.offset(y = (-30).dp, x = (-10).dp)
) {
MyFAB(
onClick = {
sharedScreenModel.setMidiCtrl(false)
},
icon = Icons.Filled.StopCircle
)
} }
} }
} }
} }
} }
} }
}) { paddingValues -> }
}
) { paddingValues ->
Column( Column(
modifier = Modifier modifier = Modifier