DocumentScreen: make the image zoomable

app/build.gradle.kts

@@ -68,6 +68,7 @@ dependencies {
     implementation(libs.opencv)
     implementation(libs.pdfbox)
     implementation(libs.icons.extended)
+    implementation(libs.zoomable)
 
     testImplementation(libs.junit)
     testImplementation(libs.assertj)

app/src/main/java/org/mydomain/myscan/view/DocumentScreen.kt

@@ -33,7 +33,6 @@ import androidx.compose.foundation.layout.size
 import androidx.compose.foundation.layout.width
 import androidx.compose.foundation.lazy.LazyRow
 import androidx.compose.foundation.lazy.itemsIndexed
-import androidx.compose.foundation.shape.RoundedCornerShape
 import androidx.compose.material.icons.Icons
 import androidx.compose.material.icons.automirrored.filled.ArrowBack
 import androidx.compose.material.icons.filled.Add
@@ -54,17 +53,21 @@ import androidx.compose.material3.Text
 import androidx.compose.material3.TopAppBar
 import androidx.compose.material3.TopAppBarDefaults
 import androidx.compose.runtime.Composable
+import androidx.compose.runtime.LaunchedEffect
 import androidx.compose.runtime.MutableIntState
 import androidx.compose.runtime.MutableState
 import androidx.compose.runtime.mutableIntStateOf
 import androidx.compose.runtime.saveable.rememberSaveable
 import androidx.compose.ui.Alignment
 import androidx.compose.ui.Modifier
+import androidx.compose.ui.geometry.Size
 import androidx.compose.ui.graphics.Color
 import androidx.compose.ui.graphics.asImageBitmap
 import androidx.compose.ui.platform.LocalContext
 import androidx.compose.ui.tooling.preview.Preview
 import androidx.compose.ui.unit.dp
+import net.engawapg.lib.zoomable.rememberZoomState
+import net.engawapg.lib.zoomable.zoomable
 import org.mydomain.myscan.ui.theme.MyScanTheme
 
 @OptIn(ExperimentalMaterial3Api::class)
@@ -147,13 +150,21 @@ private fun DocumentPreview(
         Box (
             modifier = Modifier.fillMaxSize()
         ) {
-            // TODO Make it possible to zoom on the image
+            val bitmap = imageLoader(imageId)
+            val imageBitmap = bitmap.asImageBitmap()
+            val zoomState = rememberZoomState(
+                contentSize = Size(bitmap.width.toFloat(), bitmap.height.toFloat()))
+
+            LaunchedEffect(imageId) {
+                zoomState.reset()
+            }
             Image(
-                bitmap = imageLoader(imageId).asImageBitmap(),
+                bitmap = imageBitmap,
                 contentDescription = null,
                 modifier = Modifier
                     .padding(4.dp)
                     .align(Alignment.Center)
+                    .zoomable(zoomState)
             )
             SmallFloatingActionButton(
                 onClick = { onDeleteImage(imageId) },

gradle/libs.versions.toml

@@ -14,6 +14,7 @@ litert = "1.2.0"
 opencv = "4.11.0"
 assertj = "3.27.3"
 pdfbox = "2.0.27.0"
+zoomable = "2.8.0"
 
 [libraries]
 androidx-core-ktx = { group = "androidx.core", name = "core-ktx", version.ref = "coreKtx" }
@@ -43,6 +44,7 @@ litert-support = { group = "com.google.ai.edge.litert", name = "litert-support",
 litert-metadata = { group = "com.google.ai.edge.litert", name = "litert-metadata", version.ref = "litert" }
 opencv = { group="org.opencv", name="opencv", version.ref = "opencv" }
 pdfbox = { group = "com.tom-roush", name = "pdfbox-android", version.ref = "pdfbox" }
+zoomable = { group = "net.engawapg.lib", name = "zoomable", version.ref = "zoomable" }
 
 assertj =  { group="org.assertj", name="assertj-core", version.ref = "assertj" }