Add material fab transition

app/src/main/java/org/koitharu/kotatsu/main/ui/MainActivity.kt

@@ -1,11 +1,11 @@
 package org.koitharu.kotatsu.main.ui
 
-import android.app.ActivityOptions
 import android.content.res.Configuration
 import android.os.Bundle
 import android.view.MenuItem
 import android.view.View
 import android.view.ViewGroup.MarginLayoutParams
+import android.view.Window
 import androidx.activity.result.ActivityResultCallback
 import androidx.appcompat.app.ActionBarDrawerToggle
 import androidx.appcompat.view.ActionMode
@@ -22,8 +22,10 @@ import androidx.transition.TransitionManager
 import com.google.android.material.appbar.AppBarLayout
 import com.google.android.material.appbar.AppBarLayout.LayoutParams.*
 import com.google.android.material.dialog.MaterialAlertDialogBuilder
+import com.google.android.material.floatingactionbutton.ExtendedFloatingActionButton
 import com.google.android.material.navigation.NavigationView
 import com.google.android.material.snackbar.Snackbar
+import com.google.android.material.transition.platform.MaterialContainerTransformSharedElementCallback
 import kotlinx.coroutines.Dispatchers
 import kotlinx.coroutines.withContext
 import org.koin.android.ext.android.get
@@ -78,12 +80,18 @@ class MainActivity :
 	private lateinit var navHeaderBinding: NavigationHeaderBinding
 	private var drawerToggle: ActionBarDrawerToggle? = null
 	private var drawer: DrawerLayout? = null
+	private lateinit var fab: ExtendedFloatingActionButton
 	private val voiceInputLauncher = registerForActivityResult(VoiceInputContract(), VoiceInputCallback())
 
 	override val appBar: AppBarLayout
 		get() = binding.appbar
 
 	override fun onCreate(savedInstanceState: Bundle?) {
+
+		window.requestFeature(Window.FEATURE_ACTIVITY_TRANSITIONS)
+		setExitSharedElementCallback(MaterialContainerTransformSharedElementCallback())
+		window.sharedElementsUseOverlay = false
+
 		super.onCreate(savedInstanceState)
 		setContentView(ActivityMainBinding.inflate(layoutInflater))
 		navHeaderBinding = NavigationHeaderBinding.inflate(layoutInflater)
@@ -122,11 +130,12 @@ class MainActivity :
 			setNavigationItemSelectedListener(this@MainActivity)
 		}
 
-		binding.fab.setOnClickListener(this@MainActivity)
+		fab = binding.fab
+		fab.setOnClickListener(this@MainActivity)
 		binding.searchView.isVoiceSearchEnabled = voiceInputLauncher.resolve(this, null) != null
 
 		supportFragmentManager.findFragmentByTag(TAG_PRIMARY)?.let {
-			if (it is HistoryListFragment) binding.fab.show() else binding.fab.hide()
+			if (it is HistoryListFragment) fab.show() else fab.hide()
 		} ?: run {
 			openDefaultSection()
 		}
@@ -228,7 +237,7 @@ class MainActivity :
 	}
 
 	override fun onWindowInsetsChanged(insets: Insets) {
-		binding.fab.updateLayoutParams<MarginLayoutParams> {
+		fab.updateLayoutParams<MarginLayoutParams> {
 			bottomMargin = insets.bottom + topMargin
 		}
 		binding.toolbarCard.updateLayoutParams<MarginLayoutParams> {
@@ -319,16 +328,28 @@ class MainActivity :
 	}
 
 	private fun onOpenReader(manga: Manga) {
-		val options = ActivityOptions.makeScaleUpAnimation(binding.fab, 0, 0, binding.fab.width, binding.fab.height)
-		startActivity(ReaderActivity.newIntent(this, manga), options?.toBundle())
+		apply {
+			val intent = ReaderActivity.newIntent(this, manga)
+			val options = ActivityOptionsCompat.makeSceneTransitionAnimation(
+				this,
+				fab,
+				ReaderActivity.SHARED_ELEMENT_NAME
+			)
+			startActivity(
+				intent.apply {
+					putExtra(ReaderActivity.EXTRA_IS_TRANSITION, true)
+				},
+				options.toBundle()
+			)
+		}
 	}
 
 	private fun onError(e: Throwable) {
 		Snackbar.make(binding.container, e.getDisplayMessage(resources), Snackbar.LENGTH_SHORT).show()
 	}
 
 	private fun onLoadingStateChanged(isLoading: Boolean) {
-		binding.fab.isEnabled = !isLoading
+		fab.isEnabled = !isLoading
 	}
 
 	private fun onResumeEnabledChanged(isEnabled: Boolean) {
@@ -388,6 +409,7 @@ class MainActivity :
 
 	private fun setPrimaryFragment(fragment: Fragment) {
 		supportFragmentManager.beginTransaction()
+			.setCustomAnimations(R.anim.fragment_fade_in, R.anim.fragment_fade_out)
 			.replace(R.id.container, fragment, TAG_PRIMARY)
 			.commit()
 		adjustFabVisibility(topFragment = fragment)
@@ -441,7 +463,6 @@ class MainActivity :
 		topFragment: Fragment? = supportFragmentManager.findFragmentByTag(TAG_PRIMARY),
 		isSearchOpened: Boolean = supportFragmentManager.findFragmentByTag(TAG_SEARCH)?.isVisible == true,
 	) {
-		val fab = binding.fab
 		if (isResumeEnabled && !isSearchOpened && topFragment is HistoryListFragment) {
 			if (!fab.isVisible) {
 				fab.show()

app/src/main/java/org/koitharu/kotatsu/reader/ui/ReaderActivity.kt

@@ -19,6 +19,8 @@ import androidx.transition.TransitionManager
 import androidx.transition.TransitionSet
 import com.google.android.material.dialog.MaterialAlertDialogBuilder
 import com.google.android.material.snackbar.Snackbar
+import com.google.android.material.transition.platform.MaterialContainerTransform
+import com.google.android.material.transition.platform.MaterialContainerTransformSharedElementCallback
 import kotlinx.coroutines.Dispatchers
 import kotlinx.coroutines.flow.launchIn
 import kotlinx.coroutines.flow.onEach
@@ -79,6 +81,21 @@ class ReaderActivity :
 	private val hideUiRunnable = Runnable { setUiIsVisible(false) }
 
 	override fun onCreate(savedInstanceState: Bundle?) {
+
+		// Setup shared element transitions
+		if (intent.extras?.getBoolean(EXTRA_IS_TRANSITION) == true) {
+			window.requestFeature(Window.FEATURE_ACTIVITY_TRANSITIONS)
+			findViewById<View>(android.R.id.content)?.let { contentView ->
+				contentView.transitionName = SHARED_ELEMENT_NAME
+				setEnterSharedElementCallback(MaterialContainerTransformSharedElementCallback())
+				window.sharedElementEnterTransition = buildContainerTransform(true)
+				window.sharedElementReturnTransition = buildContainerTransform(false)
+
+				// Postpone custom transition until manga ready
+				postponeEnterTransition()
+			}
+		}
+
 		super.onCreate(savedInstanceState)
 		setContentView(ActivityReaderBinding.inflate(layoutInflater))
 		readerManager = ReaderManager(supportFragmentManager, R.id.container)
@@ -113,6 +130,12 @@ class ReaderActivity :
 		}
 	}
 
+	private fun buildContainerTransform(entering: Boolean): MaterialContainerTransform {
+		return MaterialContainerTransform(this, entering).apply {
+			addTarget(android.R.id.content)
+		}
+	}
+
 	private fun onInitReader(mode: ReaderMode) {
 		if (readerManager.currentMode != mode) {
 			readerManager.replace(mode)
@@ -129,6 +152,7 @@ class ReaderActivity :
 		if (binding.appbarTop.isVisible) {
 			lifecycle.postDelayed(hideUiRunnable, TimeUnit.SECONDS.toMillis(1))
 		}
+		startPostponedEnterTransition()
 	}
 
 	override fun onCreateOptionsMenu(menu: Menu): Boolean {
@@ -393,6 +417,8 @@ class ReaderActivity :
 
 	companion object {
 
+		const val SHARED_ELEMENT_NAME = "reader_shared_element_root"
+		const val EXTRA_IS_TRANSITION = "${BuildConfig.APPLICATION_ID}.READER_IS_TRANSITION"
 		const val ACTION_MANGA_READ = "${BuildConfig.APPLICATION_ID}.action.READ_MANGA"
 		private const val EXTRA_STATE = "state"
 		private const val EXTRA_BRANCH = "branch"

app/src/main/res/anim/fragment_fade_in.xml

@@ -0,0 +1,6 @@
+<?xml version="1.0" encoding="utf-8"?>
+<alpha
+	xmlns:android="http://schemas.android.com/apk/res/android"
+	android:duration="210"
+	android:fromAlpha="0.0"
+	android:toAlpha="1.0"  />

app/src/main/res/anim/fragment_fade_out.xml

@@ -0,0 +1,6 @@
+<?xml version="1.0" encoding="utf-8"?>
+<alpha
+	xmlns:android="http://schemas.android.com/apk/res/android"
+	android:duration="90"
+	android:fromAlpha="1.0"
+	android:toAlpha="0.0"  />