[优化] 一些界面优化

This commit is contained in:
HapeLee committed 2026-01-30 20:06:39 +08:00
1 parent acdaa60bd5
commit d95774fd40
9 files changed
+79 -65

No files matched your search

+1
View File
@@ -245,6 +245,7 @@
<activity <activity
android:name=".ui.replace.ReplaceRuleActivity" android:name=".ui.replace.ReplaceRuleActivity"
android:enableOnBackInvokedCallback="true" android:enableOnBackInvokedCallback="true"
android:windowSoftInputMode="adjustResize"
android:launchMode="singleTop" /> android:launchMode="singleTop" />
<!-- 书籍管理 --> <!-- 书籍管理 -->
<activity <activity
@@ -25,7 +25,6 @@ import androidx.compose.foundation.layout.padding
import androidx.compose.foundation.lazy.items import androidx.compose.foundation.lazy.items
import androidx.compose.foundation.lazy.rememberLazyListState import androidx.compose.foundation.lazy.rememberLazyListState
import androidx.compose.material.icons.Icons import androidx.compose.material.icons.Icons
import androidx.compose.material.icons.automirrored.filled.ArrowBack
import androidx.compose.material.icons.filled.KeyboardArrowDown import androidx.compose.material.icons.filled.KeyboardArrowDown
import androidx.compose.material.icons.filled.MoreVert import androidx.compose.material.icons.filled.MoreVert
import androidx.compose.material.icons.filled.Search import androidx.compose.material.icons.filled.Search
@@ -69,6 +68,7 @@ import io.legado.app.data.entities.Bookmark
import io.legado.app.ui.widget.components.EmptyMessageView import io.legado.app.ui.widget.components.EmptyMessageView
import io.legado.app.ui.widget.components.GlassMediumFlexibleTopAppBar import io.legado.app.ui.widget.components.GlassMediumFlexibleTopAppBar
import io.legado.app.ui.widget.components.SearchBarSection import io.legado.app.ui.widget.components.SearchBarSection
import io.legado.app.ui.widget.components.button.SmallTopBarButton
import io.legado.app.ui.widget.components.lazylist.FastScrollLazyColumn import io.legado.app.ui.widget.components.lazylist.FastScrollLazyColumn
import io.legado.app.ui.widget.components.lazylist.Scroller import io.legado.app.ui.widget.components.lazylist.Scroller
import io.legado.app.ui.widget.components.modalBottomSheet.GlassModalBottomSheet import io.legado.app.ui.widget.components.modalBottomSheet.GlassModalBottomSheet
@@ -126,9 +126,7 @@ fun AllBookmarkScreen(
}, },
scrollBehavior = scrollBehavior, scrollBehavior = scrollBehavior,
navigationIcon = { navigationIcon = {
IconButton(onClick = onBack) { SmallTopBarButton(onClick = onBack)
Icon(Icons.AutoMirrored.Filled.ArrowBack, contentDescription = "Back")
}
}, },
actions = { actions = {
if (bookmarksGrouped.isNotEmpty()) { if (bookmarksGrouped.isNotEmpty()) {
@@ -39,7 +39,6 @@ import androidx.compose.foundation.lazy.rememberLazyListState
import androidx.compose.foundation.rememberScrollState import androidx.compose.foundation.rememberScrollState
import androidx.compose.foundation.shape.RoundedCornerShape import androidx.compose.foundation.shape.RoundedCornerShape
import androidx.compose.material.icons.Icons import androidx.compose.material.icons.Icons
import androidx.compose.material.icons.automirrored.filled.ArrowBack
import androidx.compose.material.icons.automirrored.outlined.FormatListBulleted import androidx.compose.material.icons.automirrored.outlined.FormatListBulleted
import androidx.compose.material.icons.filled.Check import androidx.compose.material.icons.filled.Check
import androidx.compose.material.icons.filled.FilterList import androidx.compose.material.icons.filled.FilterList
@@ -96,6 +95,7 @@ import io.legado.app.ui.widget.components.Cover
import io.legado.app.ui.widget.components.GlassMediumFlexibleTopAppBar import io.legado.app.ui.widget.components.GlassMediumFlexibleTopAppBar
import io.legado.app.ui.widget.components.SearchBarSection import io.legado.app.ui.widget.components.SearchBarSection
import io.legado.app.ui.widget.components.button.AnimatedTextButton import io.legado.app.ui.widget.components.button.AnimatedTextButton
import io.legado.app.ui.widget.components.button.SmallTopBarButton
import io.legado.app.ui.widget.components.card.TextCard import io.legado.app.ui.widget.components.card.TextCard
import io.legado.app.ui.widget.components.modalBottomSheet.GlassModalBottomSheet import io.legado.app.ui.widget.components.modalBottomSheet.GlassModalBottomSheet
import kotlinx.coroutines.delay import kotlinx.coroutines.delay
@@ -439,9 +439,7 @@ fun ExploreTopBar(
modifier = modifier, modifier = modifier,
title = { AnimatedTextLine(title, maxLines = 1, overflow = TextOverflow.Ellipsis) }, title = { AnimatedTextLine(title, maxLines = 1, overflow = TextOverflow.Ellipsis) },
navigationIcon = { navigationIcon = {
IconButton(onClick = onBack) { SmallTopBarButton(onClick = onBack)
Icon(Icons.AutoMirrored.Filled.ArrowBack, contentDescription = "Back")
}
}, },
actions = { actions = {
Row( Row(
@@ -20,7 +20,6 @@ import androidx.compose.foundation.lazy.items
import androidx.compose.foundation.lazy.rememberLazyListState import androidx.compose.foundation.lazy.rememberLazyListState
import androidx.compose.foundation.shape.RoundedCornerShape import androidx.compose.foundation.shape.RoundedCornerShape
import androidx.compose.material.icons.Icons import androidx.compose.material.icons.Icons
import androidx.compose.material.icons.automirrored.filled.ArrowBack
import androidx.compose.material.icons.automirrored.filled.List import androidx.compose.material.icons.automirrored.filled.List
import androidx.compose.material.icons.filled.CalendarMonth import androidx.compose.material.icons.filled.CalendarMonth
import androidx.compose.material.icons.filled.Delete import androidx.compose.material.icons.filled.Delete
@@ -72,6 +71,7 @@ import io.legado.app.ui.widget.components.GlassMediumFlexibleTopAppBar
import io.legado.app.ui.widget.components.SearchBarSection import io.legado.app.ui.widget.components.SearchBarSection
import io.legado.app.ui.widget.components.SectionHeader import io.legado.app.ui.widget.components.SectionHeader
import io.legado.app.ui.widget.components.button.AlertButton import io.legado.app.ui.widget.components.button.AlertButton
import io.legado.app.ui.widget.components.button.SmallTopBarButton
import io.legado.app.ui.widget.components.swipe.SwipeAction import io.legado.app.ui.widget.components.swipe.SwipeAction
import io.legado.app.ui.widget.components.swipe.SwipeActionContainer import io.legado.app.ui.widget.components.swipe.SwipeActionContainer
import io.legado.app.utils.StringUtils.formatFriendlyDate import io.legado.app.utils.StringUtils.formatFriendlyDate
@@ -131,9 +131,7 @@ fun ReadRecordScreen(
) )
}, },
navigationIcon = { navigationIcon = {
IconButton(onClick = onBackClick) { SmallTopBarButton(onClick = onBackClick)
Icon(Icons.AutoMirrored.Filled.ArrowBack, contentDescription = null)
}
}, },
actions = { actions = {
IconButton(onClick = { IconButton(onClick = {
@@ -18,7 +18,6 @@ import androidx.compose.foundation.layout.wrapContentSize
import androidx.compose.foundation.lazy.itemsIndexed import androidx.compose.foundation.lazy.itemsIndexed
import androidx.compose.foundation.lazy.rememberLazyListState import androidx.compose.foundation.lazy.rememberLazyListState
import androidx.compose.material.icons.Icons import androidx.compose.material.icons.Icons
import androidx.compose.material.icons.automirrored.filled.ArrowBack
import androidx.compose.material.icons.filled.Code import androidx.compose.material.icons.filled.Code
import androidx.compose.material.icons.filled.FindReplace import androidx.compose.material.icons.filled.FindReplace
import androidx.compose.material.icons.filled.Stop import androidx.compose.material.icons.filled.Stop
@@ -29,7 +28,6 @@ import androidx.compose.material3.ExperimentalMaterial3ExpressiveApi
import androidx.compose.material3.FloatingActionButton import androidx.compose.material3.FloatingActionButton
import androidx.compose.material3.HorizontalDivider import androidx.compose.material3.HorizontalDivider
import androidx.compose.material3.Icon import androidx.compose.material3.Icon
import androidx.compose.material3.IconButton
import androidx.compose.material3.LinearProgressIndicator import androidx.compose.material3.LinearProgressIndicator
import androidx.compose.material3.MaterialTheme import androidx.compose.material3.MaterialTheme
import androidx.compose.material3.PlainTooltip import androidx.compose.material3.PlainTooltip
@@ -60,6 +58,7 @@ import io.legado.app.ui.widget.components.EmptyMessageView
import io.legado.app.ui.widget.components.GlassMediumFlexibleTopAppBar import io.legado.app.ui.widget.components.GlassMediumFlexibleTopAppBar
import io.legado.app.ui.widget.components.SearchBarSection import io.legado.app.ui.widget.components.SearchBarSection
import io.legado.app.ui.widget.components.button.AnimatedActionButton import io.legado.app.ui.widget.components.button.AnimatedActionButton
import io.legado.app.ui.widget.components.button.SmallTopBarButton
import io.legado.app.ui.widget.components.card.TextCard import io.legado.app.ui.widget.components.card.TextCard
import io.legado.app.ui.widget.components.lazylist.FastScrollLazyColumn import io.legado.app.ui.widget.components.lazylist.FastScrollLazyColumn
import org.koin.androidx.compose.koinViewModel import org.koin.androidx.compose.koinViewModel
@@ -142,9 +141,7 @@ fun SearchContentScreen(
) )
}, },
navigationIcon = { navigationIcon = {
IconButton(onClick = onBack) { SmallTopBarButton(onClick = onBack)
Icon(Icons.AutoMirrored.Filled.ArrowBack, contentDescription = "Back")
}
}, },
actions = { actions = {
Row( Row(
@@ -83,8 +83,7 @@ class ReplaceRuleActivity : BaseComposeActivity() {
onSaveSuccess = { onSaveSuccess = {
if (navController.previousBackStackEntry == null) finish() if (navController.previousBackStackEntry == null) finish()
else navController.popBackStack() else navController.popBackStack()
}, }
onShowHelp = { /* ... */ }
) )
} }
} }
@@ -3,6 +3,8 @@ package io.legado.app.ui.replace.edit
import androidx.compose.animation.AnimatedVisibility import androidx.compose.animation.AnimatedVisibility
import androidx.compose.animation.AnimatedVisibilityScope import androidx.compose.animation.AnimatedVisibilityScope
import androidx.compose.animation.SharedTransitionScope import androidx.compose.animation.SharedTransitionScope
import androidx.compose.animation.fadeIn
import androidx.compose.animation.fadeOut
import androidx.compose.animation.slideInVertically import androidx.compose.animation.slideInVertically
import androidx.compose.animation.slideOutVertically import androidx.compose.animation.slideOutVertically
import androidx.compose.foundation.background import androidx.compose.foundation.background
@@ -20,13 +22,13 @@ import androidx.compose.foundation.layout.fillMaxWidth
import androidx.compose.foundation.layout.height import androidx.compose.foundation.layout.height
import androidx.compose.foundation.layout.ime import androidx.compose.foundation.layout.ime
import androidx.compose.foundation.layout.imePadding import androidx.compose.foundation.layout.imePadding
import androidx.compose.foundation.layout.navigationBarsPadding
import androidx.compose.foundation.layout.padding import androidx.compose.foundation.layout.padding
import androidx.compose.foundation.layout.size import androidx.compose.foundation.layout.size
import androidx.compose.foundation.layout.width import androidx.compose.foundation.layout.width
import androidx.compose.foundation.rememberScrollState import androidx.compose.foundation.rememberScrollState
import androidx.compose.foundation.verticalScroll import androidx.compose.foundation.verticalScroll
import androidx.compose.material.icons.Icons import androidx.compose.material.icons.Icons
import androidx.compose.material.icons.automirrored.filled.HelpOutline
import androidx.compose.material.icons.filled.Check import androidx.compose.material.icons.filled.Check
import androidx.compose.material.icons.filled.MoreVert import androidx.compose.material.icons.filled.MoreVert
import androidx.compose.material.icons.filled.Save import androidx.compose.material.icons.filled.Save
@@ -44,14 +46,21 @@ import androidx.compose.material3.ExposedDropdownMenuBox
import androidx.compose.material3.ExposedDropdownMenuDefaults import androidx.compose.material3.ExposedDropdownMenuDefaults
import androidx.compose.material3.FilterChip import androidx.compose.material3.FilterChip
import androidx.compose.material3.FilterChipDefaults import androidx.compose.material3.FilterChipDefaults
import androidx.compose.material3.FloatingActionButton
import androidx.compose.material3.Icon import androidx.compose.material3.Icon
import androidx.compose.material3.IconButton import androidx.compose.material3.IconButton
import androidx.compose.material3.MaterialTheme import androidx.compose.material3.MaterialTheme
import androidx.compose.material3.OutlinedTextField import androidx.compose.material3.OutlinedTextField
import androidx.compose.material3.PlainTooltip
import androidx.compose.material3.Scaffold import androidx.compose.material3.Scaffold
import androidx.compose.material3.Text import androidx.compose.material3.Text
import androidx.compose.material3.TextButton import androidx.compose.material3.TextButton
import androidx.compose.material3.TooltipAnchorPosition
import androidx.compose.material3.TooltipBox
import androidx.compose.material3.TooltipDefaults
import androidx.compose.material3.TopAppBarDefaults import androidx.compose.material3.TopAppBarDefaults
import androidx.compose.material3.animateFloatingActionButton
import androidx.compose.material3.rememberTooltipState
import androidx.compose.runtime.Composable import androidx.compose.runtime.Composable
import androidx.compose.runtime.State import androidx.compose.runtime.State
import androidx.compose.runtime.collectAsState import androidx.compose.runtime.collectAsState
@@ -69,6 +78,7 @@ import androidx.compose.ui.graphics.Color
import androidx.compose.ui.input.nestedscroll.nestedScroll import androidx.compose.ui.input.nestedscroll.nestedScroll
import androidx.compose.ui.platform.LocalDensity import androidx.compose.ui.platform.LocalDensity
import androidx.compose.ui.unit.dp import androidx.compose.ui.unit.dp
import androidx.compose.ui.zIndex
import io.legado.app.ui.widget.components.GlassMediumFlexibleTopAppBar import io.legado.app.ui.widget.components.GlassMediumFlexibleTopAppBar
import io.legado.app.ui.widget.components.button.AlertButton import io.legado.app.ui.widget.components.button.AlertButton
import io.legado.app.ui.widget.components.button.SmallTopBarButton import io.legado.app.ui.widget.components.button.SmallTopBarButton
@@ -87,7 +97,6 @@ fun ReplaceEditScreen(
animatedVisibilityScope: AnimatedVisibilityScope, animatedVisibilityScope: AnimatedVisibilityScope,
onBack: () -> Unit, onBack: () -> Unit,
onSaveSuccess: () -> Unit, onSaveSuccess: () -> Unit,
onShowHelp: (String) -> Unit,
viewModel: ReplaceEditViewModel = koinViewModel() viewModel: ReplaceEditViewModel = koinViewModel()
) { ) {
val state by viewModel.uiState.collectAsState() val state by viewModel.uiState.collectAsState()
@@ -99,16 +108,15 @@ fun ReplaceEditScreen(
val isKeyboardVisible by keyboardAsState() val isKeyboardVisible by keyboardAsState()
with(sharedTransitionScope) { with(sharedTransitionScope) {
Box(modifier = Modifier.fillMaxSize()) {
Scaffold( Scaffold(
modifier = Modifier modifier = Modifier
.nestedScroll(scrollBehavior.nestedScrollConnection) .nestedScroll(scrollBehavior.nestedScrollConnection)
.sharedBounds( .sharedBounds(
sharedContentState = rememberSharedContentState(key = sharedKey), sharedContentState = rememberSharedContentState(key = sharedKey),
animatedVisibilityScope = animatedVisibilityScope, animatedVisibilityScope = animatedVisibilityScope,
resizeMode = SharedTransitionScope.ResizeMode.RemeasureToBounds, resizeMode = SharedTransitionScope.ResizeMode.RemeasureToBounds
//clipInOverlayDuringTransition = OverlayClip(RoundedCornerShape(16.dp)) )
), .imePadding(),
topBar = { topBar = {
GlassMediumFlexibleTopAppBar( GlassMediumFlexibleTopAppBar(
title = { Text(if (state.id > 0) "编辑替换规则" else "新增替换规则") }, title = { Text(if (state.id > 0) "编辑替换规则" else "新增替换规则") },
@@ -116,29 +124,24 @@ fun ReplaceEditScreen(
SmallTopBarButton(onClick = onBack) SmallTopBarButton(onClick = onBack)
}, },
actions = { actions = {
AnimatedVisibility(
IconButton(onClick = { onShowHelp("regexHelp") }) { visible = isKeyboardVisible,
Icon( enter = fadeIn(),
Icons.AutoMirrored.Filled.HelpOutline, exit = fadeOut()
contentDescription = "帮助" ) {
)
}
IconButton(onClick = { IconButton(onClick = {
viewModel.save(onSaveSuccess) viewModel.save(onSaveSuccess)
}) { }) {
Icon(Icons.Default.Save, contentDescription = "保存") Icon(Icons.Default.Save, contentDescription = "保存")
} }
}
IconButton(onClick = { showMenu = true }) { IconButton(onClick = { showMenu = true }) {
Icon(Icons.Default.MoreVert, contentDescription = "更多操作") Icon(Icons.Default.MoreVert, contentDescription = "更多操作")
} }
DropdownMenu( DropdownMenu(
expanded = showMenu, expanded = showMenu,
onDismissRequest = { showMenu = false } onDismissRequest = { showMenu = false }
) { ) {
DropdownMenuItem( DropdownMenuItem(
text = { Text("复制规则") }, text = { Text("复制规则") },
onClick = { onClick = {
@@ -146,7 +149,6 @@ fun ReplaceEditScreen(
viewModel.copyRule() viewModel.copyRule()
} }
) )
DropdownMenuItem( DropdownMenuItem(
text = { Text("粘贴规则") }, text = { Text("粘贴规则") },
onClick = { onClick = {
@@ -158,15 +160,54 @@ fun ReplaceEditScreen(
}, },
scrollBehavior = scrollBehavior scrollBehavior = scrollBehavior
) )
},
floatingActionButton = {
TooltipBox(
modifier = Modifier.navigationBarsPadding(),
positionProvider = TooltipDefaults.rememberTooltipPositionProvider(
TooltipAnchorPosition.Above
),
tooltip = { PlainTooltip { Text("添加") } },
state = rememberTooltipState(),
) {
FloatingActionButton(
modifier = Modifier.animateFloatingActionButton(
visible = !isKeyboardVisible,
alignment = Alignment.BottomEnd,
),
onClick = { viewModel.save(onSaveSuccess) }
) {
Icon(Icons.Default.Save, contentDescription = "保存")
}
}
}, contentWindowInsets = WindowInsets(0, 0, 0, 0)
) { innerPadding ->
Box(
Modifier
.fillMaxSize()
.padding(innerPadding)
) {
AnimatedVisibility(
visible = isKeyboardVisible,
enter = slideInVertically(
initialOffsetY = { fullHeight -> fullHeight },
),
exit = slideOutVertically(
targetOffsetY = { fullHeight -> fullHeight },
),
modifier = Modifier
.align(Alignment.BottomCenter)
.zIndex(1f)
) {
QuickInputBar(
onInsert = { text -> viewModel.insertTextAtCursor(text) }
)
} }
) { paddingValues ->
Column( Column(
modifier = Modifier modifier = Modifier
.padding(paddingValues) .fillMaxWidth()
.fillMaxSize() .padding(horizontal = 16.dp)
.verticalScroll(rememberScrollState()) .verticalScroll(rememberScrollState()),
.imePadding()
.padding(horizontal = 16.dp, vertical = 8.dp),
verticalArrangement = Arrangement.spacedBy(16.dp) verticalArrangement = Arrangement.spacedBy(16.dp)
) { ) {
@@ -306,29 +347,11 @@ fun ReplaceEditScreen(
modifier = Modifier.fillMaxWidth() modifier = Modifier.fillMaxWidth()
) )
Spacer(Modifier.height(16.dp)) Spacer(Modifier.height(120.dp))
} }
} }
AnimatedVisibility(
visible = isKeyboardVisible,
enter = slideInVertically(
initialOffsetY = { fullHeight -> fullHeight },
),
exit = slideOutVertically(
targetOffsetY = { fullHeight -> fullHeight },
),
modifier = Modifier
.align(Alignment.BottomCenter)
.imePadding()
) {
QuickInputBar(
onInsert = { text -> viewModel.insertTextAtCursor(text) }
)
}
if (state.showGroupDialog) { if (state.showGroupDialog) {
ManageGroupDialog( ManageGroupDialog(
groups = state.allGroups.filter { it != "默认" }, groups = state.allGroups.filter { it != "默认" },
@@ -338,9 +361,9 @@ fun ReplaceEditScreen(
} }
} }
} }
} }
@OptIn(ExperimentalMaterial3Api::class) @OptIn(ExperimentalMaterial3Api::class)
@Composable @Composable
fun GroupSelector( fun GroupSelector(
@@ -71,7 +71,7 @@ class ReplaceEditViewModel(
_uiState.update { _uiState.update {
it.copy( it.copy(
id = id, id = id,
name = TextFieldValue(""), name = TextFieldValue(route.pattern ?: ""),
pattern = TextFieldValue(route.pattern ?: ""), pattern = TextFieldValue(route.pattern ?: ""),
isRegex = route.isRegex, isRegex = route.isRegex,
scope = TextFieldValue(route.scope ?: ""), scope = TextFieldValue(route.scope ?: ""),
@@ -42,7 +42,7 @@ fun SplicedColumnGroup(
modifier = Modifier.fillMaxWidth() modifier = Modifier.fillMaxWidth()
) { ) {
Column( Column(
verticalArrangement = Arrangement.spacedBy(4.dp) verticalArrangement = Arrangement.spacedBy(2.dp)
) { ) {
content() content()
} }