[optimize]调整小工具“实验性”图标透明的；“风格转换”页面的Column改为LazyColumn；首页“添加”按钮改为FAB

SkyD666 · Sep 25, 2023 · 1448eb6 · 1448eb6
1 parent 51a0e18
commit 1448eb6
Show file tree

Hide file tree

Showing 7 changed files with 141 additions and 103 deletions.
diff --git a/app/build.gradle b/app/build.gradle
@@ -21,8 +21,8 @@ android {
         applicationId "com.skyd.rays"
         minSdk 24
         targetSdk 34
-        versionCode 32
-        versionName "1.5"
+        versionCode 33
+        versionName "1.6-beta01"
         flavorDimensions = ["versionName"]
 
         testInstrumentationRunner "androidx.test.runner.AndroidJUnitRunner"

diff --git a/app/src/main/java/com/skyd/rays/ext/ScrollStateExt.kt b/app/src/main/java/com/skyd/rays/ext/ScrollStateExt.kt
@@ -0,0 +1,12 @@
+package com.skyd.rays.ext
+
+import androidx.compose.foundation.ScrollState
+import androidx.compose.foundation.lazy.LazyListState
+
+// 如果滚动到了最下面 或者 不够长不能滚动时为true
+val ScrollState.inBottomOrNotLarge: Boolean
+    get() = value < maxValue || maxValue == 0
+
+// 如果滚动到了最下面 或者 不够长不能滚动时为true
+val LazyListState.inBottomOrNotLarge: Boolean
+    get() = canScrollForward || firstVisibleItemIndex == 0 && firstVisibleItemScrollOffset == 0
diff --git a/app/src/main/java/com/skyd/rays/ui/component/RaysFloatingActionButton.kt b/app/src/main/java/com/skyd/rays/ui/component/RaysFloatingActionButton.kt
@@ -1,5 +1,10 @@
 package com.skyd.rays.ui.component
 
+import androidx.compose.animation.AnimatedVisibility
+import androidx.compose.animation.fadeIn
+import androidx.compose.animation.fadeOut
+import androidx.compose.animation.slideInVertically
+import androidx.compose.animation.slideOutVertically
 import androidx.compose.foundation.interaction.MutableInteractionSource
 import androidx.compose.foundation.layout.Row
 import androidx.compose.foundation.layout.RowScope
@@ -17,6 +22,8 @@ import androidx.compose.material3.rememberTooltipState
 import androidx.compose.runtime.Composable
 import androidx.compose.runtime.remember
 import androidx.compose.ui.Modifier
+import androidx.compose.ui.platform.LocalDensity
+import androidx.compose.ui.unit.dp
 
 enum class RaysFloatingActionButtonStyle {
     Normal, Extended, Large, Small
@@ -125,4 +132,35 @@ fun RaysExtendedFloatingActionButton(
             floatingActionButton(modifier = Modifier)
         }
     }
+}
+
+@Composable
+fun BottomHideExtendedFloatingActionButton(
+    visible: Boolean,
+    modifier: Modifier = Modifier,
+    text: @Composable () -> Unit,
+    icon: @Composable () -> Unit,
+    onClick: () -> Unit,
+    expanded: Boolean = true,
+    elevation: FloatingActionButtonElevation = FloatingActionButtonDefaults.elevation(),
+    contentDescription: String? = null,
+    interactionSource: MutableInteractionSource = remember { MutableInteractionSource() },
+) {
+    val density = LocalDensity.current
+    AnimatedVisibility(
+        visible = visible,
+        enter = slideInVertically { with(density) { 40.dp.roundToPx() } } + fadeIn(),
+        exit = slideOutVertically { with(density) { 40.dp.roundToPx() } } + fadeOut(),
+    ) {
+        RaysExtendedFloatingActionButton(
+            modifier = modifier,
+            text = text,
+            icon = icon,
+            onClick = onClick,
+            expanded = expanded,
+            elevation = elevation,
+            contentDescription = contentDescription,
+            interactionSource = interactionSource,
+        )
+    }
 }
diff --git a/...src/main/java/com/skyd/rays/ui/component/lazyverticalgrid/adapter/proxy/MiniTool1Proxy.kt b/...src/main/java/com/skyd/rays/ui/component/lazyverticalgrid/adapter/proxy/MiniTool1Proxy.kt
@@ -1,6 +1,5 @@
 package com.skyd.rays.ui.component.lazyverticalgrid.adapter.proxy
 
-import androidx.compose.foundation.basicMarquee
 import androidx.compose.foundation.combinedClickable
 import androidx.compose.foundation.layout.Row
 import androidx.compose.foundation.layout.fillMaxWidth
@@ -10,6 +9,7 @@ import androidx.compose.foundation.shape.RoundedCornerShape
 import androidx.compose.material.icons.Icons
 import androidx.compose.material.icons.filled.Science
 import androidx.compose.material3.Icon
+import androidx.compose.material3.LocalContentColor
 import androidx.compose.material3.MaterialTheme
 import androidx.compose.material3.OutlinedCard
 import androidx.compose.material3.PlainTooltip
@@ -63,12 +63,10 @@ fun MiniTool1Item(
                 contentDescription = null,
             )
             Text(
-                modifier = Modifier
-                    .padding(horizontal = 10.dp)
-                    .basicMarquee(iterations = Int.MAX_VALUE),
+                modifier = Modifier.padding(horizontal = 10.dp),
                 text = data.title,
                 style = MaterialTheme.typography.titleMedium,
-                maxLines = 1,
+                maxLines = 2,
                 textAlign = TextAlign.Center
             )
             if (data.experimental) {
@@ -80,6 +78,7 @@ fun MiniTool1Item(
                     Icon(
                         imageVector = Icons.Default.Science,
                         contentDescription = stringResource(R.string.mini_tool_experimental),
+                        tint = LocalContentColor.current.copy(alpha = 0.5f),
                     )
                 }
             }

diff --git a/app/src/main/java/com/skyd/rays/ui/screen/home/HomeScreen.kt b/app/src/main/java/com/skyd/rays/ui/screen/home/HomeScreen.kt
@@ -6,6 +6,7 @@ import androidx.compose.animation.core.Spring
 import androidx.compose.animation.core.spring
 import androidx.compose.animation.expandHorizontally
 import androidx.compose.animation.shrinkHorizontally
+import androidx.compose.foundation.ScrollState
 import androidx.compose.foundation.basicMarquee
 import androidx.compose.foundation.combinedClickable
 import androidx.compose.foundation.layout.Arrangement
@@ -27,6 +28,7 @@ import androidx.compose.foundation.rememberScrollState
 import androidx.compose.foundation.text.selection.SelectionContainer
 import androidx.compose.foundation.verticalScroll
 import androidx.compose.material.icons.Icons
+import androidx.compose.material.icons.filled.Add
 import androidx.compose.material.icons.filled.AddCircle
 import androidx.compose.material.icons.filled.AdsClick
 import androidx.compose.material.icons.filled.Badge
@@ -45,6 +47,7 @@ import androidx.compose.material3.Text
 import androidx.compose.material3.windowsizeclass.WindowWidthSizeClass
 import androidx.compose.runtime.Composable
 import androidx.compose.runtime.LaunchedEffect
+import androidx.compose.runtime.derivedStateOf
 import androidx.compose.runtime.getValue
 import androidx.compose.runtime.mutableStateOf
 import androidx.compose.runtime.remember
@@ -69,11 +72,14 @@ import com.skyd.rays.R
 import com.skyd.rays.base.LoadUiIntent
 import com.skyd.rays.config.refreshStickerData
 import com.skyd.rays.ext.dateTime
+import com.skyd.rays.ext.inBottomOrNotLarge
+import com.skyd.rays.ext.isCompact
 import com.skyd.rays.ext.showSnackbarWithLaunchedEffect
 import com.skyd.rays.model.bean.StickerWithTags
 import com.skyd.rays.model.preference.StickerScalePreference
 import com.skyd.rays.model.preference.search.QueryPreference
 import com.skyd.rays.ui.component.AnimatedPlaceholder
+import com.skyd.rays.ui.component.BottomHideExtendedFloatingActionButton
 import com.skyd.rays.ui.component.RaysIconButton
 import com.skyd.rays.ui.component.RaysIconButtonStyle
 import com.skyd.rays.ui.component.RaysImage
@@ -91,6 +97,7 @@ import com.skyd.rays.util.sendStickerByUuid
 
 @Composable
 fun HomeScreen(viewModel: HomeViewModel = hiltViewModel()) {
+    val navController = LocalNavController.current
     val scope = rememberCoroutineScope()
     val snackbarHostState = remember { SnackbarHostState() }
     val context = LocalContext.current
@@ -103,6 +110,17 @@ fun HomeScreen(viewModel: HomeViewModel = hiltViewModel()) {
     val uiState by viewModel.uiStateFlow.collectAsStateWithLifecycle()
     val uiEvent by viewModel.uiEventFlow.collectAsStateWithLifecycle(initialValue = null)
     val loadUiIntent by viewModel.loadUiIntentFlow.collectAsStateWithLifecycle(initialValue = null)
+    val mainCardScrollState = rememberScrollState()
+    val stickerDetailInfoScrollState = rememberScrollState()
+    val fabVisibility by remember {
+        derivedStateOf {
+            if (windowSizeClass.isCompact) {
+                mainCardScrollState.inBottomOrNotLarge
+            } else {
+                stickerDetailInfoScrollState.inBottomOrNotLarge
+            }
+        }
+    }
 
     refreshStickerData.collectAsStateWithLifecycle(initialValue = null).apply {
         value ?: return@apply
@@ -116,6 +134,15 @@ fun HomeScreen(viewModel: HomeViewModel = hiltViewModel()) {
 
     Scaffold(
         snackbarHost = { SnackbarHost(hostState = snackbarHostState) },
+        floatingActionButton = {
+            BottomHideExtendedFloatingActionButton(
+                visible = fabVisibility,
+                text = { Text(text = stringResource(R.string.home_screen_add)) },
+                icon = { Icon(imageVector = Icons.Default.Add, contentDescription = null) },
+                onClick = { navController.navigate(ADD_SCREEN_ROUTE) },
+                contentDescription = stringResource(R.string.home_screen_add),
+            )
+        },
         contentWindowInsets = WindowInsets(
             left = ScaffoldDefaults.contentWindowInsets
                 .getLeft(LocalDensity.current, LocalLayoutDirection.current),
@@ -165,15 +192,18 @@ fun HomeScreen(viewModel: HomeViewModel = hiltViewModel()) {
 
                     is StickerDetailUiState.Success -> {
                         Spacer(modifier = Modifier.height(16.dp))
-                        MainCard(stickerWithTags = stickerDetailUiState.stickerWithTags)
+                        MainCard(
+                            stickerWithTags = stickerDetailUiState.stickerWithTags,
+                            scrollState = mainCardScrollState,
+                        )
                     }
                 }
             }
             AnimatedVisibility(
                 visible = showStickerDetailInfo,
                 modifier = Modifier
                     .fillMaxHeight()
-                    .verticalScroll(state = rememberScrollState()),
+                    .verticalScroll(stickerDetailInfoScrollState),
                 enter = expandHorizontally(expandFrom = Alignment.Start),
                 exit = shrinkHorizontally(shrinkTowards = Alignment.End),
             ) {
@@ -229,7 +259,11 @@ fun HomeScreen(viewModel: HomeViewModel = hiltViewModel()) {
 }
 
 @Composable
-private fun MainCard(stickerWithTags: StickerWithTags, viewModel: HomeViewModel = hiltViewModel()) {
+private fun MainCard(
+    stickerWithTags: StickerWithTags,
+    scrollState: ScrollState = rememberScrollState(),
+    viewModel: HomeViewModel = hiltViewModel()
+) {
     val navController = LocalNavController.current
     val stickerUuid = stickerWithTags.sticker.uuid
     val clipboardManager: ClipboardManager = LocalClipboardManager.current
@@ -250,7 +284,7 @@ private fun MainCard(stickerWithTags: StickerWithTags, viewModel: HomeViewModel
 
     Card(
         modifier = Modifier
-            .verticalScroll(rememberScrollState())
+            .verticalScroll(scrollState)
             .padding(horizontal = 16.dp)
             .padding(bottom = 16.dp)
             .fillMaxWidth()

diff --git a/app/src/main/java/com/skyd/rays/ui/screen/home/searchbar/RaysSearchBar.kt b/app/src/main/java/com/skyd/rays/ui/screen/home/searchbar/RaysSearchBar.kt
@@ -21,7 +21,6 @@ import androidx.compose.foundation.lazy.itemsIndexed
 import androidx.compose.foundation.lazy.staggeredgrid.rememberLazyStaggeredGridState
 import androidx.compose.material.icons.Icons
 import androidx.compose.material.icons.automirrored.filled.ArrowBack
-import androidx.compose.material.icons.filled.Add
 import androidx.compose.material.icons.filled.Clear
 import androidx.compose.material.icons.filled.Folder
 import androidx.compose.material.icons.filled.Menu
@@ -66,10 +65,8 @@ import com.skyd.rays.ui.component.dialog.DeleteWarningDialog
 import com.skyd.rays.ui.component.dialog.RaysDialog
 import com.skyd.rays.ui.local.LocalCurrentStickerUuid
 import com.skyd.rays.ui.local.LocalExportStickerDir
-import com.skyd.rays.ui.local.LocalNavController
 import com.skyd.rays.ui.local.LocalShowPopularTags
 import com.skyd.rays.ui.local.LocalWindowSizeClass
-import com.skyd.rays.ui.screen.add.ADD_SCREEN_ROUTE
 import com.skyd.rays.ui.screen.home.HomeIntent
 import com.skyd.rays.ui.screen.home.HomeState
 import com.skyd.rays.ui.screen.home.HomeViewModel
@@ -93,7 +90,6 @@ fun RaysSearchBar(
     var multiSelect by rememberSaveable { mutableStateOf(false) }
     val selectedStickers = remember { mutableStateListOf<StickerWithTags>() }
     val windowSizeClass = LocalWindowSizeClass.current
-    val navController = LocalNavController.current
     val currentStickerUuid = LocalCurrentStickerUuid.current
     val keyboardController = LocalSoftwareKeyboardController.current
     val searchBarHorizontalPadding: Dp by animateDpAsState(
@@ -179,12 +175,6 @@ fun RaysSearchBar(
                                 onQueryChange(QueryPreference.default)
                             }
                         }
-                    } else {
-                        RaysIconButton(
-                            imageVector = Icons.Default.Add,
-                            contentDescription = stringResource(R.string.home_screen_add),
-                            onClick = { navController.navigate(ADD_SCREEN_ROUTE) }
-                        )
                     }
                 },
             ) {