重构探索主页、搜索结果和二级页面UI

dmzz-yyhyy · Dec 25, 2024 · 210eef6 · 210eef6
1 parent 28f54a1
commit 210eef6
Show file tree

Hide file tree

Showing 10 changed files with 190 additions and 178 deletions.
diff --git a/app/build.gradle.kts b/app/build.gradle.kts
@@ -21,7 +21,7 @@ android {
         minSdk = 24
         targetSdk = 34
         // 版本号为x.y.z则versionCode为x*1000000+y*10000+z*100+debug版本号(开发需要时迭代, 两位数)
-        versionCode = 1_00_00_011
+        versionCode = 1_00_00_012
         versionName = "1.0.0"
 
         testInstrumentationRunner = "androidx.test.runner.AndroidJUnitRunner"

diff --git a/...ain/kotlin/indi/dmzz_yyhyy/lightnovelreader/ui/home/bookshelf/home/BookshelfHomeScreen.kt b/...ain/kotlin/indi/dmzz_yyhyy/lightnovelreader/ui/home/bookshelf/home/BookshelfHomeScreen.kt
@@ -61,12 +61,10 @@ import androidx.compose.ui.draw.clip
 import androidx.compose.ui.draw.rotate
 import androidx.compose.ui.graphics.Color
 import androidx.compose.ui.graphics.painter.Painter
-import androidx.compose.ui.hapticfeedback.HapticFeedbackType
 import androidx.compose.ui.input.nestedscroll.nestedScroll
 import androidx.compose.ui.layout.onGloballyPositioned
 import androidx.compose.ui.platform.LocalContext
 import androidx.compose.ui.platform.LocalDensity
-import androidx.compose.ui.platform.LocalHapticFeedback
 import androidx.compose.ui.res.painterResource
 import androidx.compose.ui.res.stringResource
 import androidx.compose.ui.text.font.FontWeight
@@ -117,7 +115,6 @@ fun BookshelfHomeScreen(
 ) {
     val scope = rememberCoroutineScope()
     val context = LocalContext.current
-    val haptic = LocalHapticFeedback.current
     val workManager = WorkManager.getInstance(context)
     val enterAlwaysScrollBehavior = TopAppBarDefaults.enterAlwaysScrollBehavior()
     val animatedBackgroundColor by animateColorAsState(
@@ -276,7 +273,6 @@ fun BookshelfHomeScreen(
         val onLongPress: (Int) -> Unit = { bookId ->
             onClickEnableSelectMode.invoke()
             changeBookSelectState(bookId)
-            haptic.performHapticFeedback(HapticFeedbackType.LongPress)
         }
 
         LazyColumn(
@@ -302,7 +298,6 @@ fun BookshelfHomeScreen(
                     uiState.bookInformationMap[updatedBookId]?.let {
                         BookCardItem(
                             bookInformation = it,
-                            haptic = haptic,
                             selected = uiState.selectedBookIds.contains(it.id),
                             latestChapterTitle = uiState.bookLastChapterTitleMap[updatedBookId],
                             onClick = {
@@ -331,7 +326,6 @@ fun BookshelfHomeScreen(
                     uiState.bookInformationMap[pinnedBookId]?.let {
                         BookCardItem(
                             bookInformation = it,
-                            haptic = haptic,
                             selected = uiState.selectedBookIds.contains(it.id),
                             onClick = {
                                 if (!uiState.selectMode)
@@ -359,7 +353,6 @@ fun BookshelfHomeScreen(
                     uiState.bookInformationMap[bookId]?.let {
                         BookCardItem(
                             bookInformation = it,
-                            haptic = haptic,
                             selected = uiState.selectedBookIds.contains(it.id),
                             onClick = {
                                 if (!uiState.selectMode)

diff --git a/...n/kotlin/indi/dmzz_yyhyy/lightnovelreader/ui/home/bookshelf/home/BookshelfUIComponents.kt b/...n/kotlin/indi/dmzz_yyhyy/lightnovelreader/ui/home/bookshelf/home/BookshelfUIComponents.kt
@@ -35,19 +35,19 @@ import androidx.compose.material3.SwipeToDismissBoxValue.EndToStart
 import androidx.compose.material3.SwipeToDismissBoxValue.Settled
 import androidx.compose.material3.SwipeToDismissBoxValue.StartToEnd
 import androidx.compose.material3.Text
-import androidx.compose.material3.rememberSwipeToDismissBoxState
 import androidx.compose.runtime.Composable
 import androidx.compose.runtime.LaunchedEffect
 import androidx.compose.runtime.getValue
 import androidx.compose.runtime.saveable.rememberSaveable
 import androidx.compose.ui.Alignment
 import androidx.compose.ui.Modifier
 import androidx.compose.ui.draw.clip
+import androidx.compose.ui.draw.scale
 import androidx.compose.ui.graphics.Color
 import androidx.compose.ui.graphics.graphicsLayer
-import androidx.compose.ui.hapticfeedback.HapticFeedback
 import androidx.compose.ui.hapticfeedback.HapticFeedbackType
 import androidx.compose.ui.platform.LocalDensity
+import androidx.compose.ui.platform.LocalHapticFeedback
 import androidx.compose.ui.res.painterResource
 import androidx.compose.ui.res.stringResource
 import androidx.compose.ui.text.font.FontWeight
@@ -59,10 +59,12 @@ import indi.dmzz_yyhyy.lightnovelreader.R
 import indi.dmzz_yyhyy.lightnovelreader.data.book.BookInformation
 import indi.dmzz_yyhyy.lightnovelreader.ui.components.Cover
 import indi.dmzz_yyhyy.lightnovelreader.utils.SwipeAction
+import indi.dmzz_yyhyy.lightnovelreader.utils.withHaptic
 
 @Composable
 fun BookCardContent(
     selected: Boolean,
+    collected: Boolean,
     modifier: Modifier = Modifier,
     bookInformation: BookInformation,
     latestChapterTitle: String? = null
@@ -84,7 +86,7 @@ fun BookCardContent(
                     url = bookInformation.coverUrl,
                     rounded = 8.dp
                 )
-                if (latestChapterTitle != null) {
+                if (latestChapterTitle != null) { // 有可用更新 Badge
                     Box(
                         modifier = Modifier.padding(4.dp)
                             .align(Alignment.TopEnd)
@@ -95,6 +97,22 @@ fun BookCardContent(
                         )
                     }
                 }
+                if (collected) {
+                    Box(
+                        modifier = Modifier.padding(4.dp)
+                            .align(Alignment.TopStart)
+                            .size(20.dp)
+                            .clip(RoundedCornerShape(4.dp))
+                            .background(MaterialTheme.colorScheme.secondaryContainer)
+                    ) {
+                        Icon(
+                            modifier = Modifier.scale(0.75f, 0.75f),
+                            painter = painterResource(R.drawable.filled_bookmark_24px),
+                            contentDescription = "collected_indicator",
+                            tint = MaterialTheme.colorScheme.onSurfaceVariant,
+                        )
+                    }
+                }
             }
 
             androidx.compose.animation.AnimatedVisibility(
@@ -136,10 +154,11 @@ fun BookCardContent(
             val titleLineHeight = 20.sp
             Text(
                 modifier = Modifier.height(
-                    with(LocalDensity.current) { (titleLineHeight * 2).toDp() }
+                    with(LocalDensity.current) { (titleLineHeight * 2.2f).toDp() }
                 ).wrapContentHeight(Alignment.CenterVertically),
                 text = bookInformation.title,
                 maxLines = 2,
+                overflow = TextOverflow.Ellipsis,
                 fontWeight = FontWeight.Bold,
                 fontSize = 16.sp,
                 lineHeight = titleLineHeight,
@@ -254,15 +273,15 @@ fun BookCardItem(
     modifier: Modifier = Modifier,
     bookInformation: BookInformation,
     selected: Boolean = false,
+    collected: Boolean = false,
     onClick: () -> Unit,
     onLongPress: () -> Unit,
     latestChapterTitle: String? = null,
     swipeToRightAction: SwipeAction = SwipeAction.None,
     swipeToLeftAction: SwipeAction = SwipeAction.None,
     progress: (SwipeAction) -> Unit?,
-    haptic: HapticFeedback
 ){
-
+    val haptic = LocalHapticFeedback.current
     val dismissState = rememberNoFlingSwipeToDismissBoxState(
         positionalThreshold = { it * 0.6f },
         confirmValueChange = {
@@ -312,11 +331,12 @@ fun BookCardItem(
                         .background(backgroundColor)
                         .combinedClickable(
                             onClick = onClick,
-                            onLongClick = onLongPress,
+                            onLongClick = withHaptic { onLongPress() },
                         )
                 ) {
                     BookCardContent(
                         selected = selected,
+                        collected = collected,
                         latestChapterTitle = latestChapterTitle,
                         bookInformation = bookInformation
                     )

diff --git a/app/src/main/kotlin/indi/dmzz_yyhyy/lightnovelreader/ui/home/exploration/Exploration.kt b/app/src/main/kotlin/indi/dmzz_yyhyy/lightnovelreader/ui/home/exploration/Exploration.kt
@@ -3,22 +3,15 @@ package indi.dmzz_yyhyy.lightnovelreader.ui.home.exploration
 import androidx.compose.animation.AnimatedVisibility
 import androidx.compose.animation.fadeIn
 import androidx.compose.animation.fadeOut
-import androidx.compose.foundation.clickable
 import androidx.compose.foundation.layout.Arrangement
-import androidx.compose.foundation.layout.Column
-import androidx.compose.foundation.layout.Row
 import androidx.compose.foundation.layout.WindowInsets
 import androidx.compose.foundation.layout.WindowInsetsSides
 import androidx.compose.foundation.layout.fillMaxSize
 import androidx.compose.foundation.layout.fillMaxWidth
-import androidx.compose.foundation.layout.height
 import androidx.compose.foundation.layout.only
-import androidx.compose.foundation.layout.padding
 import androidx.compose.foundation.layout.safeDrawing
 import androidx.compose.foundation.lazy.LazyColumn
 import androidx.compose.material3.ExperimentalMaterial3Api
-import androidx.compose.material3.Icon
-import androidx.compose.material3.IconButton
 import androidx.compose.material3.MaterialTheme
 import androidx.compose.material3.Text
 import androidx.compose.material3.TopAppBar
@@ -31,17 +24,12 @@ import androidx.compose.ui.Modifier
 import androidx.compose.ui.res.painterResource
 import androidx.compose.ui.res.stringResource
 import androidx.compose.ui.text.font.FontWeight
-import androidx.compose.ui.text.style.TextOverflow
-import androidx.compose.ui.unit.dp
-import androidx.compose.ui.unit.sp
 import androidx.hilt.navigation.compose.hiltViewModel
 import androidx.navigation.compose.NavHost
 import androidx.navigation.compose.composable
 import androidx.navigation.compose.rememberNavController
 import indi.dmzz_yyhyy.lightnovelreader.R
-import indi.dmzz_yyhyy.lightnovelreader.data.book.BookInformation
 import indi.dmzz_yyhyy.lightnovelreader.ui.Screen
-import indi.dmzz_yyhyy.lightnovelreader.ui.components.Cover
 import indi.dmzz_yyhyy.lightnovelreader.ui.components.EmptyPage
 import indi.dmzz_yyhyy.lightnovelreader.ui.components.NavItem
 import indi.dmzz_yyhyy.lightnovelreader.ui.home.exploration.expanded.ExpandedPageScreen
@@ -143,7 +131,7 @@ fun Exploration(
                 ExplorationSearchScreen(
                     topBar = topBar,
                     requestAddBookToBookshelf = requestAddBookToBookshelf,
-                    onCLickBack = { navController.popBackStack() },
+                    onClickBack = { navController.popBackStack() },
                     init = explorationSearchViewModel::init,
                     onChangeSearchType = { explorationSearchViewModel.changeSearchType(it) },
                     onSearch = { explorationSearchViewModel.search(it) },
@@ -177,78 +165,4 @@ fun Exploration(
             }
         }
     }
-}
-
-@Composable
-fun ExplorationBookCard(
-    modifier: Modifier = Modifier,
-    bookInformation: BookInformation,
-    allBookshelfBookIds: List<Int>,
-    requestAddBookToBookshelf: (Int) -> Unit,
-    onClickBook: (Int) -> Unit
-) {
-    Row(
-        modifier = modifier
-            .height(125.dp)
-            .clickable {
-                onClickBook(bookInformation.id)
-            }
-    ) {
-        Cover(
-            width = 82.dp,
-            height = 125.dp,
-            url = bookInformation.coverUrl,
-            rounded = 8.dp
-        )
-        Column (
-            modifier = Modifier
-                .fillMaxWidth()
-                .padding(8.dp, 2.dp, 14.dp, 5.dp),
-            verticalArrangement = Arrangement.spacedBy(4.dp)
-        ) {
-            Row(
-                modifier = Modifier.fillMaxWidth()
-            ) {
-                Text(
-                    modifier = Modifier.weight(2f),
-                    text = bookInformation.title,
-                    style = MaterialTheme.typography.labelLarge,
-                    fontWeight = FontWeight.W700,
-                    fontSize = 16.sp,
-                    maxLines = 2
-                )
-                IconButton(
-                    onClick = { requestAddBookToBookshelf(bookInformation.id) },
-                    modifier = Modifier.height(40.dp)
-                ) {
-                    Icon(
-                        painter =
-                        if (!allBookshelfBookIds.contains(bookInformation.id))
-                            painterResource(R.drawable.outline_bookmark_24px)
-                        else painterResource(R.drawable.filled_bookmark_24px),
-                        contentDescription = "mark",
-                        tint = MaterialTheme.colorScheme.onSurface
-                    )
-                }
-            }
-            Text(
-                text = stringResource(
-                    id = R.string.book_info_detailed,
-                    bookInformation.author,
-                    bookInformation.publishingHouse,
-                    bookInformation.lastUpdated.year,
-                    bookInformation.lastUpdated.monthValue,
-                    bookInformation.lastUpdated.dayOfMonth,
-                    bookInformation.wordCount,
-                    if (bookInformation.isComplete) stringResource(R.string.book_completed)
-                    else stringResource(R.string.book_ongoing),
-                    bookInformation.description.trim()
-                ),
-                style = MaterialTheme.typography.labelLarge,
-                fontSize = 13.sp,
-                lineHeight = 17.sp,
-                overflow = TextOverflow.Ellipsis
-            )
-        }
-    }
 }
diff --git a/...otlin/indi/dmzz_yyhyy/lightnovelreader/ui/home/exploration/expanded/ExpandedPageScreen.kt b/...otlin/indi/dmzz_yyhyy/lightnovelreader/ui/home/exploration/expanded/ExpandedPageScreen.kt
@@ -5,6 +5,7 @@ import androidx.compose.animation.fadeIn
 import androidx.compose.animation.fadeOut
 import androidx.compose.foundation.layout.Arrangement
 import androidx.compose.foundation.layout.Box
+import androidx.compose.foundation.layout.PaddingValues
 import androidx.compose.foundation.layout.fillMaxSize
 import androidx.compose.foundation.layout.height
 import androidx.compose.foundation.layout.padding
@@ -41,7 +42,8 @@ import androidx.lifecycle.compose.LifecycleEventEffect
 import indi.dmzz_yyhyy.lightnovelreader.R
 import indi.dmzz_yyhyy.lightnovelreader.ui.components.Component
 import indi.dmzz_yyhyy.lightnovelreader.ui.components.Loading
-import indi.dmzz_yyhyy.lightnovelreader.ui.home.exploration.ExplorationBookCard
+import indi.dmzz_yyhyy.lightnovelreader.ui.home.bookshelf.home.BookCardItem
+import indi.dmzz_yyhyy.lightnovelreader.utils.withHaptic
 import kotlinx.coroutines.launch
 
 @OptIn(ExperimentalMaterial3Api::class)
@@ -94,6 +96,7 @@ fun ExpandedPageScreen(
             modifier = Modifier
                 .fillMaxSize()
                 .nestedScroll(enterAlwaysScrollBehavior.nestedScrollConnection),
+            contentPadding = PaddingValues(horizontal = 16.dp, vertical = 3.dp),
             verticalArrangement = Arrangement.spacedBy(8.dp),
         ) {
             item {
@@ -108,14 +111,12 @@ fun ExpandedPageScreen(
                 Box(Modifier.height(3.dp))
             }
             itemsIndexed(uiState.bookList) { index, bookInformation ->
-                ExplorationBookCard(
-                    modifier = Modifier
-                        .padding(start = 19.dp, end = 10.dp)
-                        .animateItem(),
+                BookCardItem(
                     bookInformation = bookInformation,
-                    requestAddBookToBookshelf = requestAddBookToBookshelf,
-                    allBookshelfBookIds = uiState.allBookshelfBookIds,
-                    onClickBook = onClickBook
+                    onClick = { onClickBook(bookInformation.id) },
+                    onLongPress = withHaptic {},
+                    collected = uiState.allBookshelfBookIds.contains(bookInformation.id),
+                    progress = {},
                 )
                 LaunchedEffect(uiState.bookList.size) {
                     if (uiState.bookList.size - index == 3) {
@@ -137,7 +138,7 @@ fun TopBar(
     MediumTopAppBar(
         title = {
             Text(
-                text = "${stringResource(id = R.string.nav_exploration)} · $title",
+                text = stringResource(id = R.string.nav_exploration_child, title),
                 style = MaterialTheme.typography.titleLarge,
                 fontWeight = FontWeight.W600,
                 color = MaterialTheme.colorScheme.onSurface,