app: Show original image when click on the little image

YuKongA · Jun 18, 2024 · f2aa70a · f2aa70a
1 parent 876c116
commit f2aa70a
Show file tree

Hide file tree

Showing 6 changed files with 52 additions and 8 deletions.
diff --git a/app/src/main/kotlin/top/yukonga/hq_icon/MainActivity.kt b/app/src/main/kotlin/top/yukonga/hq_icon/MainActivity.kt
@@ -2,6 +2,7 @@ package top.yukonga.hq_icon
 
 import android.os.Build
 import android.os.Bundle
+import android.widget.Toast
 import androidx.activity.ComponentActivity
 import androidx.activity.compose.setContent
 import androidx.activity.enableEdgeToEdge
@@ -82,7 +83,7 @@ class MainActivity : ComponentActivity() {
 fun App() {
     val scrollBehavior = TopAppBarDefaults.exitUntilCollapsedScrollBehavior(rememberTopAppBarState())
     val fabOffsetHeight by animateDpAsState(
-        targetValue = if (scrollBehavior.state.contentOffset < 0) 80.dp + WindowInsets.navigationBars.asPaddingValues().calculateBottomPadding() else 0.dp,
+        targetValue = if (scrollBehavior.state.contentOffset < -35) 80.dp + WindowInsets.navigationBars.asPaddingValues().calculateBottomPadding() else 0.dp,
         animationSpec = tween(durationMillis = 300),
         label = ""
     )
@@ -157,10 +158,12 @@ private fun FloatActionButton(
 ) {
     val coroutineScope = rememberCoroutineScope()
     val hapticFeedback = LocalHapticFeedback.current
+    val searching = stringResource(R.string.searching)
 
     ExtendedFloatingActionButton(
         modifier = Modifier.offset(y = fabOffsetHeight),
         onClick = {
+            Toast.makeText(AppContext.context, searching, Toast.LENGTH_SHORT).show()
             hapticFeedback.performHapticFeedback(HapticFeedbackType.LongPress)
             coroutineScope.launch {
                 if (term.value != "") {

diff --git a/app/src/main/kotlin/top/yukonga/hq_icon/ui/components/ResultsView.kt b/app/src/main/kotlin/top/yukonga/hq_icon/ui/components/ResultsView.kt
@@ -9,14 +9,17 @@ import androidx.compose.animation.shrinkVertically
 import androidx.compose.foundation.Image
 import androidx.compose.foundation.clickable
 import androidx.compose.foundation.horizontalScroll
+import androidx.compose.foundation.layout.Box
 import androidx.compose.foundation.layout.Column
 import androidx.compose.foundation.layout.Row
 import androidx.compose.foundation.layout.padding
 import androidx.compose.foundation.layout.size
 import androidx.compose.foundation.rememberScrollState
 import androidx.compose.foundation.shape.RoundedCornerShape
+import androidx.compose.material3.BasicAlertDialog
 import androidx.compose.material3.Card
 import androidx.compose.material3.CardDefaults
+import androidx.compose.material3.ExperimentalMaterial3Api
 import androidx.compose.material3.MaterialTheme
 import androidx.compose.material3.Text
 import androidx.compose.runtime.Composable
@@ -36,6 +39,7 @@ import androidx.compose.ui.res.stringResource
 import androidx.compose.ui.text.TextStyle
 import androidx.compose.ui.text.font.FontWeight
 import androidx.compose.ui.unit.dp
+import androidx.compose.ui.window.DialogProperties
 import kotlinx.coroutines.delay
 import kotlinx.coroutines.launch
 import top.yukonga.hq_icon.R
@@ -52,9 +56,11 @@ fun ResultsView(results: List<Response.Result>, corner: String, resolution: Stri
     }
 }
 
+@OptIn(ExperimentalMaterial3Api::class)
 @Composable
 fun ResultItemView(result: Response.Result, corner: String, resolution: String) {
     val isVisible = remember { mutableStateOf(false) }
+    val isDialogOpen = remember { mutableStateOf(false) }
     val coroutineScope = rememberCoroutineScope()
     val context = LocalContext.current
     val hapticFeedback = LocalHapticFeedback.current
@@ -65,20 +71,28 @@ fun ResultItemView(result: Response.Result, corner: String, resolution: String)
         exit = fadeOut() + shrinkVertically()
     ) {
         Card(
-            modifier = Modifier.padding(bottom = 20.dp),
+            modifier = Modifier
+                .padding(bottom = 20.dp),
             shape = RoundedCornerShape(10.dp),
             colors = CardDefaults.cardColors(
                 contentColor = MaterialTheme.colorScheme.onPrimaryContainer,
                 containerColor = MaterialTheme.colorScheme.primaryContainer
             )
         ) {
             Row(
-                modifier = Modifier.padding(16.dp),
+                modifier = Modifier
+                    .padding(16.dp),
                 verticalAlignment = Alignment.CenterVertically
             ) {
                 Image(
-                    modifier = Modifier.size(58.dp),
-                    bitmap = networkImage(url = result.artworkUrl512, corner = corner),
+                    modifier = Modifier
+                        .size(58.dp)
+                        .clickable { isDialogOpen.value = true },
+                    bitmap = networkImage(
+                        url = result.artworkUrl512,
+                        corner = corner,
+                        resolution = resolution.toInt()
+                    ),
                     contentDescription = null
                 )
                 Column(
@@ -122,6 +136,28 @@ fun ResultItemView(result: Response.Result, corner: String, resolution: String)
             }
         }
     }
+
+    if (isDialogOpen.value) {
+        BasicAlertDialog(
+            onDismissRequest = { isDialogOpen.value = false },
+            properties = DialogProperties(usePlatformDefaultWidth = false),
+            content = {
+                Box(
+                    contentAlignment = Alignment.Center
+                ) {
+                    Image(
+                        bitmap = networkImage(
+                            url = result.artworkUrl512,
+                            corner = corner,
+                            resolution = resolution.toInt()
+                        ),
+                        contentDescription = null
+                    )
+                }
+            }
+        )
+    }
+
     LaunchedEffect(result) {
         isVisible.value = false
         delay(300)
@@ -142,13 +178,14 @@ fun MessageText(text: String, style: TextStyle) {
 }
 
 @Composable
-fun networkImage(url: String, corner: String): ImageBitmap {
-    val bitmapState: MutableState<Bitmap> = remember { mutableStateOf(Bitmap.createBitmap(512, 512, Bitmap.Config.ARGB_8888)) }
+fun networkImage(url: String, corner: String, resolution: Int): ImageBitmap {
+    val bitmapState: MutableState<Bitmap> = remember { mutableStateOf(Bitmap.createBitmap(resolution, resolution, Bitmap.Config.ARGB_8888)) }
+    val realUrl = url.replace("512x512bb.jpg", "${resolution}x${resolution}bb.png")
     val coroutineScope = rememberCoroutineScope()
 
     LaunchedEffect(url, corner) {
         coroutineScope.launch {
-            bitmapState.value = LoadIcon().loadIcon(url)
+            bitmapState.value = LoadIcon().loadIcon(realUrl)
             bitmapState.value = LoadIcon().roundCorners(bitmapState.value, corner)
         }
     }

diff --git a/app/src/main/res/values-zh-rCN/strings.xml b/app/src/main/res/values-zh-rCN/strings.xml
@@ -11,4 +11,5 @@
     <string name="download">下载</string>
     <string name="download_successful">下载成功</string>
     <string name="download_failed">下载失败</string>
+    <string name="searching">开始搜索…</string>
 </resources>
diff --git a/app/src/main/res/values-zh-rHK/strings.xml b/app/src/main/res/values-zh-rHK/strings.xml
@@ -11,4 +11,5 @@
     <string name="download">下載</string>
     <string name="download_successful">下載成功</string>
     <string name="download_failed">下載失敗</string>
+    <string name="searching">開始搜索…</string>
 </resources>
diff --git a/app/src/main/res/values-zh-rTW/strings.xml b/app/src/main/res/values-zh-rTW/strings.xml
@@ -11,4 +11,5 @@
     <string name="download">下載</string>
     <string name="download_successful">下載成功</string>
     <string name="download_failed">下載失敗</string>
+    <string name="searching">開始搜索…</string>
 </resources>
diff --git a/app/src/main/res/values/strings.xml b/app/src/main/res/values/strings.xml
@@ -12,4 +12,5 @@
     <string name="download">Download</string>
     <string name="download_successful">Download successful</string>
     <string name="download_failed">Download failed</string>
+    <string name="searching">Searching…</string>
 </resources>