feat(flip):cải thiện giao diện học

pass-with-high-score · Dec 1, 2024 · 88c63aa · 88c63aa
1 parent cbaf681
commit 88c63aa
Show file tree

Hide file tree

Showing 5 changed files with 25 additions and 15 deletions.
diff --git a/.../pwhs/quickmem/presentation/app/folder/add_study_set/component/AddStudySetToFolderItem.kt b/.../pwhs/quickmem/presentation/app/folder/add_study_set/component/AddStudySetToFolderItem.kt
@@ -16,7 +16,6 @@ import androidx.compose.foundation.shape.CircleShape
 import androidx.compose.material3.Card
 import androidx.compose.material3.CardDefaults
 import androidx.compose.material3.Icon
-import androidx.compose.material3.MaterialTheme
 import androidx.compose.material3.MaterialTheme.colorScheme
 import androidx.compose.material3.MaterialTheme.typography
 import androidx.compose.material3.Scaffold
@@ -77,10 +76,11 @@ fun AddStudySetToFolderItem(
                 modifier = Modifier
                     .padding(8.dp)
                     .background(Color.Transparent)
+                    .weight(1f)
             ) {
                 Text(
                     studySet.title,
-                    style = MaterialTheme.typography.titleMedium.copy(
+                    style = typography.titleMedium.copy(
                         fontWeight = FontWeight.Bold
                     ),
                     maxLines = 2,
@@ -93,14 +93,14 @@ fun AddStudySetToFolderItem(
                 Text(
                     buildAnnotatedString {
                         withStyle(
-                            style = MaterialTheme.typography.bodySmall.toSpanStyle()
+                            style = typography.bodySmall.toSpanStyle()
                                 .copy(
                                     fontWeight = FontWeight.Bold
                                 )
                         ) {
                             append("${studySet.flashcardCount}")
                             withStyle(
-                                style = MaterialTheme.typography.bodySmall.toSpanStyle()
+                                style = typography.bodySmall.toSpanStyle()
                                     .copy(
                                         fontWeight = FontWeight.Normal
                                     )
@@ -115,7 +115,7 @@ fun AddStudySetToFolderItem(
                     horizontalArrangement = Arrangement.spacedBy(8.dp),
                 ) {
                     Text(
-                        text = studySet?.subject?.name ?: SubjectModel.defaultSubjects[0].name,
+                        text = studySet.subject?.name ?: SubjectModel.defaultSubjects[0].name,
                         style = typography.bodySmall.copy(
                             color = colorScheme.onSurface.copy(alpha = 0.6f)
                         )
@@ -154,7 +154,7 @@ fun AddStudySetToFolderItem(
                     )
                     Text(
                         studySet.owner.username,
-                        style = MaterialTheme.typography.bodySmall
+                        style = typography.bodySmall
                     )
                 }
             }

diff --git a/...ain/java/com/pwhs/quickmem/presentation/app/study_set/studies/flip/FlipFlashCardScreen.kt b/...ain/java/com/pwhs/quickmem/presentation/app/study_set/studies/flip/FlipFlashCardScreen.kt
@@ -241,7 +241,6 @@ fun FlipFlashCard(
                                     CardStack(
                                         modifier = Modifier
                                             .fillMaxSize()
-                                            .padding(16.dp)
                                             .zIndex(2f),
                                         stackState = stackState,
                                         cardElevation = 10.dp,
@@ -302,7 +301,8 @@ fun FlipFlashCard(
                                         }
                                         StudyFlipFlashCard(
                                             flashCard = flashcard,
-                                            modifier = Modifier.fillMaxSize(),
+                                            modifier = Modifier
+                                                .fillMaxSize(),
                                             isSwipingLeft = isSwipingLeft,
                                             isSwipingRight = isSwipingRight,
                                             stillLearningColor = stillLearningColor,
@@ -324,7 +324,9 @@ fun FlipFlashCard(
 
                         true -> {
                             FlipFlashCardFinish(
-                                modifier = Modifier.fillMaxSize(),
+                                modifier = Modifier
+                                    .fillMaxSize()
+                                    .padding(horizontal = 16.dp),
                                 isEndOfList = true,
                                 countStillLearning = countStillLearning,
                                 countKnown = countKnown,

diff --git a/...java/com/pwhs/quickmem/presentation/app/study_set/studies/flip/component/StudyFlipCard.kt b/...java/com/pwhs/quickmem/presentation/app/study_set/studies/flip/component/StudyFlipCard.kt
@@ -5,6 +5,7 @@ import androidx.compose.animation.core.FastOutSlowInEasing
 import androidx.compose.animation.core.animateFloatAsState
 import androidx.compose.animation.core.tween
 import androidx.compose.foundation.BorderStroke
+import androidx.compose.foundation.background
 import androidx.compose.foundation.layout.Arrangement
 import androidx.compose.foundation.layout.Box
 import androidx.compose.foundation.layout.BoxWithConstraints
@@ -120,7 +121,6 @@ fun StudyFlipFlashCard(
                                     scaleY = effectScale,
                                     alpha = effectAlpha
                                 )
-                                .padding(vertical = 16.dp)
                         ) {
                             when {
                                 isShowingEffect -> when {
@@ -181,6 +181,7 @@ fun StudyFlipFlashCard(
                             verticalArrangement = Arrangement.Center,
                             modifier = Modifier
                                 .fillMaxSize()
+                                .padding(16.dp)
                                 .animateContentSize()
                                 .align(Alignment.Center)
                                 .graphicsLayer(
@@ -189,7 +190,6 @@ fun StudyFlipFlashCard(
                                     scaleY = effectScale,
                                     alpha = effectAlpha
                                 )
-                                .padding(vertical = 16.dp)
                         ) {
                             when {
                                 isShowingEffect -> when {
@@ -278,14 +278,14 @@ fun StudyFlipFlashCard(
                             verticalArrangement = Arrangement.Center,
                             modifier = Modifier
                                 .fillMaxSize()
+                                .padding(16.dp)
                                 .animateContentSize()
                                 .align(Alignment.Center)
                                 .graphicsLayer(
                                     scaleX = effectScale,
                                     scaleY = effectScale,
                                     alpha = effectAlpha
                                 )
-                                .padding(vertical = 16.dp)
                         ) {
                             when {
                                 isShowingEffect -> when {
@@ -346,6 +346,7 @@ fun StudyFlipFlashCard(
                             verticalArrangement = Arrangement.Center,
                             modifier = Modifier
                                 .fillMaxSize()
+                                .padding(16.dp)
                                 .animateContentSize()
                                 .align(Alignment.Center)
                                 .graphicsLayer(
@@ -354,7 +355,6 @@ fun StudyFlipFlashCard(
                                     scaleY = effectScale,
                                     alpha = effectAlpha
                                 )
-                                .padding(vertical = 16.dp)
                         ) {
                             when {
                                 isShowingEffect -> when {

diff --git a/compose-cardstack/src/main/java/com/msusman/compose/cardstack/CardContainer.kt b/compose-cardstack/src/main/java/com/msusman/compose/cardstack/CardContainer.kt
@@ -12,7 +12,11 @@ import com.msusman.compose.cardstack.internal.visible
  * Created by Muhammad Usman : [email protected] on 7/19/2023.
  */
 @Composable
-fun CardContainer(stackState: StackState, index: Int, content: @Composable () -> Unit) {
+fun CardContainer(
+    stackState: StackState,
+    index: Int,
+    content: @Composable () -> Unit
+) {
     val cardState: CardSate = stackState.cardQueue[index]
     Box(
         modifier = Modifier

diff --git a/compose-cardstack/src/main/java/com/msusman/compose/cardstack/CardStack.kt b/compose-cardstack/src/main/java/com/msusman/compose/cardstack/CardStack.kt
@@ -123,7 +123,11 @@ fun <T> CardStack(
     ) {
         items.forEachIndexed { index, item ->
             CardContainer(stackState = stackState, index = index) {
-                content(item)
+                Box(
+                    modifier = Modifier.padding(16.dp)
+                ) {
+                    content(item)
+                }
             }
         }
     }