adding zoom image in details

Author: Hcnc100

.idea/deploymentTargetDropDown.xml

@@ -159,5 +159,9 @@ dependencies {
     implementation 'com.github.CanHub:Android-Image-Cropper:4.3.2'
 
 
+    implementation("io.coil-kt:coil:2.2.2")
+    implementation 'com.jsibbold:zoomage:1.3.1'
+
+
 }
 

app/build.gradle

@@ -0,0 +1,25 @@
+package com.nullpointer.blogcompose.ui.screens
+
+import android.view.ViewGroup.LayoutParams.MATCH_PARENT
+import android.widget.LinearLayout
+import androidx.compose.runtime.Composable
+import androidx.compose.ui.viewinterop.AndroidView
+import coil.load
+import com.jsibbold.zoomage.ZoomageView
+import com.nullpointer.blogcompose.ui.navigation.MainNavGraph
+import com.ramcosta.composedestinations.annotation.Destination
+
+@MainNavGraph
+@Destination
+@Composable
+fun ZoomScreen(
+    urlImg: String
+) {
+    AndroidView(factory = {
+        ZoomageView(it).apply {
+            layoutParams = LinearLayout.LayoutParams(MATCH_PARENT, MATCH_PARENT)
+            load(urlImg)
+        }
+    })
+
+}

app/src/main/java/com/nullpointer/blogcompose/ui/screens/Zoom.kt

@@ -1,5 +1,5 @@
 package com.nullpointer.blogcompose.ui.screens.details
 
 enum class ActionDetails {
-    LIKE_THIS_POST, GET_MORE_COMMENTS, RELOAD_COMMENTS, ACTION_BACK, SEND_COMMENT
+    LIKE_THIS_POST, GET_MORE_COMMENTS, RELOAD_COMMENTS, ACTION_BACK, SEND_COMMENT, ZOOM_IMAGE
 }

app/src/main/java/com/nullpointer/blogcompose/ui/screens/details/ActionDetails.kt

@@ -26,6 +26,7 @@ import com.nullpointer.blogcompose.presentation.LikeViewModel
 import com.nullpointer.blogcompose.presentation.PostDetailsViewModel
 import com.nullpointer.blogcompose.ui.interfaces.ActionRootDestinations
 import com.nullpointer.blogcompose.ui.navigation.MainNavGraph
+import com.nullpointer.blogcompose.ui.screens.destinations.ZoomScreenDestination
 import com.nullpointer.blogcompose.ui.screens.details.ActionDetails.*
 import com.nullpointer.blogcompose.ui.screens.details.componets.items.post.ErrorDetailsPost
 import com.nullpointer.blogcompose.ui.screens.details.componets.items.post.LoadDetailsPost
@@ -103,9 +104,14 @@ fun PostDetails(
                 RELOAD_COMMENTS -> postDetailsViewModel.requestsComments()
                 GET_MORE_COMMENTS -> postDetailsViewModel.concatenateComments()
                 SEND_COMMENT -> postDetailsViewModel.addComment(postDetailsState::scrollToLastItem)
+                ZOOM_IMAGE -> {
+                    (postState as? Resource.Success)?.let { postState ->
+                        actionRootDestinations.changeRoot(ZoomScreenDestination(postState.data.urlImage))
+                    }
+                }
                 LIKE_THIS_POST -> {
-                    (postState as? Resource.Success)?.let { state ->
-                        likeViewModel.likePost(simplePost = state.data)
+                    (postState as? Resource.Success)?.let { postState ->
+                        likeViewModel.likePost(simplePost = postState.data)
                     }
                 }
             }
@@ -164,7 +170,9 @@ fun PostDetails(
                     Resource.Loading -> LoadDetailsPost(shimmer = shimmer)
                     is Resource.Success -> SuccessDetailsPost(
                         blog = statePostDetails.data,
-                        actionLike = { actionPostDetails(LIKE_THIS_POST) })
+                        actionLike = { actionPostDetails(LIKE_THIS_POST) },
+                        actionZoomImage = { actionPostDetails(ZOOM_IMAGE) }
+                    )
                 }
             }
         }

app/src/main/java/com/nullpointer/blogcompose/ui/screens/details/PostDetails.kt

@@ -20,8 +20,9 @@ import com.nullpointer.blogcompose.ui.share.SimpleImage
 @Composable
 fun SuccessDetailsPost(
     blog: Post,
-    modifier: Modifier = Modifier,
-    actionLike: () -> Unit
+    actionLike: () -> Unit,
+    actionZoomImage: () -> Unit,
+    modifier: Modifier = Modifier
 ) {
     BoxWithConstraints {
         val width = this.maxWidth
@@ -38,7 +39,9 @@ fun SuccessDetailsPost(
                 sizeImage = width,
                 image = blog.urlImage,
                 contentDescription = stringResource(id = R.string.description_img_post),
-                isCircular = false
+                isCircular = false,
+                modifier = Modifier
+                    .clickable { actionZoomImage() }
             )
             ActionDetailsBlog(
                 isLiked = blog.ownerLike,

app/src/main/java/com/nullpointer/blogcompose/ui/screens/details/componets/items/post/SuccessDetailsPost.kt

@@ -4,8 +4,8 @@ buildscript {
     }
 }// Top-level build file where you can add configuration options common to all sub-projects/modules.
 plugins {
-    id 'com.android.application' version '7.3.0' apply false
-    id 'com.android.library' version '7.3.0' apply false
+    id 'com.android.application' version '7.3.1' apply false
+    id 'com.android.library' version '7.3.1' apply false
     id 'org.jetbrains.kotlin.android' version '1.7.0' apply false
     id 'com.google.gms.google-services' version '4.3.14' apply false
 }