Added image transition effects in module:feature:avengers

feature/avengers/src/main/java/com/turtle/multimodulehilt/feature/avengers/AvengersAdapter.kt

@@ -1,6 +1,7 @@
 package com.turtle.multimodulehilt.feature.avengers
 
 import android.view.LayoutInflater
+import android.view.View
 import android.view.ViewGroup
 import androidx.recyclerview.widget.DiffUtil
 import androidx.recyclerview.widget.ListAdapter
@@ -9,7 +10,7 @@ import com.turtle.multimodulehilt.feature.avengers.databinding.ListItemHeroBindi
 import javax.inject.Inject
 
 class AvengersAdapter constructor(
-    private val onHeroClick: (Hero) -> Unit
+    private val onHeroClick: (View, Hero) -> Unit
 ) :
     ListAdapter<Hero, AvengersViewHolder>(AvengersDiffCallback()) {
 

feature/avengers/src/main/java/com/turtle/multimodulehilt/feature/avengers/AvengersDetailFragment.kt

@@ -1,7 +1,18 @@
 package com.turtle.multimodulehilt.feature.avengers
 
+import android.graphics.drawable.Drawable
+import android.os.Bundle
+import android.transition.TransitionInflater
+import android.view.LayoutInflater
+import android.view.View
+import android.view.ViewGroup
+import androidx.core.app.SharedElementCallback
 import androidx.navigation.fragment.navArgs
 import com.bumptech.glide.Glide
+import com.bumptech.glide.load.DataSource
+import com.bumptech.glide.load.engine.GlideException
+import com.bumptech.glide.request.RequestListener
+import com.bumptech.glide.request.target.Target
 import com.turtle.multimodulehilt.core.common.base.BaseFragment
 import com.turtle.multimodulehilt.core.model.Hero
 import com.turtle.multimodulehilt.feature.avengers.databinding.FragmentAvengersDetailBinding
@@ -16,12 +27,20 @@ class AvengersDetailFragment :
         args.hero
     }
 
+    override fun onCreateView(
+        inflater: LayoutInflater,
+        container: ViewGroup?,
+        savedInstanceState: Bundle?,
+    ): View {
+        sharedElementEnterTransition = TransitionInflater.from(context).inflateTransition(R.transition.shared_image)
+        return super.onCreateView(inflater, container, savedInstanceState)
+    }
+
     // TODO: 공유 요소를 사용하여 이미지뷰를 출력
     override fun init() {
+        binding.imageviewAvengersDetailFragmentCenter.transitionName = args.hero.id.toString()
         Glide.with(binding.imageviewAvengersDetailFragmentCenter)
             .load("${hero.thumbnail.path}.${hero.thumbnail.extension}")
-            .error(R.drawable.whoishe)
-            .placeholder(R.drawable.whoishe)
             .into(binding.imageviewAvengersDetailFragmentCenter)
     }
 

feature/avengers/src/main/java/com/turtle/multimodulehilt/feature/avengers/AvengersFragment.kt

@@ -1,25 +1,31 @@
 package com.turtle.multimodulehilt.feature.avengers
 
+import android.view.View
+import android.view.ViewGroup
+import androidx.core.view.ViewCompat
+import androidx.core.view.doOnPreDraw
 import androidx.fragment.app.viewModels
+import androidx.navigation.fragment.FragmentNavigatorExtras
 import androidx.navigation.fragment.findNavController
+import com.bumptech.glide.Glide
 import com.turtle.multimodulehilt.core.common.base.BaseFragment
 import com.turtle.multimodulehilt.core.common.base.EventObserver
 import com.turtle.multimodulehilt.core.model.Hero
 import com.turtle.multimodulehilt.feature.avengers.databinding.FragmentAvengersBinding
 import dagger.hilt.android.AndroidEntryPoint
-import javax.inject.Inject
 
 @AndroidEntryPoint
 class AvengersFragment : BaseFragment<FragmentAvengersBinding>(R.layout.fragment_avengers) {
 
     lateinit var avengersAdapter: AvengersAdapter
 
     private val viewModel: AvengersViewModel by viewModels()
+    lateinit var listOfHero: List<Hero>
 
     override fun init() {
         avengersAdapter = AvengersAdapter(
-            onHeroClick = {
-                navigateToAvengersDetail(it)
+            onHeroClick = { view: View, hero: Hero ->
+                navigateToAvengersDetail(view, hero)
             }
         )
         binding.recyclerviewHeroHeroList.adapter = avengersAdapter
@@ -37,8 +43,10 @@ class AvengersFragment : BaseFragment<FragmentAvengersBinding>(R.layout.fragment
         })
     }
 
-    fun navigateToAvengersDetail(hero: Hero){
-        val direction = AvengersFragmentDirections.actionAvengersFragmentToAvengersDetailFragment(hero)
-        findNavController().navigate(direction)
+    fun navigateToAvengersDetail(view: View, hero: Hero){
+        val actions = AvengersFragmentDirections.actionAvengersFragmentToAvengersDetailFragment(hero)
+        ViewCompat.setTransitionName(view, hero.id.toString())
+        val extras = FragmentNavigatorExtras(view to view.transitionName)
+        findNavController().navigate(actions, extras)
     }
 }

feature/avengers/src/main/java/com/turtle/multimodulehilt/feature/avengers/AvengersViewHolder.kt

@@ -1,5 +1,6 @@
 package com.turtle.multimodulehilt.feature.avengers
 
+import android.view.View
 import androidx.recyclerview.widget.RecyclerView
 import com.bumptech.glide.Glide
 import com.turtle.multimodulehilt.core.model.Hero
@@ -9,7 +10,7 @@ class AvengersViewHolder(
     private val binding: ListItemHeroBinding,
 ) : RecyclerView.ViewHolder(binding.root) {
 
-    fun bind(onHeroClick: (Hero) -> Unit, item: Hero) {
+    fun bind(onHeroClick: (View, Hero) -> Unit, item: Hero) {
         binding.apply {
             hero = item
             Glide.with(listItemHeroImgView)
@@ -18,7 +19,7 @@ class AvengersViewHolder(
                 .placeholder(R.drawable.whoishe)
                 .into(listItemHeroImgView)
             listItemHeroImgView.setOnClickListener {
-                onHeroClick(item)
+                onHeroClick(listItemHeroImgView, item)
             }
         }
     }

feature/avengers/src/main/res/layout/fragment_avengers_detail.xml

@@ -11,11 +11,12 @@
         <ImageView
             android:id="@+id/imageview_avengers_detail_fragment_center"
             android:layout_width="0dp"
-            android:layout_height="0dp"
+            android:layout_height="250dp"
+            android:scaleType="fitXY"
+            app:layout_constraintTop_toTopOf="parent"
             app:layout_constraintStart_toStartOf="parent"
             app:layout_constraintEnd_toEndOf="parent"
-            app:layout_constraintTop_toTopOf="parent"
-            app:layout_constraintBottom_toBottomOf="parent"/>
+            tools:src="@drawable/whoishe"/>
 
     </androidx.constraintlayout.widget.ConstraintLayout>
 

feature/avengers/src/main/res/transition/shared_image.xml

@@ -0,0 +1,26 @@
+<?xml version="1.0" encoding="utf-8"?>
+<!--
+  ~ Copyright 2018 Google LLC
+  ~
+  ~ Licensed under the Apache License, Version 2.0 (the "License");
+  ~ you may not use this file except in compliance with the License.
+  ~ You may obtain a copy of the License at
+  ~
+  ~     https://www.apache.org/licenses/LICENSE-2.0
+  ~
+  ~ Unless required by applicable law or agreed to in writing, software
+  ~ distributed under the License is distributed on an "AS IS" BASIS,
+  ~ WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+  ~ See the License for the specific language governing permissions and
+  ~ limitations under the License.
+  -->
+
+<transitionSet
+    xmlns:android="http://schemas.android.com/apk/res/android"
+    android:duration="500"
+    android:interpolator="@android:interpolator/fast_out_slow_in"
+    android:transitionOrdering="together">
+    <changeClipBounds/>
+    <changeTransform/>
+    <changeBounds/>
+</transitionSet>