app/build.gradle

@@ -51,5 +51,5 @@ dependencies {
     implementation "com.github.skydoves:landscapist-coil:$landscapist_version"
     implementation "com.github.skydoves:landscapist-placeholder:$landscapist_version"
 
-    implementation "me.saket.telephoto:zoomable-image-coil:0.8.0"
+    implementation "me.saket.telephoto:zoomable:0.6.2"
 }

app/src/main/kotlin/io/getstream/androiddeveloperroadmap/MainActivity.kt

@@ -24,9 +24,16 @@ import androidx.compose.material.MaterialTheme
 import androidx.compose.material.Surface
 import androidx.compose.runtime.Composable
 import androidx.compose.ui.Modifier
+import androidx.compose.ui.layout.ContentScale
 import androidx.compose.ui.tooling.preview.Preview
+import com.skydoves.landscapist.ImageOptions
+import com.skydoves.landscapist.coil.CoilImage
+import com.skydoves.landscapist.components.rememberImageComponent
+import com.skydoves.landscapist.placeholder.shimmer.ShimmerPlugin
 import io.getstream.androiddeveloperroadmap.ui.theme.AndroidDeveloperRoadmapTheme
-import me.saket.telephoto.zoomable.coil.ZoomableAsyncImage
+import io.getstream.androiddeveloperroadmap.ui.theme.shimmerHighLight
+import me.saket.telephoto.zoomable.rememberZoomableState
+import me.saket.telephoto.zoomable.zoomable
 
 class MainActivity : ComponentActivity() {
   override fun onCreate(savedInstanceState: Bundle?) {
@@ -46,10 +53,20 @@ class MainActivity : ComponentActivity() {
 
 @Composable
 private fun AndroidRoadmap() {
-  ZoomableAsyncImage(
+  val background = MaterialTheme.colors.background
-    modifier = Modifier.fillMaxSize(),
+  CoilImage(
-    model = "https://user-images.githubusercontent.com/24237865/144350753-5a52e6e5-3517-476c-8e5c-adad919abe8e.png",
+    modifier = Modifier
-    contentDescription = null
+      .fillMaxSize()
+      .zoomable(rememberZoomableState()),
+    imageModel = { "https://user-images.githubusercontent.com/24237865/144350753-5a52e6e5-3517-476c-8e5c-adad919abe8e.png" },
+    component = rememberImageComponent {
+      // shows a shimmering effect when loading an image.
+      +ShimmerPlugin(
+        baseColor = background,
+        highlightColor = shimmerHighLight
+      )
+    },
+    imageOptions = ImageOptions(contentScale = ContentScale.Fit)
   )
 }
 

build.gradle

@@ -1,15 +1,16 @@
 buildscript {
     ext {
-        compose_version = '1.6.1'
+        compose_version = '1.5.2'
-        compose_compiler_version = '1.5.9'
+        compose_compiler_version = '1.5.3'
         compose_activity_version = '1.7.2'
-        landscapist_version = '2.3.1'
+        landscapist_version = '2.2.10'
+        zoomable_version = '1.5.1'
     }
 }
 
 plugins {
     id 'com.android.application' version '8.1.2' apply false
-    id 'org.jetbrains.kotlin.android' version '1.9.22' apply false
+    id 'org.jetbrains.kotlin.android' version '1.9.10' apply false
     id "com.diffplug.spotless" version "6.7.0" apply false
 }