feat: refactor to use Box instead of Surface

huhx · Feb 19, 2024 · 4a54ae7 · 4a54ae7
1 parent 6c345f1
commit 4a54ae7
Show file tree

Hide file tree

Showing 3 changed files with 33 additions and 29 deletions.
diff --git a/app/src/main/java/com/huhx/picker/MainActivity.kt b/app/src/main/java/com/huhx/picker/MainActivity.kt
@@ -161,7 +161,7 @@ fun AssetImageIndicatorPreview() {
             assetInfo = assetInfo,
             size = 24.dp,
             fontSize = 15.sp,
-            selected = false,
+            selected = true,
             assetSelected = list
         )
     }

diff --git a/compose_image_picker/src/main/java/com/huhx/picker/view/AssetPreviewScreen.kt b/compose_image_picker/src/main/java/com/huhx/picker/view/AssetPreviewScreen.kt
@@ -108,7 +108,7 @@ private fun SelectorBottomBar(
         modifier = Modifier
             .fillMaxWidth()
             .background(color = Color.Black.copy(alpha = 0.9F))
-            .padding(horizontal = 10.dp, vertical = 14.dp),
+            .padding(horizontal = 10.dp, vertical = 8.dp),
         horizontalArrangement = Arrangement.SpaceBetween,
         verticalAlignment = Alignment.CenterVertically
     ) {
@@ -117,8 +117,10 @@ private fun SelectorBottomBar(
                 assetInfo = assetInfo,
                 selected = selectedList.any { it == assetInfo },
                 assetSelected = selectedList,
+                fontSize = 14.sp,
+                size = 23.dp
             )
-            Spacer(modifier = Modifier.width(4.dp))
+            Spacer(modifier = Modifier.width(6.dp))
             Text(text = stringResource(R.string.text_asset_select), color = Color.White, fontSize = 14.sp)
         }
         Button(

diff --git a/compose_image_picker/src/main/java/com/huhx/picker/view/CommonView.kt b/compose_image_picker/src/main/java/com/huhx/picker/view/CommonView.kt
@@ -2,6 +2,9 @@ package com.huhx.picker.view
 
 import android.widget.Toast
 import androidx.compose.foundation.BorderStroke
+import androidx.compose.foundation.background
+import androidx.compose.foundation.border
+import androidx.compose.foundation.clickable
 import androidx.compose.foundation.layout.Box
 import androidx.compose.foundation.layout.PaddingValues
 import androidx.compose.foundation.layout.defaultMinSize
@@ -10,7 +13,6 @@ import androidx.compose.foundation.layout.size
 import androidx.compose.foundation.shape.CircleShape
 import androidx.compose.foundation.shape.RoundedCornerShape
 import androidx.compose.material3.Button
-import androidx.compose.material3.Surface
 import androidx.compose.material3.Text
 import androidx.compose.runtime.Composable
 import androidx.compose.runtime.compositionLocalOf
@@ -62,34 +64,34 @@ fun AssetImageIndicator(
     } else {
         Pair(BorderStroke(width = 1.dp, color = Color.White), Color.Black.copy(alpha = 0.3F))
     }
-    Surface(
-        onClick = {
-            val isSelected = !selected
-            if (onClicks != null) {
-                onClicks(isSelected)
-                return@Surface
-            }
-            if (assetSelected.size == maxAssets && isSelected) {
-                Toast.makeText(context, errorMessage, Toast.LENGTH_SHORT).show()
-                return@Surface
-            }
-            if (isSelected) assetSelected.add(assetInfo) else assetSelected.remove(assetInfo)
-        },
+    Box(
         modifier = Modifier
             .padding(6.dp)
-            .size(size = size),
-        shape = CircleShape,
-        border = border,
-        color = color
+            .size(size)
+            .then(if (border == null) Modifier else Modifier.border(border, shape = CircleShape))
+            .background(color = color, shape = CircleShape)
+            .clickable {
+                val isSelected = !selected
+                if (onClicks != null) {
+                    onClicks(isSelected)
+                    return@clickable
+                }
+                if (assetSelected.size == maxAssets && isSelected) {
+                    Toast
+                        .makeText(context, errorMessage, Toast.LENGTH_SHORT)
+                        .show()
+                    return@clickable
+                }
+                if (isSelected) assetSelected.add(assetInfo) else assetSelected.remove(assetInfo)
+            },
+        contentAlignment = Alignment.Center
     ) {
-        Box(contentAlignment = Alignment.Center) {
-            if (selected) {
-                Text(
-                    text = "${assetSelected.indexOf(assetInfo) + 1}",
-                    color = Color.White,
-                    fontSize = fontSize,
-                )
-            }
+        if (selected) {
+            Text(
+                text = "${assetSelected.indexOf(assetInfo) + 1}",
+                color = Color.White,
+                fontSize = fontSize,
+            )
         }
     }
 }