Improve TraceLocations transitions (DEV) (corona-warn-app#2769)

* Improve transition * Animate to poster * From Home to TraceLocations * Fix merge issue * lint Co-authored-by: harambasicluka <64483219+harambasicluka@users.noreply.github.com>
fynngodau · Apr 10, 2021 · 7f6c224 · 7f6c224
1 parent 566ed91
commit 7f6c224
Show file tree

Hide file tree

Showing 7 changed files with 57 additions and 11 deletions.
diff --git a/.../java/de/rki/coronawarnapp/ui/eventregistration/organizer/details/QrCodeDetailFragment.kt b/.../java/de/rki/coronawarnapp/ui/eventregistration/organizer/details/QrCodeDetailFragment.kt
@@ -12,6 +12,7 @@ import androidx.navigation.fragment.navArgs
 import com.google.android.material.appbar.AppBarLayout
 import com.google.android.material.appbar.AppBarLayout.OnOffsetChangedListener
 import com.google.android.material.transition.MaterialContainerTransform
+import com.google.android.material.transition.MaterialSharedAxis
 import de.rki.coronawarnapp.R
 import de.rki.coronawarnapp.databinding.TraceLocationOrganizerQrCodeDetailFragmentBinding
 import de.rki.coronawarnapp.util.ContextExtensions.getDrawableCompat
@@ -72,8 +73,13 @@ class QrCodeDetailFragment : Fragment(R.layout.trace_location_organizer_qr_code_
             }
 
             qrCodePrintButton.setOnClickListener {
+                exitTransition = MaterialSharedAxis(MaterialSharedAxis.Z, true)
+                reenterTransition = MaterialSharedAxis(MaterialSharedAxis.Z, false)
+
                 viewModel.onPrintQrCode()
             }
+
+            root.transitionName = navArgs.traceLocationId.toString()
         }
 
         viewModel.qrCodeBitmap.observe2(this) {

diff --git a/...n/java/de/rki/coronawarnapp/ui/eventregistration/organizer/list/TraceLocationsFragment.kt b/...n/java/de/rki/coronawarnapp/ui/eventregistration/organizer/list/TraceLocationsFragment.kt
@@ -11,6 +11,7 @@ import androidx.navigation.NavOptions
 import androidx.navigation.fragment.FragmentNavigatorExtras
 import androidx.navigation.fragment.findNavController
 import com.google.android.material.transition.Hold
+import com.google.android.material.transition.MaterialSharedAxis
 import de.rki.coronawarnapp.R
 import de.rki.coronawarnapp.databinding.TraceLocationOrganizerTraceLocationsListFragmentBinding
 import de.rki.coronawarnapp.eventregistration.checkins.qrcode.TraceLocation
@@ -42,7 +43,9 @@ class TraceLocationsFragment : Fragment(R.layout.trace_location_organizer_trace_
 
     override fun onCreate(savedInstanceState: Bundle?) {
         super.onCreate(savedInstanceState)
-        exitTransition = Hold()
+
+        enterTransition = MaterialSharedAxis(MaterialSharedAxis.Z, true)
+        returnTransition = MaterialSharedAxis(MaterialSharedAxis.Z, false)
     }
 
     override fun onViewCreated(view: View, savedInstanceState: Bundle?) {
@@ -84,11 +87,9 @@ class TraceLocationsFragment : Fragment(R.layout.trace_location_organizer_trace_
                     showDeleteSingleDialog(it.traceLocation, it.position)
                 }
                 is TraceLocationEvent.StartQrCodeDetailFragment -> {
-
+                    setupHoldTransition()
                     val navigatorExtras = binding.recyclerView.findViewHolderForAdapterPosition(it.position)?.itemView
                         ?.run {
-                            // Set it on the fly to avoid confusion of recycler's items
-                            this.transitionName = "trace_location_container_transition"
                             FragmentNavigatorExtras(this to this.transitionName)
                         }
 
@@ -100,13 +101,19 @@ class TraceLocationsFragment : Fragment(R.layout.trace_location_organizer_trace_
                     )
                 }
                 is TraceLocationEvent.DuplicateItem -> {
+                    setupAxisTransition()
                     openCreateEventFragment(it.traceLocation)
                 }
-                is TraceLocationEvent.StartQrCodePosterFragment -> doNavigate(
-                    TraceLocationsFragmentDirections.actionTraceLocationsFragmentToQrCodePosterFragment(
-                        it.traceLocation.id
+                is TraceLocationEvent.StartQrCodePosterFragment -> {
+                    setupAxisTransition()
+                    doNavigate(
+
+                        TraceLocationsFragmentDirections.actionTraceLocationsFragmentToQrCodePosterFragment(
+                            it.traceLocation.id
+                        )
                     )
-                )
+                }
+
                 is TraceLocationEvent.SelfCheckIn -> {
                     findNavController().navigate(
                         CheckInsFragment.createCheckInUri(it.traceLocation.locationUrl),
@@ -120,6 +127,7 @@ class TraceLocationsFragment : Fragment(R.layout.trace_location_organizer_trace_
 
         binding.qrCodeFab.apply {
             setOnClickListener {
+                setupHoldTransition()
                 findNavController().navigate(
                     R.id.action_traceLocationsFragment_to_traceLocationCategoryFragment,
                     null,
@@ -130,6 +138,16 @@ class TraceLocationsFragment : Fragment(R.layout.trace_location_organizer_trace_
         }
     }
 
+    private fun setupHoldTransition() {
+        exitTransition = Hold()
+        reenterTransition = Hold()
+    }
+
+    private fun setupAxisTransition() {
+        exitTransition = MaterialSharedAxis(MaterialSharedAxis.Z, true)
+        reenterTransition = MaterialSharedAxis(MaterialSharedAxis.Z, false)
+    }
+
     override fun onResume() {
         super.onResume()
         binding.contentContainer.sendAccessibilityEvent(AccessibilityEvent.TYPE_ANNOUNCEMENT)
@@ -140,6 +158,7 @@ class TraceLocationsFragment : Fragment(R.layout.trace_location_organizer_trace_
         setOnMenuItemClickListener {
             when (it.itemId) {
                 R.id.menu_information -> {
+                    setupAxisTransition()
                     findNavController().navigate(
                         R.id.action_traceLocationOrganizerListFragment_to_traceLocationInfoFragment
                     )

diff --git a/...in/java/de/rki/coronawarnapp/ui/eventregistration/organizer/list/items/TraceLocationVH.kt b/...in/java/de/rki/coronawarnapp/ui/eventregistration/organizer/list/items/TraceLocationVH.kt
@@ -65,7 +65,10 @@ class TraceLocationVH(parent: ViewGroup) :
 
         checkinAction.isVisible = item.canCheckIn
         checkinAction.setOnClickListener { item.onCheckIn(item.traceLocation) }
-        itemView.setOnClickListener { item.onCardClicked(item.traceLocation, adapterPosition) }
+        itemView.apply {
+            setOnClickListener { item.onCardClicked(item.traceLocation, adapterPosition) }
+            transitionName = item.traceLocation.id.toString()
+        }
     }
 
     data class Item(

diff --git a/...n/java/de/rki/coronawarnapp/ui/eventregistration/organizer/poster/QrCodePosterFragment.kt b/...n/java/de/rki/coronawarnapp/ui/eventregistration/organizer/poster/QrCodePosterFragment.kt
@@ -12,6 +12,7 @@ import androidx.core.content.getSystemService
 import androidx.core.widget.TextViewCompat
 import androidx.fragment.app.Fragment
 import androidx.navigation.fragment.navArgs
+import com.google.android.material.transition.MaterialSharedAxis
 import de.rki.coronawarnapp.R
 import de.rki.coronawarnapp.databinding.QrCodePosterFragmentBinding
 import de.rki.coronawarnapp.exception.ExceptionCategory
@@ -44,6 +45,13 @@ class QrCodePosterFragment : Fragment(R.layout.qr_code_poster_fragment), AutoInj
 
     private val binding: QrCodePosterFragmentBinding by viewBindingLazy()
 
+    override fun onCreate(savedInstanceState: Bundle?) {
+        super.onCreate(savedInstanceState)
+
+        enterTransition = MaterialSharedAxis(MaterialSharedAxis.Z, true)
+        returnTransition = MaterialSharedAxis(MaterialSharedAxis.Z, false)
+    }
+
     override fun onViewCreated(view: View, savedInstanceState: Bundle?) {
         super.onViewCreated(view, savedInstanceState)
 

diff --git a/...de/rki/coronawarnapp/ui/eventregistration/organizer/qrinfo/TraceLocationQRInfoFragment.kt b/...de/rki/coronawarnapp/ui/eventregistration/organizer/qrinfo/TraceLocationQRInfoFragment.kt
@@ -5,6 +5,7 @@ import android.view.View
 import androidx.core.net.toUri
 import androidx.fragment.app.Fragment
 import androidx.navigation.fragment.findNavController
+import com.google.android.material.transition.MaterialSharedAxis
 import de.rki.coronawarnapp.R
 import de.rki.coronawarnapp.databinding.TraceLocationOrganizerQrCodeInfoFragmentBinding
 import de.rki.coronawarnapp.ui.eventregistration.organizer.TraceLocationOrganizerSettings
@@ -26,6 +27,13 @@ class TraceLocationQRInfoFragment : Fragment(R.layout.trace_location_organizer_q
     @Inject lateinit var viewModelFactory: CWAViewModelFactoryProvider.Factory
     private val vm: TraceLocationQRInfoViewModel by cwaViewModels { viewModelFactory }
 
+    override fun onCreate(savedInstanceState: Bundle?) {
+        super.onCreate(savedInstanceState)
+
+        enterTransition = MaterialSharedAxis(MaterialSharedAxis.Z, true)
+        returnTransition = MaterialSharedAxis(MaterialSharedAxis.Z, false)
+    }
+
     override fun onViewCreated(view: View, savedInstanceState: Bundle?) {
         super.onViewCreated(view, savedInstanceState)
         binding.apply {

diff --git a/Corona-Warn-App/src/main/res/layout/trace_location_organizer_qr_code_info_fragment.xml b/Corona-Warn-App/src/main/res/layout/trace_location_organizer_qr_code_info_fragment.xml
@@ -5,6 +5,7 @@
     android:layout_width="match_parent"
     android:layout_height="match_parent"
     android:contentDescription="@string/tracelocation_organizer_category_title"
+    android:background="@color/colorBackground"
     tools:context=".ui.eventregistration.organizer.qrinfo.TraceLocationQRInfoFragment">
 
     <com.google.android.material.appbar.MaterialToolbar
@@ -133,7 +134,7 @@
                 android:text="@string/trace_location_qr_info_time_text"
                 app:layout_constraintTop_toTopOf="@id/trace_location_qr_time_sheet_icon"
                 app:layout_constraintStart_toEndOf="@id/trace_location_qr_time_sheet_icon"
-                app:layout_constraintEnd_toEndOf="parent"/>
+                app:layout_constraintEnd_toEndOf="parent" />
 
             <include
                 android:id="@+id/privacy_card"
@@ -160,7 +161,7 @@
                 app:layout_constraintTop_toBottomOf="@id/privacy_card"
                 app:layout_constraintStart_toStartOf="parent"
                 app:layout_constraintEnd_toEndOf="parent"
-                app:layout_constraintBottom_toBottomOf="parent"/>
+                app:layout_constraintBottom_toBottomOf="parent" />
 
         </androidx.constraintlayout.widget.ConstraintLayout>
     </ScrollView>

diff --git a/...a-Warn-App/src/main/res/layout/trace_location_organizer_trace_locations_list_fragment.xml b/...a-Warn-App/src/main/res/layout/trace_location_organizer_trace_locations_list_fragment.xml
@@ -5,6 +5,7 @@
     android:id="@+id/content_container"
     android:layout_width="match_parent"
     android:layout_height="match_parent"
+    android:background="@color/colorBackground"
     android:focusable="true">
 
     <com.google.android.material.appbar.MaterialToolbar