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

package/android/src/main/java/dev/apexnative/navigation/utils/OptionImages.kt

@@ -0,0 +1,262 @@
+package dev.apexnative.navigation.utils
+
+import android.content.ComponentCallbacks2
+import android.content.Context
+import android.content.res.Configuration
+import android.content.res.Resources
+import android.graphics.BitmapFactory
+import android.graphics.drawable.BitmapDrawable
+import android.graphics.drawable.Drawable
+import android.net.Uri
+import android.os.StrictMode
+import android.util.LruCache
+import androidx.core.content.ContextCompat
+import com.facebook.react.views.imagehelper.ResourceDrawableIdHelper
+import java.io.FileInputStream
+import java.io.FileNotFoundException
+import java.io.IOException
+import java.io.InputStream
+import java.net.URL
+import java.util.Collections
+import java.util.concurrent.ExecutorService
+import java.util.concurrent.Executors
+
+/**
+ * The images and icons of the options, every one of them (bar buttons and their menus, the back button, search
+ * suggestions, tab icons, the FAB): one cache for the app, by [ImageKey], sized by the bytes of its images and let go
+ * when the system is low on memory with the app in the background ([clearsOnTrim]), not each time the app's UI hides;
+ * each caller gets its own mutable copy. The images don't depend on the JavaScript, so a reload keeps them.
+ *
+ * A `file:` address is a file; anything else first a drawable of the app by name (as React Native's images by resource
+ * name: release builds' assets, `{ android }` icons). Those two load on the caller's thread ([load]) or on a
+ * background thread of their own ([loadLater]). Not found while the app is in development: the address is read as a
+ * stream on the main thread, Metro's asset over the network (network on the main thread allowed for that read only)
+ * or through the content resolver. A remote address that is not Metro's asset is never loaded. A failure (a missing
+ * file or drawable, data that doesn't decode, an image too large for the memory) never ends the app: no image, and one
+ * warning per address in the log (and LogBox in development).
+ *
+ * A theme attribute inside a drawable of the app is resolved against the theme of the context that loaded it first.
+ * Main thread, unless a member says otherwise.
+ */
+internal object OptionImages {
+    private val cache = object : LruCache<ImageKey, Entry>(maxBytes()) {
+        override fun sizeOf(key: ImageKey, value: Entry) = value.bytes
+    }
+
+    // The addresses already named in a warning: one each.
+    private val warned: MutableSet<String> = Collections.synchronizedSet(HashSet())
+
+    // The loads off the main thread under way, with who waits for each.
+    private val loading = HashMap<ImageKey, MutableList<Waiter>>()
+
+    private val background: ExecutorService by lazy {
+        Executors.newSingleThreadExecutor { task -> Thread(task, THREAD_NAME).apply { isDaemon = true } }
+    }
+
+    @Volatile
+    private var listening = false
+
+    /** The cache and the loads for [context]: the source of an [ImageRequests]. */
+    fun source(context: Context): ImageSource = object : ImageSource {
+        override fun key(uri: String) = ImageKey.of(context, uri)
+
+        override fun cached(key: ImageKey) = cached(context, key)
+
+        override fun now(key: ImageKey) = load(context, key)
+
+        override fun loadsLater(uri: String) = loadsLater(context, uri)
+
+        override fun later(key: ImageKey, done: (Drawable?) -> Unit) = loadLater(context, key, done)
+    }
+
+    /** A copy of the image of [key] when the cache has it. Any thread. */
+    fun cached(context: Context, key: ImageKey): Drawable? = cache.get(key)?.copy(context)
+
+    /** A copy of the image of [uri], from the cache or loaded on the caller's thread; none on a failure. */
+    fun load(context: Context, uri: String): Drawable? = load(context, ImageKey.of(context, uri))
+
+    /**
+     * A copy of the image of [key] (built in the configuration of [context]), from the cache or loaded on the caller's
+     * thread; none on a failure.
+     */
+    fun load(context: Context, key: ImageKey): Drawable? {
+        listen(context)
+        cache.get(key)?.let { return it.copy(context) }
+        val loaded = decodeOrWarn(context, key.uri) ?: return null
+        return keep(key, loaded)?.copy(context) ?: loaded
+    }
+
+    /** Whether [uri] loads off the main thread: a file, or a drawable the app has by that name. Any thread. */
+    fun loadsLater(context: Context, uri: String): Boolean =
+        uri.startsWith(FILE_SCHEME) || ResourceDrawableIdHelper.getResourceDrawableId(context, uri) > 0
+
+    /**
+     * Loads [key] (built in the configuration of [context]) on the background thread and gives [done] a copy of it, or
+     * none on a failure, on the main thread; one load for all who ask for the same image meanwhile. Only for what
+     * [loadsLater].
+     */
+    fun loadLater(context: Context, key: ImageKey, done: (Drawable?) -> Unit) {
+        listen(context)
+        val waiters = loading[key]
+        if (waiters != null) {
+            waiters.add(Waiter(context, done))
+            return
+        }
+        loading[key] = mutableListOf(Waiter(context, done))
+        background.execute {
+            val loaded = decodeOrWarn(context, key.uri)
+            val entry = loaded?.let { keep(key, it) }
+            UiThread.post { deliver(key, loaded, entry) }
+        }
+    }
+
+    /** Lets every image of the cache go. Any thread. */
+    fun clear() {
+        cache.evictAll()
+    }
+
+    /**
+     * Whether the cache lets its images go at a trim of [level]: when the system is low on memory with the app in the
+     * background (`TRIM_MEMORY_BACKGROUND` and above), not at `TRIM_MEMORY_UI_HIDDEN`, which comes each time the app
+     * goes to the background: its icons are there when it comes back.
+     */
+    fun clearsOnTrim(level: Int): Boolean = level >= ComponentCallbacks2.TRIM_MEMORY_BACKGROUND
+
+    // Each waiter gets a copy of its own; an image the cache can't keep (no constant state) goes to the first only,
+    // the others load it again.
+    private fun deliver(key: ImageKey, loaded: Drawable?, entry: Entry?) {
+        val waiters = loading.remove(key) ?: return
+        waiters.forEachIndexed { index, waiter ->
+            val image = when {
+                loaded == null -> null
+                entry != null -> entry.copy(waiter.context)
+                index == 0 -> loaded
+                else -> load(waiter.context, key)
+            }
+            waiter.done(image)
+        }
+    }
+
+    // Into the cache, when the image can be copied; the entry it keeps. Any thread.
+    private fun keep(key: ImageKey, image: Drawable): Entry? {
+        val state = image.constantState ?: return null
+        return Entry(state, bytesOf(image)).also { cache.put(key, it) }
+    }
+
+    private fun bytesOf(image: Drawable): Int {
+        if (image is BitmapDrawable) image.bitmap?.let { return it.allocationByteCount }
+        // A drawable that draws itself (a vector) keeps a picture of its own size when it is drawn.
+        return image.intrinsicWidth.coerceAtLeast(1) * image.intrinsicHeight.coerceAtLeast(1) * BYTES_PER_PIXEL
+    }
+
+    // The image of [uri], or none and one warning per address. Any thread.
+    private fun decodeOrWarn(context: Context, uri: String): Drawable? = try {
+        decode(context, uri)
+    } catch (e: Exception) {
+        warnOnce(uri, (e as? LoadFailure)?.why ?: ": ${e.message ?: e.javaClass.simpleName}")
+        null
+    } catch (e: OutOfMemoryError) {
+        warnOnce(uri, ": it is too large to decode")
+        null
+    }
+
+    private fun warnOnce(uri: String, why: String) {
+        if (warned.add(uri)) DevelopmentLog.warn("Could not load image $uri$why")
+    }
+
+    private fun decode(context: Context, uri: String): Drawable {
+        if (uri.startsWith(FILE_SCHEME)) return decodeStream(context) { FileInputStream(Uri.parse(uri).path) }
+        resourceDrawable(context, uri)?.let { return it }
+        if (!DevelopmentLog.isDevelopment) throw LoadFailure("")
+        val address = Uri.parse(uri)
+        return when (address.scheme) {
+            "http", "https" -> {
+                if (!isMetroAsset(address)) throw LoadFailure(": remote images are not supported in options")
+                withNetworkOnMainThread { decodeStream(context) { URL(uri).openStream() } }
+            }
+            else -> decodeStream(context) {
+                context.contentResolver.openInputStream(address) ?: throw FileNotFoundException(uri)
+            }
+        }
+    }
+
+    // A drawable of the app by name; none when the app has none by that name.
+    private fun resourceDrawable(context: Context, name: String): Drawable? {
+        val id = ResourceDrawableIdHelper.getResourceDrawableId(context, name)
+        if (id <= 0) return null
+        return try {
+            ContextCompat.getDrawable(context, id)
+        } catch (e: Resources.NotFoundException) {
+            null
+        }
+    }
+
+    // The image of the stream [open] gives, closed after the read, also on an error; one it can't decode fails, and so
+    // does one too large for the memory.
+    private fun decodeStream(context: Context, open: () -> InputStream): Drawable {
+        val decoded = try {
+            open().use { BitmapFactory.decodeStream(it) }
+        } catch (e: OutOfMemoryError) {
+            throw LoadFailure(": it is too large to decode")
+        }
+        val bitmap = decoded ?: throw LoadFailure(": it can't be decoded")
+        return BitmapDrawable(context.resources, bitmap)
+    }
+
+    // Metro's asset: an address of the server the JavaScript bundle came from, under `/assets/`.
+    private fun isMetroAsset(address: Uri): Boolean {
+        val bundle = DevelopmentLog.bundleUrl?.let(Uri::parse) ?: return false
+        return address.host == bundle.host && address.port == bundle.port &&
+            address.path.orEmpty().startsWith(ASSETS_PATH)
+    }
+
+    // Reading from the network on the main thread for [read] only; the thread's policy comes back, also on an error.
+    private fun <T> withNetworkOnMainThread(read: () -> T): T {
+        val policy = StrictMode.getThreadPolicy()
+        StrictMode.setThreadPolicy(StrictMode.ThreadPolicy.Builder(policy).permitNetwork().build())
+        try {
+            return read()
+        } finally {
+            StrictMode.setThreadPolicy(policy)
+        }
+    }
+
+    // The cache lets its images go when the system is low on memory ([clearsOnTrim]): they load again when asked.
+    private fun listen(context: Context) {
+        if (listening) return
+        synchronized(this) {
+            if (listening) return
+            listening = true
+        }
+        context.applicationContext.registerComponentCallbacks(object : ComponentCallbacks2 {
+            override fun onTrimMemory(level: Int) {
+                if (clearsOnTrim(level)) clear()
+            }
+
+            override fun onConfigurationChanged(newConfig: Configuration) = Unit
+
+            @Deprecated("Android 14 deprecates it; onTrimMemory comes with it")
+            override fun onLowMemory() = clear()
+        })
+    }
+
+    // A sixteenth of the app's heap, at most 16 MB: the options' icons are small.
+    private fun maxBytes(): Int = (Runtime.getRuntime().maxMemory() / HEAP_PART).coerceAtMost(MAX_BYTES).toInt()
+
+    // An image the cache keeps: what makes its copies, and its size.
+    private class Entry(val state: Drawable.ConstantState, val bytes: Int) {
+        fun copy(context: Context): Drawable = state.newDrawable(context.resources).mutate()
+    }
+
+    private class Waiter(val context: Context, val done: (Drawable?) -> Unit)
+
+    // A failure the loader names itself: `Could not load image <source>`, then [why].
+    private class LoadFailure(val why: String) : IOException("Could not load image$why")
+
+    private const val FILE_SCHEME = "file:"
+    private const val ASSETS_PATH = "/assets/"
+    private const val THREAD_NAME = "ApexNavigation images"
+    private const val BYTES_PER_PIXEL = 4
+    private const val HEAP_PART = 16L
+    private const val MAX_BYTES = 16L * 1024 * 1024
+}

package/android/src/main/java/dev/apexnative/navigation/utils/ViewController.kt

@@ -59,7 +59,9 @@ private fun ViewController<*>.hostIsShown(): Boolean {
  * Runs [mounted] as the content of this screen's slot mounts into its container, and [start] on the pre-draw of that
  * frame: after React Native applied the whole mount, before the frame is drawn. At once if the content has mounted,
  * after [DRAW_WAIT_LIMIT] if it never does; while [waiting] holds. A screen prepared for its push was rendered at its
- * size and insets before: in that frame it is whole.
+ * size and insets before, so it is whole from that frame on; its push doesn't start in that frame: [start] hands it to
+ * the stack's queue, which starts the transition on a later turn, behind the calls JavaScript made before
+ * (`PendingCalls`), so the `mergeOptions` of the mount's commit has applied.
  */
 fun ViewController<*>.whenContentMounted(waiting: () -> Boolean, mounted: () -> Unit, start: () -> Unit) {
     var done = false

package/android/src/main/java/dev/apexnative/navigation/viewcontrollers/arrangement/ArrangementController.kt

@@ -10,6 +10,7 @@ import dev.apexnative.navigation.NavigationActivity
 import dev.apexnative.navigation.options.DefaultOptions
 import dev.apexnative.navigation.options.Options
 import dev.apexnative.navigation.react.ArrangementStates
+import dev.apexnative.navigation.react.events.EventEmitter
 import dev.apexnative.navigation.utils.SystemUiUtils
 import dev.apexnative.navigation.utils.WindowFolds
 import dev.apexnative.navigation.viewcontrollers.child.ChildController
@@ -146,11 +147,11 @@ class ArrangementController internal constructor(
         val single = plan.layout == ArrangementPlan.Layout.SINGLE
         if (primary is ComponentViewController) {
             val state = ArrangementStates.State(PRIMARY, layout, front = overlay, hidden = false)
-            ArrangementStates.set(activity, primary.id, state, notify)
+            ArrangementStates.set(primary.id, state, notify, EventEmitter.of(primary.jsGeneration))
         }
         if (secondary is ComponentViewController) {
             val state = ArrangementStates.State(SECONDARY, layout, front = false, hidden = single)
-            ArrangementStates.set(activity, secondary.id, state, notify)
+            ArrangementStates.set(secondary.id, state, notify, EventEmitter.of(secondary.jsGeneration))
         }
     }
 

package/android/src/main/java/dev/apexnative/navigation/viewcontrollers/bottomtabs/AppliedTabCalls.kt

@@ -0,0 +1,49 @@
+package dev.apexnative.navigation.viewcontrollers.bottomtabs
+
+import dev.apexnative.navigation.utils.ImageKey
+
+/**
+ * The last call of each kind for each item of the bar, by which [BottomTabsPresenter.run] skips a call equal to it: an
+ * icon isn't loaded and set again as a screen appears. The badge and the font always go (their defaults are read at
+ * each set). An icon whose load gave no image goes again ([failed]); a `file:` icon compares by its [ImageKey] (the
+ * file's modification time and size, read by [fileKey]), so a file written again at the same path shows. Main thread.
+ */
+internal class AppliedTabCalls(private val fileKey: (String) -> ImageKey) {
+    /** A call that runs: [isChange], the item had a call of its kind before; [image], the key of a `file:` icon. */
+    class Next(val isChange: Boolean, val image: ImageKey?)
+
+    private class Applied(val call: TabItems.Call, val image: ImageKey?, var failed: Boolean = false)
+
+    private val last = HashMap<Pair<Int, Class<*>>, Applied>()
+
+    /** How [call] runs, and it is the last of its kind for its item from now on; none when it is skipped. */
+    fun next(call: TabItems.Call): Next? {
+        val key = call.index to call.javaClass
+        val before = last[key]
+        val image = uriOf(call)?.takeIf { it.startsWith(FILE_SCHEME) }?.let(fileKey)
+        val always = call is TabItems.Call.Badge || call is TabItems.Call.Font
+        if (!always && before != null && before.call == call && !before.failed && before.image == image) return null
+        last[key] = Applied(call, image)
+        return Next(isChange = before != null, image = image)
+    }
+
+    /** The icon of [call] didn't load: the same call goes again. */
+    fun failed(call: TabItems.Call) {
+        last[call.index to call.javaClass]?.takeIf { it.call == call }?.failed = true
+    }
+
+    /** The bar goes: every call goes again. */
+    fun clear() {
+        last.clear()
+    }
+
+    private fun uriOf(call: TabItems.Call): String? = when (call) {
+        is TabItems.Call.Icon -> call.uri
+        is TabItems.Call.SelectedIcon -> call.uri
+        else -> null
+    }
+
+    private companion object {
+        const val FILE_SCHEME = "file:"
+    }
+}

package/android/src/main/java/dev/apexnative/navigation/viewcontrollers/bottomtabs/BottomTabsController.kt

@@ -26,14 +26,12 @@ import dev.apexnative.navigation.utils.scrollToTop
 import dev.apexnative.navigation.viewcontrollers.child.ChildControllersRegistry
 import dev.apexnative.navigation.viewcontrollers.component.ComponentViewController
 import dev.apexnative.navigation.viewcontrollers.component.RestPlace
-import dev.apexnative.navigation.viewcontrollers.component.ScreenReadiness
 import dev.apexnative.navigation.viewcontrollers.navigator.BackCallbackState
 import dev.apexnative.navigation.viewcontrollers.navigator.Navigator
 import dev.apexnative.navigation.viewcontrollers.parent.ContainerBackground
 import dev.apexnative.navigation.viewcontrollers.parent.ParentController
 import dev.apexnative.navigation.viewcontrollers.stack.StackController
 import dev.apexnative.navigation.viewcontrollers.stack.fab.FabPlacement
-import dev.apexnative.navigation.viewcontrollers.stack.topbar.BarComponents
 import dev.apexnative.navigation.viewcontrollers.viewcontroller.Presenter
 import dev.apexnative.navigation.viewcontrollers.viewcontroller.ViewController
 import dev.apexnative.navigation.views.animations.FadeThrough
@@ -74,6 +72,10 @@ class BottomTabsController(
     private var pendingSelected: (() -> Unit)? = null
     // Ends the fade through of a switch still running, with its events.
     private var endSwitch: (() -> Unit)? = null
+
+    // The made tabs that didn't show at the last repaint (new default options, a light/dark switch): each is repainted
+    // as it is selected, not while hidden.
+    private val staleTabs = mutableSetOf<ViewController<*>>()
     // The bar goes with a stack's transition: the options of the new top don't move it themselves.
     private var riding = false
     private var restAttached = false
@@ -247,7 +249,7 @@ class BottomTabsController(
     // `mergeOptions` with the tabs' id: their own options, then what they show, then the layouts around without
     // `bottomTabs`; the one-shot options act once, also while the view isn't shown.
     override fun mergeOptions(options: Options) {
-        this.options = this.options.copy().mergeWith(options)
+        mergeOwnOptions(options)
         applyMerge(options, null)
         performOnParentController { it.mergeChildOptions(withoutBottomTabs(options), this) }
     }
@@ -311,8 +313,10 @@ class BottomTabsController(
     private enum class How { Press, Code, Back }
 
     /**
-     * A tap on the tab at [index], on the bar or on its cell of the custom row: its `ANN.BottomTabPressed` first, then
-     * the selection, the repeat, or nothing, as its resolved options say.
+     * A tap on the tab at [index], on the bar or on its cell of the custom row, the one path of both: a switch still
+     * running ends first, with its `ANN.BottomTabSelected`; then this press's `ANN.BottomTabPressed`, then the
+     * selection (`ANN.BottomTabSelected` after the new screen's DidAppear), the repeat (the pop's own events), or
+     * nothing, as its resolved options say. The same order as `-[ANNBottomTabsController pressTabAtIndex:source:]`.
      */
     internal fun onTabPressed(index: Int) {
         if (isDestroyed || index !in tabs.indices) return
@@ -363,6 +367,9 @@ class BottomTabsController(
         }
         selectedIndex = index
         attach(index)
+        // A tab hidden at a repaint takes it now, before its screens appear: its bar's parts, its search's and its
+        // FAB's colors follow the theme and the defaults only through a repaint.
+        if (staleTabs.remove(shown)) Navigator.repaintLayer(shown)
         peekView()?.bar?.let {
             it.setCurrentItem(index, false)
             it.onCustomItemViewSelectionChanged(index)
@@ -370,6 +377,9 @@ class BottomTabsController(
         // A layer that waits for the tabs waits for the tab they show now.
         navigator?.shownScreensChanged(this)
         if (onScreen) AppearanceDispatcher.beginTransition(listOf(shown))
+        // From code and by back the state goes at once, as on iOS: `selectTab` resolves on it, and the command after
+        // it must act in this tab, not in the one still fading out.
+        if (how != How.Press) AppearanceDispatcher.reportState()
         if (views == null) return switched(index, previous, how, onScreen, hasViews = false)
         endSwitch = views.switch(shown, left, animated = onScreen) {
             endSwitch = null
@@ -381,8 +391,8 @@ class BottomTabsController(
      * The switch to the tab at [index] from [previous] ended: what went disappears, what came appears — unless the tabs
      * stopped showing during the fade (a modal over them): it appears when they show again; then for a press
      * `ANN.BottomTabSelected` right after the new screen's DidAppear and the left tab's `popToRootOnBlur`, with the state
-     * as one update after them; from code and by back, `popToRootOnBlur` and the state at once. [onScreen]: the switch
-     * started on screen.
+     * as one update after them; from code and by back, `popToRootOnBlur` and the state, which went at the start too
+     * ([select]). [onScreen]: the switch started on screen.
      */
     private fun switched(index: Int, previous: Int, how: How, onScreen: Boolean, hasViews: Boolean) {
         val left = tabs[previous]
@@ -592,8 +602,8 @@ class BottomTabsController(
         }
     }
 
-    // The repaint: the bar, the items of every tab, the row, then the made tabs that don't show, which the pass over
-    // what shows doesn't reach.
+    // The repaint: the bar, the items of every tab, the row. Only what shows is repainted (the pass over what shows
+    // reaches the selected tab); a made tab that doesn't show is repainted when it is selected ([staleTabs]).
     internal fun repaint(options: Options) {
         if (isDestroyed) return
         ContainerBackground.apply(this, options)
@@ -603,7 +613,7 @@ class BottomTabsController(
             if (usesRow) layout.bar.customRowOptions = options.bottomTabs.customRow.copy()
         }
         cells.forEachIndexed { index, cell -> cell.update(cellState(index)) }
-        tabs.forEach { if (it !== currentChild && it.isViewCreated) Navigator.repaintLayer(it) }
+        tabs.forEach { if (it !== currentChild && it.isViewCreated) staleTabs += it }
     }
 
     // The custom row: the cells first into the bar's external host, then the row holds them; its look follows the tabs'
@@ -651,15 +661,12 @@ class BottomTabsController(
     private fun makeCell(index: Int): CustomBottomTabItemView {
         val component = itemOptions(index).component
         val componentId = component.componentId.get(null) ?: "$id.$index"
-        ScreenReadiness.setRendersAtOnce(componentId, true)
-        // Another live root has the id (the same layout set again before the old one went): what it rendered isn't
-        // this one's; the id's readiness goes only with its last root (as the bar's roots).
-        if (BarComponents.isLive(componentId)) ScreenReadiness.forgetRender(componentId)
-        BarComponents.rootMade(componentId)
         val cell = CustomBottomTabItemView(activity)
         val state = cellState(index)
-        cell.show(ReactView(activity, componentId, component.name.get(""), cell.bundleOf(state)), state)
-        cell.onDestroyed = { if (BarComponents.rootStopped(componentId)) ScreenReadiness.remove(componentId) }
+        // Another live root may have the id (the same layout set again before the old one went): each answers by the
+        // render of its own surface, and the id's readiness goes with its last root.
+        val root = ReactView(activity, componentId, component.name.get(""), cell.bundleOf(state), rendersAtOnce = true)
+        cell.show(root, state)
         return cell
     }
 
@@ -681,6 +688,7 @@ class BottomTabsController(
     override fun destroy() {
         if (isDestroyed) return
         pendingSelected = null
+        staleTabs.clear()
         super.destroy()
         // A switch still running ends with its views at rest, without events: the tabs are gone.
         endSwitch?.invoke()

package/android/src/main/java/dev/apexnative/navigation/viewcontrollers/bottomtabs/BottomTabsPresenter.kt

@@ -6,7 +6,6 @@ import android.animation.AnimatorSet
 import android.animation.ObjectAnimator
 import android.app.Activity
 import android.graphics.Color
-import android.graphics.drawable.Drawable
 import android.view.View
 import android.view.animation.LinearInterpolator
 import android.view.animation.PathInterpolator
@@ -20,8 +19,8 @@ import dev.apexnative.navigation.options.params.LayoutDirection
 import dev.apexnative.navigation.options.params.ThemeColour
 import dev.apexnative.navigation.options.parsers.TypefaceLoader
 import dev.apexnative.navigation.system.SystemUiOwner
-import dev.apexnative.navigation.utils.ImageLoader
-import dev.apexnative.navigation.utils.ImageLoadingListenerAdapter
+import dev.apexnative.navigation.utils.ImageRequests
+import dev.apexnative.navigation.utils.OptionImages
 import dev.apexnative.navigation.utils.TestIds
 import dev.apexnative.navigation.utils.UiUtils
 import dev.apexnative.navigation.viewcontrollers.viewcontroller.Presenter
@@ -67,8 +66,9 @@ internal open class BottomTabsPresenter(activity: Activity) : Presenter(activity
 
     private var layout: BottomTabsLayout? = null
     private val typefaces = TypefaceLoader(activity)
-    private val icons = HashMap<String, Drawable>()
-    private val applied = HashMap<Pair<Int, Class<*>>, TabItems.Call>()
+    // The icons of the items by item and kind (selected or not): those of the cache at once, the others as below.
+    private val icons = ImageRequests<Pair<Int, Boolean>>(OptionImages.source(activity))
+    private val applied = AppliedTabCalls(icons::key)
     private var motion: Animator? = null
     private var anyIcon = false
     private var testId: String? = null
@@ -100,25 +100,24 @@ internal open class BottomTabsPresenter(activity: Activity) : Presenter(activity
 
     /**
      * Runs [calls] on the bar's items; a call equal to the last of its kind for its item is skipped (an icon isn't
-     * loaded and set again as a screen appears). The badge always goes: its default colors are read at each set.
+     * loaded and set again as a screen appears), except the badge and the font, an icon that didn't load and a `file:`
+     * icon whose file changed ([AppliedTabCalls]).
      */
     open fun run(calls: List<TabItems.Call>) {
         val bar = layout?.bar ?: return
         for (call in calls) {
             if (call is TabItems.Call.TestId && !itemTestIds) continue
-            val key = call.index to call.javaClass
-            if (call !is TabItems.Call.Badge && call !is TabItems.Call.Font && applied[key] == call) continue
-            applied[key] = call
-            run(bar, call)
+            val next = applied.next(call) ?: continue
+            run(bar, call, next)
         }
     }
 
-    private fun run(bar: BottomTabs, call: TabItems.Call) {
+    private fun run(bar: BottomTabs, call: TabItems.Call, next: AppliedTabCalls.Next) {
         val index = call.index
         when (call) {
             is TabItems.Call.Title -> bar.setText(index, call.text)
-            is TabItems.Call.Icon -> iconOf(call.uri)?.let { bar.setIcon(index, it) }
-            is TabItems.Call.SelectedIcon -> iconOf(call.uri)?.let { bar.setSelectedIcon(index, it) }
+            is TabItems.Call.Icon -> icon(bar, call, call.uri, false, next)
+            is TabItems.Call.SelectedIcon -> icon(bar, call, call.uri, true, next)
             is TabItems.Call.Colors -> {
                 bar.setIconActiveColor(index, call.iconActive)
                 bar.setIconInactiveColor(index, call.iconInactive)
@@ -344,17 +343,19 @@ internal open class BottomTabsPresenter(activity: Activity) : Presenter(activity
 
     private fun colorOf(colour: ThemeColour): Int? = colour.get(activity, null)
 
-    // Icons load as they apply and never throw: an icon that doesn't load leaves the item as it was.
-    private fun iconOf(uri: String): Drawable? {
-        icons[uri]?.let { return it.constantState?.newDrawable()?.mutate() ?: it }
-        var loaded: Drawable? = null
-        ImageLoader().loadIcon(activity, uri, object : ImageLoadingListenerAdapter() {
-            override fun onComplete(drawable: Drawable) {
-                loaded = drawable
-            }
-        })
-        loaded?.let { icons[uri] = it }
-        return loaded
+    // Icons never throw: one that doesn't load leaves the item without it (without its selected icon, the item shows
+    // its icon when selected). An item's first icon loads at once, its tab's first frame shows it; a change of it on
+    // the bar that shows loads off the main thread when it can, and the item takes it when ready, unless a newer icon
+    // of the item came first.
+    // The key of a `file:` icon was built for the comparison: the request takes it, its file read once.
+    private fun icon(bar: BottomTabs, call: TabItems.Call, uri: String, selected: Boolean, next: AppliedTabCalls.Next) {
+        val index = call.index
+        val key = next.image ?: icons.key(uri)
+        icons.request(index to selected, key, mayWait = next.isChange && bar.isAttachedToWindow) { icon ->
+            if (icon == null) applied.failed(call)
+            val shown = layout?.bar ?: return@request
+            if (selected) shown.setSelectedIcon(index, icon) else shown.setIcon(index, icon)
+        }
     }
 
     private companion object {

package/android/src/main/java/dev/apexnative/navigation/viewcontrollers/component/ComponentViewController.kt

@@ -14,6 +14,7 @@ import dev.apexnative.navigation.react.ScreenInsets
 import dev.apexnative.navigation.react.ScreenRegions
 import dev.apexnative.navigation.react.events.AppearanceDispatcher
 import dev.apexnative.navigation.react.events.ComponentType
+import dev.apexnative.navigation.react.events.EventEmitter
 import dev.apexnative.navigation.slots.SlotScreenView
 import dev.apexnative.navigation.system.SystemUiOwner
 import dev.apexnative.navigation.viewcontrollers.child.ChildController
@@ -177,8 +178,11 @@ class ComponentViewController(
             topFree = parent?.leavesTopEdgeFree(this) == true,
             bottomFree = parent?.leavesBottomEdgeFree(this) == true,
         )
-        ScreenInsets.update(activity, id, insets, ScreenSafeArea.padding(insets, edges))
-        ScreenRegions.update(activity, id, Rect(place.left, place.top, place.right, place.bottom), windowInsets)
+        // The events of the screen go to the JavaScript it was made for, and to no other.
+        val emitter = EventEmitter.of(jsGeneration)
+        ScreenInsets.update(id, insets, ScreenSafeArea.padding(insets, edges), emitter)
+        val area = Rect(place.left, place.top, place.right, place.bottom)
+        ScreenRegions.update(activity, id, area, windowInsets, emitter)
     }
 
     // A layout asked for on the content or on a view around it: it isn't in its place yet.

package/android/src/main/java/dev/apexnative/navigation/viewcontrollers/component/ContentReadiness.kt

@@ -4,8 +4,8 @@ import dev.apexnative.navigation.viewcontrollers.viewcontroller.ViewController
 
 /**
  * Whether a screen's content rendered, which a command waits for before the screen comes in: a new root (`setRoot`),
- * a push with `waitForRender: true`, the new top of a `setStackRoot`. A wait never listens to the readiness store
- * itself: the content keeps the one listener of its id and tells every waiter. Main thread only.
+ * a push (unless `waitForRender: false`), the new top of a `setStackRoot`. A wait never listens to the readiness store
+ * itself: the content keeps its own listener of its id and tells every waiter. Main thread only.
  */
 internal interface Readiness {
     /** The content of [screen] rendered; a screen without content to wait for is ready. */