Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

Sign up for GitHub

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

探索页面整体UI优化 #138

Merged
merged 4 commits into from
Dec 25, 2024
Merged

探索页面整体UI优化 #138

Show file tree
Hide file tree
Changes from all commits
Commits
Show all changes
4 commits
Select commit Hold shift + click to select a range
28f54a1
书架UI修正
yukonisen Dec 25, 2024
210eef6
重构探索主页、搜索结果和二级页面UI
yukonisen Dec 25, 2024
82aca60
设置项新增图标
yukonisen Dec 25, 2024
b957c3e
Merry Christmas
yukonisen Dec 25, 2024
File filter

Filter by extension

Filter by extension
Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
2 changes: 1 addition & 1 deletion app/build.gradle.kts
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -21,7 +21,7 @@ android {
minSdk = 24
targetSdk = 34
// 版本号为x.y.z则versionCode为x*1000000+y*10000+z*100+debug版本号(开发需要时迭代, 两位数)
versionCode = 1_00_00_010
versionCode = 1_00_00_013
versionName = "1.0.0"

testInstrumentationRunner = "androidx.test.runner.AndroidJUnitRunner"
Expand Down
14 changes: 7 additions & 7 deletions app/src/main/kotlin/indi/dmzz_yyhyy/lightnovelreader/ui/components/SettingsEntry.kt
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -96,13 +96,13 @@ fun SettingsSwitchEntry(
Box(
modifier = Modifier
.fillMaxHeight()
.padding(end = 8.dp),
.padding(end = 12.dp),
contentAlignment = Alignment.Center
) {
Icon(
modifier = Modifier.size(24.dp),
painter = painterResource(iconRes),
tint = MaterialTheme.colorScheme.onSecondaryContainer,
tint = MaterialTheme.colorScheme.onSurfaceVariant,
contentDescription = "Icon"
)
}
Expand Down Expand Up @@ -203,7 +203,7 @@ private fun SettingsSliderEntry(
Icon(
modifier = Modifier.size(24.dp),
painter = painterResource(iconRes),
tint = MaterialTheme.colorScheme.onSecondaryContainer,
tint = MaterialTheme.colorScheme.onSurfaceVariant,
contentDescription = "Icon"
)
}
Expand Down Expand Up @@ -277,13 +277,13 @@ fun SettingsMenuEntry(
Box(
modifier = Modifier
.fillMaxHeight()
.padding(end = 8.dp),
.padding(end = 12.dp),
contentAlignment = Alignment.Center
) {
Icon(
modifier = Modifier.size(24.dp),
painter = painterResource(iconRes),
tint = MaterialTheme.colorScheme.onSecondaryContainer,
tint = MaterialTheme.colorScheme.onSurfaceVariant,
contentDescription = "Icon"
)
}
Expand Down Expand Up @@ -405,13 +405,13 @@ fun SettingsClickableEntry(
Box(
modifier = Modifier
.fillMaxHeight()
.padding(end = 8.dp),
.padding(end = 12.dp),
contentAlignment = Alignment.Center
) {
Icon(
modifier = Modifier.size(24.dp),
painter = painterResource(iconRes),
tint = MaterialTheme.colorScheme.onSecondaryContainer,
tint = MaterialTheme.colorScheme.onSurfaceVariant,
contentDescription = "Icon"
)
}
Expand Down
11 changes: 2 additions & 9 deletions ...ain/kotlin/indi/dmzz_yyhyy/lightnovelreader/ui/home/bookshelf/home/BookshelfHomeScreen.kt
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -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
Expand Down Expand Up @@ -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(
Expand Down Expand Up @@ -276,7 +273,6 @@ fun BookshelfHomeScreen(
val onLongPress: (Int) -> Unit = { bookId ->
onClickEnableSelectMode.invoke()
changeBookSelectState(bookId)
haptic.performHapticFeedback(HapticFeedbackType.LongPress)
}

LazyColumn(
Expand All @@ -287,7 +283,7 @@ fun BookshelfHomeScreen(
verticalArrangement = Arrangement.spacedBy(10.dp),
state = lazyListState
) {
if (uiState.selectedBookshelf.updatedBookIds.isNotEmpty())
if (uiState.selectedBookshelf.updatedBookIds.isNotEmpty() && !uiState.selectMode)
item {
CollapseGroupTitle(
modifier = Modifier.animateItem(),
Expand All @@ -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 = {
Expand All @@ -316,7 +311,7 @@ fun BookshelfHomeScreen(
}
}
}
if (uiState.selectedBookshelf.pinnedBookIds.isNotEmpty() && !uiState.selectMode)
if (uiState.selectedBookshelf.pinnedBookIds.isNotEmpty())
item {
CollapseGroupTitle(
modifier = Modifier.animateItem(),
Expand All @@ -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)
Expand Down Expand Up @@ -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)
Expand Down
67 changes: 43 additions & 24 deletions ...n/kotlin/indi/dmzz_yyhyy/lightnovelreader/ui/home/bookshelf/home/BookshelfUIComponents.kt
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -35,33 +35,36 @@ 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
import androidx.compose.ui.text.style.TextOverflow
import androidx.compose.ui.unit.Density
import androidx.compose.ui.unit.dp
import androidx.compose.ui.unit.sp
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
Expand All @@ -83,16 +86,33 @@ fun BookCardContent(
url = bookInformation.coverUrl,
rounded = 8.dp
)
if (latestChapterTitle != null) {
if (latestChapterTitle != null) { // 有可用更新 Badge
Box(
modifier = Modifier.padding(4.dp)
.align(Alignment.TopEnd)
) {
Badge(
containerColor = MaterialTheme.colorScheme.error,
modifier = Modifier.size(12.dp),
)
}
}
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(
Expand Down Expand Up @@ -134,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,
Expand Down Expand Up @@ -190,23 +211,20 @@ fun BookCardContent(
)
} else {
Column {
Row {

Text(
text = "已更新至: ",
fontSize = 14.sp,
lineHeight = 18.sp,
)
}
Row {
Text(
text = latestChapterTitle,
fontWeight = FontWeight.Bold,
color = MaterialTheme.colorScheme.primary,
fontSize = 14.sp,
lineHeight = 18.sp,
)
}
Text(
text = "已更新至: ",
fontSize = 14.sp,
lineHeight = 18.sp,
)
Text(
text = latestChapterTitle,
fontWeight = FontWeight.Bold,
color = MaterialTheme.colorScheme.primary,
fontSize = 14.sp,
lineHeight = 18.sp,
maxLines = 1,
overflow = TextOverflow.Ellipsis
)
}
}
}
Expand Down Expand Up @@ -255,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 = {
Expand Down Expand Up @@ -313,11 +331,12 @@ fun BookCardItem(
.background(backgroundColor)
.combinedClickable(
onClick = onClick,
onLongClick = onLongPress,
onLongClick = withHaptic { onLongPress() },
)
) {
BookCardContent(
selected = selected,
collected = collected,
latestChapterTitle = latestChapterTitle,
bookInformation = bookInformation
)
Expand Down
Loading
Loading