tawasuyu

tawasuyu/llimphi

Sovereign retained-mode GPU UI framework in Rust (wgpu+vello+taffy+parley), Elm loop, 40+ widgets.

Rust 614Markdown 274TOML 149RON 310606 Definitions

⎇ main widgets/router/LEEME.md Markdown · 55 lines · 2.2 KB History raw

chore: refresco desde el monorepo — 27 crates nuevos (anim, lottie, svg, mesh, image, layer, test, wire-view, widgets rag-sidebar/router/lazy-list/rive-button) y sync de los 95 existentes 93253cc22 · Sergio ·

1# llimphi-widget-router
2
3*Read this in English: [README.md](README.md).*
4
5Navegación por **pila de rutas** con transiciones de página. Es el análogo del `Navigator` de Flutter, resuelto a la Elm:
6
7- La pila (`RouteStack`) vive en el `Model` del App — pura, testeable,
8  serializable si `R` lo es. El widget no retiene nada.
9- `router_view` pinta **sólo la ruta actual** y compone
10  `View::animated_switch_from` (compositor) para la transición: al cambiar
11  la ruta, la página vieja sale como fantasma direccional y la nueva entra
12  desde el lado opuesto. La dirección la decide el último op de la pila:
13  **push entra desde la derecha, pop desde la izquierda** (LTR clásico).
14- Los **Hero** cruzan rutas gratis: un nodo con `View::hero(key, dur)` (o
15  `hero_view` del widget hero) presente en la página saliente y en la
16  entrante con la misma `key` **vuela** entre sus dos rects — el
17  `HeroRegistry` del runtime ya enlaza identidad entre frames.
18
19## Uso
20```ignore
21// Model
22struct Model { nav: RouteStack<Ruta> }
23#[derive(Clone, PartialEq, Hash)]
24enum Ruta { Lista, Detalle(u32), Config }
25
26// update
27Msg::Abrir(id) => m.nav.push(Ruta::Detalle(id)),
28Msg::Volver    => { m.nav.pop(); }
29
30// view
31router_view(1, &m.nav, PageTransition::Slide, motion::SLOW, move |r| {
32    match r {
33        Ruta::Lista      => lista_view(m),
34        Ruta::Detalle(i) => detalle_view(m, *i),
35        Ruta::Config     => config_view(m),
36    }
37})
38```
39## Limitaciones honestas
40
41- ~~El fantasma se pinta encima del contenido nuevo~~ → resuelto con el
42  **scene-split de fantasmas** (`SwitchStyle::exit_under`): la página
43  saliente se pinta DEBAJO de la entrante, en su posición z real. Eso
44  habilita `PageTransition::Cover` — push opaco estilo UIKit (la nueva
45  tapa sin fade; el pop desliza la vieja por encima, revelando).
46- `router_view` usa el seam `LayoutBuilder` para conocer el slot; el límite
47  v1 del seam es **sin anidamiento** — si una página contiene otro
48  `layout_builder` (p. ej. `fitted_box`), usar `router_view_sized` con el
49  tamaño que la app ya trackea por `on_resize`.
50- Una transición en curso no se "revierte" al conmutar de nuevo: la
51  variante cambia y arranca la nueva (el fantasma anterior sigue su fade).
52
53---
54
55Parte de **llimphi** — ver [llimphi](../../LEEME.md).

LEEME.md

llimphi-widget-router

Read this in English: README.md.

Navegación por pila de rutas con transiciones de página. Es el análogo del Navigator de Flutter, resuelto a la Elm:

Uso

// Model
struct Model { nav: RouteStack<Ruta> }
#[derive(Clone, PartialEq, Hash)]
enum Ruta { Lista, Detalle(u32), Config }

// update
Msg::Abrir(id) => m.nav.push(Ruta::Detalle(id)),
Msg::Volver    => { m.nav.pop(); }

// view
router_view(1, &m.nav, PageTransition::Slide, motion::SLOW, move |r| {
    match r {
        Ruta::Lista      => lista_view(m),
        Ruta::Detalle(i) => detalle_view(m, *i),
        Ruta::Config     => config_view(m),
    }
})

Limitaciones honestas


Parte de llimphi — ver llimphi.