@apexnative/navigation 1.0.0-alpha.5 → 1.0.0-alpha.7

package/android/src/main/java/dev/apexnative/navigation/viewcontrollers/modal/ModalViews.kt

@@ -14,11 +14,15 @@ import android.widget.FrameLayout
 import androidx.coordinatorlayout.widget.CoordinatorLayout
 import androidx.core.view.ViewCompat
 import androidx.core.view.WindowInsetsCompat
+import dev.apexnative.navigation.options.DefaultOptions
 import dev.apexnative.navigation.options.ModalAnimationOptions
 import dev.apexnative.navigation.options.Options
 import dev.apexnative.navigation.utils.TestIds
 import dev.apexnative.navigation.utils.dp
+import dev.apexnative.navigation.viewcontrollers.component.ComponentViewController
+import dev.apexnative.navigation.viewcontrollers.parent.ParentController
 import dev.apexnative.navigation.viewcontrollers.viewcontroller.ViewController
+import dev.apexnative.navigation.views.animations.AnimationLayer
 import dev.apexnative.navigation.views.animations.AnimationRules
 import dev.apexnative.navigation.views.animations.SideAnimator
 import dev.apexnative.navigation.views.element.ElementTransition
@@ -95,7 +99,7 @@ internal class ModalViews(
         val container = parts.container
         container.isWaiting = false
         container.importantForAccessibility = View.IMPORTANT_FOR_ACCESSIBILITY_AUTO
-        if (record.isSheet) return presentSheet(record, parts, options, seen, events, onEnd)
+        if (record.isSheet) return presentSheet(record, parts, options, animated, seen, events, onEnd)
         applyTestIds(record, parts, options)
         if (!animated || !seen) {
             SideAnimator.rest(container)
@@ -117,11 +121,13 @@ internal class ModalViews(
     }
 
     // The root's view leaves the container and goes into the sheet's, in one turn; the sheet slides to its first
-    // detent. Nobody sees the activity: the show counts as done now, the sheet's later end does nothing.
+    // detent, or stands there at once when not [animated]. Nobody sees the activity: the show counts as done now, the
+    // sheet's later end does nothing.
     private fun presentSheet(
         record: ModalRecord,
         parts: Parts,
         options: Options,
+        animated: Boolean,
         seen: Boolean,
         events: ModalSheet.Events,
         onEnd: () -> Unit,
@@ -129,7 +135,16 @@ internal class ModalViews(
         val container = parts.container
         val view = record.root.view
         container.removeView(view)
-        val sheet = ModalSheet(container, view, events)
+        val sheet = ModalSheet(
+            container,
+            view,
+            events,
+            shownContent = { (shownScreen(record.root) as? ComponentViewController)?.content },
+            adjustsForKeyboard = {
+                val screen = shownScreen(record.root)
+                screen == null || !screen.resolveCurrentOptions(DefaultOptions.current).layout.adjustResize.isFalse
+            },
+        )
         parts.sheet = sheet
         container.alpha = 1f
         applyTestIds(record, parts, options)
@@ -140,11 +155,18 @@ internal class ModalViews(
                 onEnd()
             }
         }
-        sheet.show(options.modal.sheet, swipeToDismissOf(options)) { shown() }
+        sheet.show(options.modal.sheet, swipeToDismissOf(options), animated) { shown() }
         if (!seen) shown()
         return { told = true }
     }
 
+    // The screen a layout shows now: down through the child each parent shows.
+    private fun shownScreen(root: ViewController<*>): ViewController<*>? {
+        var node = root
+        while (node is ParentController<*>) node = node.currentChild ?: return null
+        return node
+    }
+
     override fun dismiss(
         record: ModalRecord,
         animated: Boolean,
@@ -158,7 +180,7 @@ internal class ModalViews(
         if (sheet != null) {
             if (!seen) return none(onEnd)
             var told = false
-            sheet.close {
+            sheet.close(animated) {
                 if (!told) {
                     told = true
                     onEnd()
@@ -263,6 +285,8 @@ internal class ModalViews(
         parts[record]?.container?.requestLayout()
     }
 
+    override fun sheetBack(record: ModalRecord): SheetBack? = parts[record]?.sheet
+
     // `modal.testID` on the modal's view; a sheet's on the sheet's container, `modal.sheet.testID` first, and its
     // grabber and scrim after it.
     private fun applyTestIds(record: ModalRecord, parts: Parts, options: Options) {
@@ -293,7 +317,11 @@ internal class ModalViews(
         val under = motion.underSide?.let { side -> underView?.let { SideAnimator.build(it, side, underBase) } }
         if (under != null && underView != null) {
             if (showing) moved[underView] = record else moved.remove(underView)
+            AnimationLayer.during(underView, under)
         }
+        // A fade of the modal or of the layer under it draws it through a hardware layer, given back at its end and at
+        // any stop (the set's cancel cancels it).
+        for (animator in listOfNotNull(side, fade)) AnimationLayer.during(container, animator)
         val fadeLength = motion.side?.takeIf(AnimationRules::isSingleAlpha)?.let(AnimationRules::lengthOf)
         val elements = motion.elements?.let { animation ->
             val content = modalsLayer.parent as? ViewGroup ?: return@let null

package/android/src/main/java/dev/apexnative/navigation/viewcontrollers/modal/SheetBack.kt

@@ -0,0 +1,42 @@
+package dev.apexnative.navigation.viewcontrollers.modal
+
+import androidx.activity.BackEventCompat
+
+/**
+ * A modal's sheet as back sees it ([ModalSheet]): whether a release of back would hide it, and the preview of that
+ * hide during the back gesture (Android 14+). [ModalCoordinator.backTargetSheet] gives the one back would dismiss now.
+ * Main thread only.
+ */
+internal interface SheetBack {
+    /**
+     * Back's release would hide the sheet, as a drag down does: it stands at a detent from which it goes down (its
+     * smallest, while it lets the user close it), laid out, and it isn't closing already. False at a larger detent:
+     * the Material behavior would only collapse it there.
+     */
+    val hidesOnBack: Boolean
+
+    /**
+     * Starts the preview of back on the sheet with the gesture's first [event]: the sheet shrinks a little toward the
+     * bottom with the progress, the scrim following it. None when [hidesOnBack] doesn't hold or a preview runs.
+     */
+    fun startBackPreview(event: BackEventCompat): Gesture?
+
+    /** A back gesture over the sheet ([startBackPreview]). */
+    interface Gesture {
+        /** The sheet the gesture previews. */
+        val sheet: SheetBack
+
+        /** The gesture moved. */
+        fun progress(event: BackEventCompat)
+
+        /** Cancelled, or back went elsewhere: the sheet grows back to where it stood, the scrim with it. */
+        fun cancel()
+
+        /**
+         * Released: the sheet slides down from where the preview left it and goes as one the user dragged down (its
+         * events, its dismissal). False when the preview stopped since it started (a command closed or moved the
+         * sheet): back goes the usual way.
+         */
+        fun commit(): Boolean
+    }
+}

package/android/src/main/java/dev/apexnative/navigation/viewcontrollers/modal/SheetStops.kt

@@ -3,10 +3,68 @@ package dev.apexnative.navigation.viewcontrollers.modal
 import dev.apexnative.navigation.options.SheetDetent
 
 /**
- * Where a shown sheet goes at new options, as on iOS: the sheet keeps the stop it stands at (the user's last drag
- * included) until a `selectedDetent` arrives in a `mergeOptions`, or until its stop is no longer among the detents.
+ * Where a sheet rests: the stops it keeps of its detents, how the Material behavior stands at them, and where a shown
+ * sheet goes at new options, as on iOS: the sheet keeps the stop it stands at (the user's last drag included) until a
+ * `selectedDetent` arrives in a `mergeOptions`, or until its stop is no longer among the detents.
  */
 internal object SheetStops {
+    /** The Material behavior has three resting states: collapsed, half expanded and expanded. */
+    const val MAX_STOPS = 3
+
+    /**
+     * The stops of the sheet, from the lowest: [detents] by their height ([heightOf]), one of each height (the first
+     * the options give), and at most [MAX_STOPS] of them: the lowest, the highest, and between them [selected] when
+     * it stands there, else the lowest of the rest.
+     */
+    fun stops(detents: List<SheetDetent>, heightOf: (SheetDetent) -> Int, selected: SheetDetent?): List<SheetDetent> {
+        val sorted = detents.sortedBy(heightOf).distinctBy(heightOf)
+        if (sorted.size <= MAX_STOPS) return sorted
+        val between = sorted.subList(1, sorted.size - 1)
+        val middle = selected?.takeIf { it in between } ?: between.first()
+        return listOf(sorted.first(), middle, sorted.last())
+    }
+
+    /**
+     * How the Material behavior stands at the stops: [fitToContents] with one or two (collapsed and expanded, the
+     * sheet as tall as the highest, [maxHeight]), else half expanded between them at [halfExpandedRatio] of the
+     * layout, and expanded [expandedOffset] below its top. [skipCollapsed] with one stop: the sheet has only that.
+     * The heights are in pixels, as is the rest.
+     */
+    data class Material(
+        val fitToContents: Boolean,
+        val skipCollapsed: Boolean,
+        val peekHeight: Int,
+        val halfExpandedRatio: Float?,
+        val expandedOffset: Int,
+        val maxHeight: Int,
+    )
+
+    /**
+     * The behavior's settings for stops [heights] tall (from the lowest, each higher than the one before) in a layout
+     * [parentHeight] tall.
+     */
+    fun material(heights: List<Int>, parentHeight: Int): Material {
+        val lowest = heights.first()
+        val highest = heights.last()
+        val three = heights.size == MAX_STOPS && parentHeight > 0
+        return Material(
+            fitToContents = !three,
+            skipCollapsed = heights.size == 1,
+            peekHeight = lowest,
+            halfExpandedRatio = if (three) heights[1].toFloat() / parentHeight else null,
+            expandedOffset = (parentHeight - highest).coerceAtLeast(0),
+            maxHeight = highest,
+        )
+    }
+
+    /**
+     * The heights of stops [heights] tall (from the lowest, each higher) lifted by [lift] pixels, the part of the
+     * keyboard over the navigation bar: the sheet stands on the keyboard as it stood on the bottom. At most [full]
+     * each, and each still higher than the one below, so the behavior keeps all of its states.
+     */
+    fun lifted(heights: List<Int>, lift: Int, full: Int): List<Int> =
+        heights.mapIndexed { i, height -> (height + lift).coerceAtMost(full - (heights.lastIndex - i)) }
+
     /**
      * The stop to move to, or null to stay: [arrived] (the `selectedDetent` the merge names) when it is among
      * [detents]; else, when [settled] (the stop the sheet rests at) is no longer one of them, [selected] (the resolved

package/android/src/main/java/dev/apexnative/navigation/viewcontrollers/navigator/Navigator.kt

@@ -33,6 +33,7 @@ import dev.apexnative.navigation.viewcontrollers.externalcomponent.ExternalCompo
 import dev.apexnative.navigation.viewcontrollers.modal.ModalCoordinator
 import dev.apexnative.navigation.viewcontrollers.modal.ModalRecord
 import dev.apexnative.navigation.viewcontrollers.modal.ModalViews
+import dev.apexnative.navigation.viewcontrollers.modal.SheetBack
 import dev.apexnative.navigation.viewcontrollers.overlay.OverlayCoordinator
 import dev.apexnative.navigation.viewcontrollers.overlay.OverlayRecord
 import dev.apexnative.navigation.viewcontrollers.overlay.OverlayViews
@@ -177,6 +178,9 @@ class Navigator(
         return if (modalRoot != null) modalRoot.stackPoppedByBack() else root?.stackPoppedByBack()
     }
 
+    /** The sheet [handleBack] would dismiss, as a drag down of the user would; none when back would do anything else. */
+    internal fun sheetDismissedByBack(): SheetBack? = modals.backTargetSheet()
+
     /**
      * [layer] may wait to show from now on ([WaitingLayer]): the nodes in it ask it through [isInWaitingLayer] and
      * [shownScreensChanged]. The root's layer is there from the start.

package/android/src/main/java/dev/apexnative/navigation/viewcontrollers/parent/ParentController.kt

@@ -129,12 +129,9 @@ abstract class ParentController<V : ViewGroup>(
     open fun leavesTopEdgeFree(child: ViewController<*>): Boolean =
         parentController?.leavesTopEdgeFree(this) ?: false
 
-    /**
-     * Whether the safe area of [child] leaves its bottom edge free by default: the tabs show with
-     * `bottomTabs.hideOnScroll` of [screen], the screen that asks.
-     */
-    open fun leavesBottomEdgeFree(child: ViewController<*>, screen: ViewController<*> = child): Boolean =
-        parentController?.leavesBottomEdgeFree(this, screen) ?: false
+    /** Whether a large title shows over [child]: its stack shows the bar with one. No by default. */
+    open fun showsLargeTitleOver(child: ViewController<*>): Boolean =
+        parentController?.showsLargeTitleOver(this) ?: false
 
     /**
      * The tab bar at rest under [child]: where a stack's FAB keeps clear of it, by the options of [screen], the stack's

package/android/src/main/java/dev/apexnative/navigation/viewcontrollers/sidemenu/SideMenuMotion.kt

@@ -1,6 +1,7 @@
 package dev.apexnative.navigation.viewcontrollers.sidemenu
 
 import dev.apexnative.navigation.react.events.AppearanceDispatcher
+import dev.apexnative.navigation.utils.SystemAnimations
 import dev.apexnative.navigation.viewcontrollers.viewcontroller.ViewController
 
 /**
@@ -26,6 +27,8 @@ import dev.apexnative.navigation.viewcontrollers.viewcontroller.ViewController
 internal class SideMenuMotion(
     private val drawer: () -> Drawer,
     private val host: Host,
+    /** The system's animations are off ([SystemAnimations]): a command or back moves the drawer at once. */
+    private val animationsOff: () -> Boolean = { SystemAnimations.areOff() },
 ) {
     /** A side of the side menu: physical, `left` stays on the left in RTL too. */
     enum class Side(
@@ -242,11 +245,14 @@ internal class SideMenuMotion(
         drawer.lock(side, locked = !isOnScreen(side) && !host.isEnabled(side))
     }
 
-    // The drawer opens or closes [side]; one that doesn't call back has its result recorded here.
+    // The drawer opens or closes [side]; one that doesn't call back has its result recorded here. With the system's
+    // animations off it jumps, unless it moves: the drag and the settle aren't animators, and it can't jump while it
+    // settles.
     private fun move(side: Side, open: Boolean, animate: Boolean) {
         val drawer = drawer()
+        val animated = animate && (moving || !animationsOff())
         val silent = !drawer.callsBack
-        if (open) drawer.open(side, animate) else drawer.close(side, animate)
+        if (open) drawer.open(side, animated) else drawer.close(side, animated)
         if (silent) record(side, open)
     }
 

package/android/src/main/java/dev/apexnative/navigation/viewcontrollers/stack/BackPreview.kt

@@ -2,6 +2,7 @@ package dev.apexnative.navigation.viewcontrollers.stack
 
 import android.animation.Animator
 import android.animation.AnimatorListenerAdapter
+import android.animation.StateListAnimator
 import android.animation.ValueAnimator
 import android.content.res.Configuration
 import android.graphics.Bitmap
@@ -29,7 +30,7 @@ import dev.apexnative.navigation.views.stack.StackLayout
  * The preview of a pop while the user's back gesture runs (predictive back), as the system shows the activity under
  * the one that closes: the screen on top with its bar, a picture taken as the gesture starts, shrinks toward the
  * gesture's side with rounded corners and follows the finger up and down; the screen under it shows behind it with
- * its own bar, smaller and dimmed. Released, the pop plays its end ([commit]); cancelled, everything goes back
+ * its own bar and FAB, smaller and dimmed. Released, the pop plays its end ([commit]); cancelled, everything goes back
  * ([cancel]). The values are those of the system's cross-activity back animation (WMShell
  * `DefaultCrossActivityBackAnimation` of Android 15 and 16, the smallest scale as Android 17 shows it), also on Android
  * 14, whose own preview differs. Main thread only.
@@ -46,8 +47,13 @@ internal class BackPreview(
      * corners, while the tab bar stays, as Gmail shows it.
      */
     private val bottomRoom: Int,
-    /** The picture is there: the stack shows the screen under the top, with its bar, before the preview draws. */
+    /**
+     * The picture is there: the stack shows the screen under the top, with its bar and its FAB, before the preview
+     * draws.
+     */
     private val onReveal: () -> Unit,
+    /** The view of the FAB the stack shows now, which goes with the screen under the top; none. */
+    private val fab: () -> View? = { null },
 ) {
     private val density = layout.resources.displayMetrics.density
     private val bar = layout.topBar
@@ -58,6 +64,11 @@ internal class BackPreview(
     private var animator: Animator? = null
     private var ended = false
     private var topAlpha = 1f
+    // The FAB that shows with the screen under the top, drawn flat under the dim and the picture, its own Z and the
+    // animator of its Z by its state.
+    private var flatFab: View? = null
+    private var fabZ = 0f
+    private var fabZByState: StateListAnimator? = null
     // What puts the stack as it was after a cancel: once, as the preview ends.
     private var onCancelled: (() -> Unit)? = null
     // Forward is to the end of the line: right to left, the screens move the other way, as the stack's pop does.
@@ -175,10 +186,17 @@ internal class BackPreview(
         card = null
         (scrim.parent as? ViewGroup)?.removeView(scrim)
         top.alpha = topAlpha
+        flatFab?.let {
+            flatFab = null
+            it.translationZ = fabZ
+            it.stateListAnimator = fabZByState
+            fabZByState = null
+        }
         entering(1f, 0f)
         if (Build.VERSION.SDK_INT >= Build.VERSION_CODES.P) {
             target.resetPivot()
             bar.resetPivot()
+            fab()?.resetPivot()
         }
         onCancelled?.let {
             onCancelled = null
@@ -190,6 +208,16 @@ internal class BackPreview(
     // the top's place, cut to rounded corners.
     private fun show(picture: Bitmap) {
         onReveal()
+        // A child with a Z draws over those without, whatever their order: the FAB, raised by its elevation, would lie
+        // over the dim and the picture. Its state's animator, which Material's FAB sets on the frame after it joins the
+        // window (and on a press, focus or hover), would raise it again: it stays off while the preview draws.
+        fab()?.takeIf { it.z > 0f }?.let {
+            flatFab = it
+            fabZ = it.translationZ
+            fabZByState = it.stateListAnimator
+            it.stateListAnimator = null
+            it.translationZ = -it.elevation
+        }
         val dark = layout.resources.configuration.uiMode and Configuration.UI_MODE_NIGHT_MASK ==
             Configuration.UI_MODE_NIGHT_YES
         scrim.setBackgroundColor(Color.BLACK)
@@ -235,9 +263,9 @@ internal class BackPreview(
         entering(scale, -SystemTransition.DISTANCE_DP * density * forward)
     }
 
-    // The screen under the top and its bar at [scale] around the stack's center, [x] along the line.
+    // The screen under the top, its bar and its FAB at [scale] around the stack's center, [x] along the line.
     private fun entering(scale: Float, x: Float) {
-        for (view in listOf(target, bar)) {
+        for (view in listOfNotNull(target, bar, fab())) {
             view.pivotX = layout.width / 2f - view.left
             view.pivotY = areaHeight / 2f - view.top
             view.scaleX = scale

package/android/src/main/java/dev/apexnative/navigation/viewcontrollers/stack/PreparedFrame.kt

@@ -2,18 +2,18 @@ package dev.apexnative.navigation.viewcontrollers.stack
 
 import android.view.View
 import com.facebook.react.uimanager.PixelUtil.pxToDp
-import dev.apexnative.navigation.react.ScreenInsets
+import dev.apexnative.navigation.react.ScreenEnvironment
 
 /**
  * Where a screen prepared for a push (`preparePush`) shows, in dp: the size of the container its slot fills and the
  * padding of its safe area view, as the push lays it out. JavaScript renders the screen with them before the push, and
  * the slot and the safe area view start their states with them.
  */
-internal data class PreparedFrame(val width: Float, val height: Float, val padding: ScreenInsets.Insets) {
+internal data class PreparedFrame(val width: Float, val height: Float, val padding: ScreenEnvironment.Insets) {
     companion object {
         /** The size of [container] as its slot measures it (`SlotView`), so the slot finds it equal. */
         @JvmStatic
-        fun of(container: View, padding: ScreenInsets.Insets) =
+        fun of(container: View, padding: ScreenEnvironment.Insets) =
             PreparedFrame(container.width.toFloat().pxToDp(), container.height.toFloat().pxToDp(), padding)
     }
 }

package/android/src/main/java/dev/apexnative/navigation/viewcontrollers/stack/StackCommands.kt

@@ -11,7 +11,7 @@ import dev.apexnative.navigation.options.DefaultOptions
 import dev.apexnative.navigation.react.CommandAnswer
 import dev.apexnative.navigation.react.CommandListener
 import dev.apexnative.navigation.react.ErrorTexts
-import dev.apexnative.navigation.react.ScreenInsets
+import dev.apexnative.navigation.react.ScreenEnvironment
 import dev.apexnative.navigation.slots.SlotScreenView
 import dev.apexnative.navigation.utils.NavigationLog
 import dev.apexnative.navigation.viewcontrollers.child.ChildControllersRegistry
@@ -318,7 +318,7 @@ internal class StackCommands(
         layoutNow(stackView, screenView)
         node.updateSafeArea()
         val content = node.content?.asView()
-        val padding = ScreenInsets.padding(node.id)
+        val padding = ScreenEnvironment.padding(node.id)
         val noInsets = content == null || ViewCompat.getRootWindowInsets(content) == null
         if (noInsets || padding == null || content.width <= 0 || content.height <= 0) {
             prepared.discard(node.id)

package/android/src/main/java/dev/apexnative/navigation/viewcontrollers/stack/StackController.kt

@@ -31,6 +31,7 @@ import dev.apexnative.navigation.viewcontrollers.parent.OptionsScreen
 import dev.apexnative.navigation.viewcontrollers.parent.ParentController
 import dev.apexnative.navigation.viewcontrollers.parent.ReturnsScreenFromColumn
 import dev.apexnative.navigation.viewcontrollers.parent.nodeWith
+import dev.apexnative.navigation.viewcontrollers.stack.fab.FabMotion
 import dev.apexnative.navigation.viewcontrollers.stack.fab.FabPresenter
 import dev.apexnative.navigation.viewcontrollers.stack.topbar.LargeTitleCollapse
 import dev.apexnative.navigation.viewcontrollers.stack.topbar.TopBarPresenter
@@ -207,6 +208,17 @@ class StackController(
         screen.changeOptions { it.topBar.buttons.back.setVisible() }
     }
 
+    /**
+     * `clearOptions` took options out of the own options of [node], an entry of this stack or the options screen of
+     * one: the back arrow's rule ([join]) writes its part of them again, so the first screen keeps its arrow hidden
+     * and another shows it unless its options say otherwise.
+     */
+    internal fun ownOptionsCleared(node: ViewController<*>) {
+        val entries = queue.entries
+        val entry = entries.firstOrNull { it === node || optionsScreen(it) === node } ?: return
+        backRule(entry, first = entry === entries.first())
+    }
+
     /** The key of [entry]; none without one. */
     internal fun keyOf(entry: ViewController<*>): String? = keys[entry]
 
@@ -307,6 +319,9 @@ class StackController(
     // The back gesture over this stack whose preview hasn't ended yet; none.
     private var backGesture: BackGesture? = null
 
+    // A merge of `fab` into the top waits for the end of a back gesture's preview.
+    private var fabMergeWaits = false
+
     /**
      * A back gesture over the top of this stack ([startBackGesture]): its progress, its cancel, and its release, which
      * pops the top through the queue with the preview's end. A command accepted meanwhile, or the stack's destroy,
@@ -326,6 +341,10 @@ class StackController(
         private var revealed = false
         private var aborted = false
 
+        /** The preview shows the screen under the top, with its bar and its FAB. */
+        val isRevealed: Boolean
+            get() = revealed && !aborted
+
         /** The gesture moved: [progress] 0 … 1, the finger at [touchY]. */
         fun progress(progress: Float, touchY: Float) {
             if (!aborted) preview.progress(progress, touchY)
@@ -348,6 +367,9 @@ class StackController(
                 return true
             }
             if (backGesture === this) backGesture = null
+            // The top's FAB, set aside, leaves with it; a merge into it no longer matters.
+            fab.dropAside()
+            fabMergeWaits = false
             queue.cut(target, null, id, "go back in the stack '$id'", null, gesture = true)
             return true
         }
@@ -360,7 +382,8 @@ class StackController(
             restore()
         }
 
-        // The preview's picture is there: the screen under the top shows under it, and the bar shows that screen.
+        // The preview's picture is there: the screen under the top shows under it, and the bar and the FAB show that
+        // screen, at once.
         internal fun reveal() {
             val view = target.peekView() ?: return
             targetWasPlaced = view.parent === peekView() && view.visibility == View.VISIBLE
@@ -370,6 +393,8 @@ class StackController(
             views.reveal(target, top)
             view.alpha = 1f
             topBar.apply(target)
+            fab.setAside()
+            showFab(FabMotion.Move.AtOnce, target)
         }
 
         private fun restore() {
@@ -386,9 +411,14 @@ class StackController(
                     views.detach(target)
                 }
             }
-            // The bar shows the top again, its components appeared again.
+            // The bar and the FAB show the top again, the bar's components appeared again.
             val shown = queue.currentChild
             topBar.apply(shown)
+            fab.bringBack()
+            if (fabMergeWaits) {
+                fabMergeWaits = false
+                mergeFab()
+            }
             shown?.let {
                 topBar.screenWillAppear(optionsScreen(it))
                 topBar.screenDidAppear(optionsScreen(it))
@@ -462,7 +492,8 @@ class StackController(
         ContainerBackground.apply(this, options)
         updateBar()
         takeKeptMerge(child)?.let(::applyTopMerge)
-        if (queue.isAtRest) showFab()
+        // A back gesture's preview shows the FAB of the screen under the top.
+        if (queue.isAtRest && backGesture?.isRevealed != true) showFab()
         performOnParentController { it.applyChildOptions(withoutStackGroups(options), this) }
     }
 
@@ -594,6 +625,10 @@ class StackController(
     override fun leavesTopEdgeFree(child: ViewController<*>): Boolean =
         TopBarRoom.leavesTopEdgeFree(resolvedOf(child), largeTitleShown(child)) || super.leavesTopEdgeFree(child)
 
+    /** A large title shows over [child] in this stack's bar. */
+    override fun showsLargeTitleOver(child: ViewController<*>): Boolean =
+        largeTitleShown(child) || super.showsLargeTitleOver(child)
+
     /** A screen under another doesn't compute its safe area again; the prepared and waiting do. */
     override fun isTopOfStack(child: ViewController<*>): Boolean =
         child === queue.currentChild || child === queue.waitingScreen || isPrepared(child)
@@ -666,15 +701,20 @@ class StackController(
         topBar.apply(queue.currentChild)
     }
 
-    // The FAB follows the top at the end of a transition.
-    private fun showFab() {
+    // The FAB follows [top] (the current child) from the start of a transition by [move], with the screens; at rest, a
+    // FAB that comes by Material's swap.
+    private fun showFab(move: FabMotion.Move = FabMotion.Move.Swap, top: ViewController<*>? = queue.currentChild) {
         val layout = peekView() ?: return
-        val top = queue.currentChild
         val screen = top?.let(::optionsScreen)
-        fab.showFor(layout, screen, top?.let(::resolvedOf)?.fab ?: FabOptions(), scrollOf(screen))
+        fab.showFor(layout, screen, top?.let(::resolvedOf)?.fab ?: FabOptions(), scrollOf(screen), move)
     }
 
     private fun mergeFab() {
+        // A back gesture's preview shows the FAB of the screen under the top: the top's merge waits for a cancel.
+        if (backGesture?.isRevealed == true) {
+            fabMergeWaits = true
+            return
+        }
         val layout = peekView() ?: return
         val top = queue.currentChild ?: return
         val screen = optionsScreen(top)
@@ -723,6 +763,9 @@ class StackController(
             parentController?.tabBarTransition(this@StackController, move, side)
         }
 
+        // The FAB of the new top arrives with its screen, the old one leaves with its own.
+        override fun fabTransition(move: FabMotion.Move) = showFab(move)
+
         override fun operationEnded(topSettled: Boolean) {
             BackCallbackState.update()
             if (topSettled) parentController?.tabBarSettled(this@StackController)

package/android/src/main/java/dev/apexnative/navigation/viewcontrollers/stack/StackQueue.kt

@@ -21,6 +21,7 @@ import dev.apexnative.navigation.viewcontrollers.stack.StackDisplay.Custom
 import dev.apexnative.navigation.viewcontrollers.stack.StackDisplay.Elements
 import dev.apexnative.navigation.viewcontrollers.stack.StackDisplay.Fade
 import dev.apexnative.navigation.viewcontrollers.stack.StackDisplay.Motion
+import dev.apexnative.navigation.viewcontrollers.stack.fab.FabMotion
 import dev.apexnative.navigation.viewcontrollers.viewcontroller.ViewController
 import dev.apexnative.navigation.views.animations.AnimationRules
 import java.util.WeakHashMap
@@ -58,7 +59,7 @@ private typealias Node = ViewController<*>
  * made in the commit of that mount (its `mergeOptions`), so the transition starts with the options of that commit —
  * content mounted already goes that way too. A push or a `setStackRoot` with elements waits for its targets after
  * that, a wait like the others, within what is left of its limit without `waitForRender`: a cut or a replace during it
- * interrupts the push, which moves no view into a layer.
+ * interrupts the push, which starts no element.
  *
  * The transition is the screens' own when the options say so (`AnimationRules.stackIsOwn`): the display plays each
  * screen's side ([StackDisplay.animateCustom]) with the same owners as the default transitions; the bar's row then
@@ -103,6 +104,12 @@ internal class StackQueue(
          */
         fun tabBarTransition(move: TabBarMotion.Move, side: BottomTabsEnterExitAnimationOptions?) = Unit
 
+        /**
+         * The current child is about to change, right after [barTransition]: [move] is how the FAB goes, the new top's
+         * arriving with its screen and the old one's leaving with its own from the start of the transition.
+         */
+        fun fabTransition(move: FabMotion.Move) = Unit
+
         /** [node] was accepted to show as the top (a push, the new top of a replace). */
         fun willShow(node: Node) = Unit
 
@@ -546,6 +553,7 @@ internal class StackQueue(
         val ended = takeOver(listOfNotNull(covered, node), op)
         host.tabBarTransition(TabBarMotion.Move.AtOnce, null)
         host.barTransition(null, BarVisibility.AT_ONCE)
+        host.fabTransition(FabMotion.Move.AtOnce)
         host.currentChildChanged()
         finishTakenOver(ended)
         if (display.hasView && covered != null) display.detach(covered)
@@ -785,6 +793,7 @@ internal class StackQueue(
             val ended = takeOver(old + top, op)
             host.tabBarTransition(TabBarMotion.Move.AtOnce, null)
             host.barTransition(null, BarVisibility.AT_ONCE)
+            host.fabTransition(FabMotion.Move.AtOnce)
             host.currentChildChanged()
             finishTakenOver(ended)
             op.done = true
@@ -1124,6 +1133,7 @@ internal class StackQueue(
         reject(op, text)
         host.tabBarTransition(TabBarMotion.Move.AtOnce, null)
         host.barTransition(null, BarVisibility.AT_ONCE)
+        host.fabTransition(FabMotion.Move.AtOnce)
         host.currentChildChanged()
         settled()
         drain()
@@ -1174,7 +1184,7 @@ internal class StackQueue(
     // The bars with a change of the current child. The row goes with the default transition; with an animation of its
     // own the top bar goes with the screens ([travel]). The tab bar rides with the system's [system] move, slides with an
     // animation of its own or a side of its own, and is where the new top wants it at once without animation; with
-    // elements every bar changes at once.
+    // elements every bar changes at once. The FAB goes with its screen, by Material's swap with an animation of its own.
     private fun tellBars(
         animated: Boolean,
         own: Boolean,
@@ -1183,7 +1193,8 @@ internal class StackQueue(
         system: TabBarMotion.Move,
         row: BarMotion,
         travel: BarTravel,
-        // The top bar shows the new top already (a back gesture's preview): it changes at once, the tab bar still moves.
+        // The top bar and the FAB show the new top already (a back gesture's preview): they change at once, the tab bar
+        // still moves.
         barAtOnce: Boolean = false,
     ) {
         val tabs = animation.bottomTabs
@@ -1200,6 +1211,7 @@ internal class StackQueue(
             barVisibility(barMoves && !elements, animation.topBar),
             travel.takeIf { barMoves && own && !elements },
         )
+        host.fabTransition(FabMotion.moveOf(animated, own, row, shown = barAtOnce))
     }
 
     private fun barVisibility(animated: Boolean, side: TopBarEnterExitAnimationOptions): BarVisibility =