The quiet field behind empty and error screens, and screens that slide in from where they lead (refs #23) dce8ebd2482a

- **The hub's living backgrounds (#23):** the website's backdrops come to the phone, the same Rust scenes (copied from OxygenHub's crates/backdrop by scripts/sync-backdrop.sh) stepped in rust-core and drawn by the app. Sign-in has the OxygenHub mark, which answers a finger; the dashboard has Your sky, your repositories and their last 30 days of pushes, proposals, issues, releases and runs, each mark a real event (OxygenHub's `GET /user/sky`; a hub without it shows the quiet field), drawing near your finger and naming the repository it rests by, behind cards it shows through. Live runs and jobs pulse; empty and error screens have the quiet field the hub's error pages have; a screen opened slides in a little from the side it leads to, and goes back the way it came. As on the web, drawing slows 3 s after the last touch and stops after 2 minutes, and it holds still with the system's animations off or battery saver on.

import androidx.compose.ui.platform.LocalInspectionMode

import kotlinx.coroutines.isActive

import uniffi.rust_core.BackdropLabel

    // Previews and screenshot tests have no Rust core to step a scene with.

    if (LocalInspectionMode.current) {

        Box(modifier) { content() }

        return

    }

import io.oxygenhub.android.ui.backdrop.Backdrop

import uniffi.rust_core.Backdrop as Scene

    // The quiet field behind it, as behind the hub's error pages (#23).

    Backdrop(key = Unit, make = { still -> Scene.adrift(still) }, modifier = modifier.fillMaxSize()) {

        Column(

            Modifier.fillMaxSize().padding(32.dp),

            horizontalAlignment = Alignment.CenterHorizontally,

            verticalArrangement = Arrangement.Center,

        ) {

            Icon(icon, contentDescription = null, modifier = Modifier.size(48.dp), tint = MaterialTheme.colorScheme.onSurfaceVariant)

            Spacer(Modifier.height(16.dp))

            Text(title, style = MaterialTheme.typography.titleMedium, textAlign = TextAlign.Center)

            Spacer(Modifier.height(8.dp))

            Text(body, style = MaterialTheme.typography.bodyMedium, color = MaterialTheme.colorScheme.onSurfaceVariant, textAlign = TextAlign.Center)

            extra()

        }

import androidx.compose.animation.AnimatedContentTransitionScope.SlideDirection

import androidx.compose.animation.core.tween

import androidx.compose.animation.fadeIn

import androidx.compose.animation.fadeOut

import io.oxygenhub.android.ui.owners.OwnerScreen

import io.oxygenhub.android.ui.owners.OwnerViewModel

        NavHost(

            nav,

            startDestination = start.route,

            // A screen opened comes in a little from the side it leads to as it fades in, and

            // goes back the way it came (#23): where you are going reads in the motion.

            enterTransition = { slideIntoContainer(SlideDirection.Start, tween(NAV_MS), initialOffset = { it / 8 }) + fadeIn(tween(NAV_MS)) },

            exitTransition = { fadeOut(tween(NAV_MS * 2 / 3)) },

            popEnterTransition = { fadeIn(tween(NAV_MS)) },

            popExitTransition = { slideOutOfContainer(SlideDirection.End, tween(NAV_MS), targetOffset = { it / 8 }) + fadeOut(tween(NAV_MS * 2 / 3)) },

        ) {

/** How long a screen takes to come in (#23). */

private const val NAV_MS = 300