Skip to main content

Crate repose_ui

Crate repose_ui 

Source
Expand description

§Views, Modifiers, and Layout

Repose UI is built around three core ideas:

  • View: an immutable description of a UI node.
  • Modifier: layout, styling, and interaction hints attached to a View.
  • Layout + paint: a separate pass (layout_and_paint) that turns the View tree into a Scene + hit regions using the Taffy layout engine.

§Views

A View is a lightweight value that describes what to show, not how it is rendered. It is cheap to create and you are expected to rebuild the entire view tree on each frame:

use repose_core::*;
use repose_ui::*;

fn Counter(count: i32, on_inc: impl Fn() + 'static) -> View {
    Column(Modifier::new().padding(16.0)).child((
        Text(format!("Count = {count}")),
        Button("Increment".into_children(), on_inc),
    ))
}

Internally, a View has:

  • id: ViewId - assigned during composition/layout.
  • kind: ViewKind - which widget it is (Text, Button, ScrollV, etc.).
  • modifier: Modifier - layout/styling/interaction metadata.
  • children: Vec<View> - owned child views.

Views are pure data: they do not hold state or references into platform APIs. State lives in signals / remember_* and platform integration happens in the runner (repose-platform).

§Modifiers

Modifier describes how a view participates in layout and hit‑testing:

  • Size hints: size, width, height, min_size, max_size, fill_max_size, fill_max_width, fill_max_height.
  • Box model: padding, padding_values.
  • Visuals: background, background_brush, border, clip_rounded, alpha, transform.
  • Flex / grid: flex_grow, flex_shrink, flex_basis, align_self, justify_content, align_items, grid, grid_span.
  • Positioning: absolute(), offset(..) for overlay / Stack / FABs.
  • Interaction: clickable(), pointer callbacks, on_scroll, semantics.
  • Custom paint: painter (used by repose-canvas).

Example:

use repose_core::*;
use repose_ui::*;

fn CardExample() -> View {
    Box(
        Modifier::new()
            .padding(16.0)
            .background(theme().surface)
            .border(1.0, theme().outline, 8.0)
            .clip_rounded(8.0),
    )
    .child(Text("Hello, Repose!"))
}

Modifiers are merged into a Taffy Style inside layout_and_paint. Most values are specified in density‑independent pixels (dp) and converted to physical pixels (px) using the current Density local.

§Layout

Layout is a pure function:

pub fn layout_and_paint(
    root: &View,
    size_px: (u32, u32),
    textfield_states: &HashMap<u64, Rc<RefCell<TextFieldState>>>,
    interactions: &Interactions,
    focused: Option<u64>,
) -> (Scene, Vec<HitRegion>, Vec<SemNode>);

It:

  1. Clones the root View and assigns stable ViewIds.
  2. Builds a parallel Taffy tree and computes layout for the given window size.
  3. Walks the tree to:
    • Emit SceneNodes for visuals (rects, text, images, scrollbars, etc.).
    • Build HitRegions for input routing (clicks, pointer events, scroll).
    • Build SemNodes for accessibility / semantics.

Row, Column, Stack, Grid, ScrollV and ScrollXY are all special ViewKinds that map into Taffy styles and additional paint/hit logic.

Because layout + paint are separate from the platform runner, you can reuse the same UI code on desktop, Android, and other platforms.

Re-exports§

pub use layout::IntrinsicSizeMode;
pub use lazy::LazyColumn;
pub use lazy::LazyColumnState;
pub use lazy::LazyGridState;
pub use lazy::LazyRow;
pub use lazy::LazyRowState;
pub use lazy::LazyVerticalGrid;
pub use lazy::LazyVerticalStaggeredGrid;
pub use lazy::LazyVerticalStaggeredGridState;
pub use lazy::SimpleList;
pub use subcompose::BoxWithConstraints;
pub use subcompose::SubcomposeLayout;
pub use subcompose::box_with_constraints_with_key;
pub use subcompose::subcompose_hash_key;
pub use subcompose::subcompose_layout_with_slots;
pub use subcompose::subcompose_with_key;
pub use subcompose::subcompose_with_key_slots;
pub use selection::SelectableText;
pub use textfield::KeyboardOptions;
pub use textfield::TextArea;
pub use textfield::TextAreaEx;
pub use textfield::TextField;
pub use textfield::TextFieldEx;
pub use textfield::TextFieldState;

Modules§

adaptive
Adaptive layouts that respond to the current WindowSizeClass. Currently provides ListDetailPaneScaffold: the list and the detail render side-by-side on Medium/Expanded widths, and only the selected pane renders on Compact.
anim
anim_ext
color_picker
gestures
layout
lazy
overlay
pager
scroll
Scroll model
selection
Selectable text. SelectableText mirrors Compose’s SelectionContainer for a single Text view: drag to select a byte range, and a highlight rect is painted on top of the glyphs. Single-line selection is pixel-accurate; multi-line tracks the range but the highlight is drawn per-line.
subcompose
SubcomposeLayout and BoxWithConstraints.
textfield
TextField model
windowing

Structs§

Interactions

Traits§

ImageExt
IntoChildren
TextStyle
Method styling
ViewExt
Extension trait for child building

Functions§

AnnotatedText
Create a text view with rich text spans (AnnotatedString).
Box
Center
Align self-center shorthand.
Column
DragValue
A drag-to-change numeric value field (like egui’s DragValue).
Expander
FlowColumn
A vertically-oriented flow layout that wraps children to new columns when they exceed the available height. Equivalent to Column with flex_wrap(Wrap).
FlowRow
A horizontally-oriented flow layout that wraps children to new rows when they exceed the available width. Equivalent to Row with flex_wrap(Wrap).
Grid
Image
OverlayHost
Row
ScrollDeprecated
Space
Spacer
Stack
Text
TreeRow
A single row in a tree view.
ZStack
layout_and_paint
Layout and paint with TextField state injection (Taffy 0.9 API)