Text, many performance improvements
This commit is contained in:
10
examples/text_paragraph_demo/Cargo.toml
Normal file
10
examples/text_paragraph_demo/Cargo.toml
Normal file
@@ -0,0 +1,10 @@
|
||||
[package]
|
||||
name = "ruin_ui_text_paragraph_demo"
|
||||
version = "0.1.0"
|
||||
edition = "2024"
|
||||
|
||||
[dependencies]
|
||||
ruin_runtime = { package = "ruin-runtime", path = "../../lib/runtime" }
|
||||
ruin_ui = { path = "../../lib/ui" }
|
||||
ruin_ui_platform_wayland = { path = "../../lib/ui_platform_wayland" }
|
||||
ruin_ui_renderer_wgpu = { path = "../../lib/ui_renderer_wgpu" }
|
||||
193
examples/text_paragraph_demo/src/main.rs
Normal file
193
examples/text_paragraph_demo/src/main.rs
Normal file
@@ -0,0 +1,193 @@
|
||||
use std::error::Error;
|
||||
|
||||
use ruin_ui::{
|
||||
Color, Edges, Element, SceneSnapshot, TextAlign, TextStyle, TextSystem, UiSize, WindowSpec,
|
||||
layout_scene_with_text_system,
|
||||
};
|
||||
use ruin_ui_platform_wayland::WaylandWindow;
|
||||
use ruin_ui_renderer_wgpu::{RenderError, WgpuSceneRenderer};
|
||||
|
||||
const INTRO: &str = "RUIN is exploring a retained layout tree backed by explicit scene building, a dedicated platform thread, and a renderer that can stay simple while the higher-level UI model evolves. This example is intentionally calm: no animated panels, no pulsing widths, just a document-like surface that makes paragraph behavior easier to inspect.";
|
||||
const BODY_ONE: &str = "Paragraph widgets are the next useful layer above raw text leaves. They should be able to wrap naturally inside containers, respect alignment, clamp to a maximum number of lines when appropriate, and participate in layout without forcing every example to become a custom text experiment. That gets us closer to real application surfaces instead of just proving that glyphs can reach the screen.";
|
||||
const BODY_TWO: &str = "This demo keeps the overall layout mostly static while still responding to window resizing. The centered title, the body copy, and the clamped sidebar notes all use the same retained layout pipeline, but they exercise different paragraph semantics. It should be a much less exhausting place to look at text than the reactive dashboard stress test.";
|
||||
const SIDEBAR_NOTE: &str = "Clamped note: the renderer now uses a shared glyph atlas for prepared text, so the remaining debug-build cost mostly comes from paragraph layout and scene building rather than per-frame CPU text compositing.";
|
||||
const FOOTER: &str = "Next up after this slice: richer paragraph/block rules, then inline style runs, then interactive text editing and selection.";
|
||||
|
||||
#[ruin_runtime::main]
|
||||
fn main() -> Result<(), Box<dyn Error>> {
|
||||
let mut viewport = UiSize::new(1040.0, 760.0);
|
||||
let mut version = 1_u64;
|
||||
let mut text_system = TextSystem::new();
|
||||
let mut scene = build_scene(viewport, version, &mut text_system);
|
||||
|
||||
let mut window = WaylandWindow::open(
|
||||
WindowSpec::new("RUIN paragraph demo")
|
||||
.app_id("dev.ruin.text-paragraph-demo")
|
||||
.requested_inner_size(viewport),
|
||||
)?;
|
||||
let mut renderer = WgpuSceneRenderer::new(
|
||||
window.surface_target(),
|
||||
viewport.width as u32,
|
||||
viewport.height as u32,
|
||||
)?;
|
||||
|
||||
window.request_redraw();
|
||||
println!("Opening RUIN paragraph demo window...");
|
||||
|
||||
while window.is_running() {
|
||||
window.dispatch()?;
|
||||
if let Some(frame) = window.prepare_frame() {
|
||||
if frame.resized {
|
||||
renderer.resize(frame.width, frame.height);
|
||||
viewport = UiSize::new(frame.width as f32, frame.height as f32);
|
||||
version = version.wrapping_add(1);
|
||||
scene = build_scene(viewport, version, &mut text_system);
|
||||
window.request_redraw();
|
||||
}
|
||||
|
||||
match renderer.render(&scene) {
|
||||
Ok(()) => {}
|
||||
Err(RenderError::Lost | RenderError::Outdated) => {
|
||||
renderer.resize(frame.width, frame.height);
|
||||
window.request_redraw();
|
||||
}
|
||||
Err(RenderError::Timeout | RenderError::Occluded | RenderError::Validation) => {
|
||||
window.request_redraw();
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
Ok(())
|
||||
}
|
||||
|
||||
fn build_scene(viewport: UiSize, version: u64, text_system: &mut TextSystem) -> SceneSnapshot {
|
||||
let tree = build_document_tree(viewport);
|
||||
layout_scene_with_text_system(version, viewport, &tree, text_system)
|
||||
}
|
||||
|
||||
fn build_document_tree(viewport: UiSize) -> Element {
|
||||
let gutter = (viewport.width * 0.025).clamp(18.0, 30.0);
|
||||
let sidebar_width = (viewport.width * 0.28).clamp(220.0, 320.0);
|
||||
|
||||
Element::column()
|
||||
.background(Color::rgb(0x0F, 0x13, 0x1E))
|
||||
.padding(Edges::all(gutter))
|
||||
.gap(gutter)
|
||||
.children([
|
||||
Element::column()
|
||||
.padding(Edges::all(gutter))
|
||||
.gap(gutter * 0.45)
|
||||
.background(Color::rgb(0x16, 0x1D, 0x2B))
|
||||
.children([
|
||||
Element::paragraph(
|
||||
"RUIN paragraph demo",
|
||||
TextStyle::new(34.0, Color::rgb(0xF5, 0xF7, 0xFB))
|
||||
.with_line_height(40.0)
|
||||
.with_align(TextAlign::Center),
|
||||
),
|
||||
Element::paragraph(
|
||||
INTRO,
|
||||
TextStyle::new(18.0, Color::rgb(0xC9, 0xD2, 0xE3))
|
||||
.with_line_height(28.0)
|
||||
.with_align(TextAlign::Center),
|
||||
),
|
||||
]),
|
||||
Element::row().flex(1.0).gap(gutter).children([
|
||||
Element::column()
|
||||
.flex(1.0)
|
||||
.gap(gutter)
|
||||
.children([
|
||||
text_card("Why paragraphs matter", BODY_ONE, gutter),
|
||||
text_card("Calmer inspection surface", BODY_TWO, gutter),
|
||||
Element::column()
|
||||
.padding(Edges::all(gutter))
|
||||
.gap(gutter * 0.45)
|
||||
.background(Color::rgb(0x1A, 0x22, 0x31))
|
||||
.children([
|
||||
Element::paragraph(
|
||||
"Next direction",
|
||||
TextStyle::new(20.0, Color::rgb(0xF5, 0xF7, 0xFB))
|
||||
.with_line_height(26.0),
|
||||
),
|
||||
Element::paragraph(
|
||||
FOOTER,
|
||||
TextStyle::new(17.0, Color::rgb(0xD8, 0xDF, 0xED))
|
||||
.with_line_height(26.0),
|
||||
),
|
||||
]),
|
||||
]),
|
||||
Element::column()
|
||||
.width(sidebar_width)
|
||||
.gap(gutter)
|
||||
.children([
|
||||
sidebar_card(
|
||||
"Centered pull quote",
|
||||
"“A retained layout tree is only really convincing once text can participate in it naturally.”",
|
||||
gutter,
|
||||
Some(TextAlign::Center),
|
||||
None,
|
||||
),
|
||||
sidebar_card(
|
||||
"Clamped note",
|
||||
SIDEBAR_NOTE,
|
||||
gutter,
|
||||
None,
|
||||
Some(4),
|
||||
),
|
||||
sidebar_card(
|
||||
"Status",
|
||||
"Static layout, responsive resize, paragraph wrapping, centered headings, and line clamping all share the same UI pipeline now.",
|
||||
gutter,
|
||||
Some(TextAlign::End),
|
||||
None,
|
||||
),
|
||||
]),
|
||||
]),
|
||||
])
|
||||
}
|
||||
|
||||
fn text_card(title: &str, body: &str, gutter: f32) -> Element {
|
||||
Element::column()
|
||||
.padding(Edges::all(gutter))
|
||||
.gap(gutter * 0.45)
|
||||
.background(Color::rgb(0x18, 0x20, 0x2F))
|
||||
.children([
|
||||
Element::paragraph(
|
||||
title,
|
||||
TextStyle::new(24.0, Color::rgb(0xF4, 0xF7, 0xFF)).with_line_height(30.0),
|
||||
),
|
||||
Element::paragraph(
|
||||
body,
|
||||
TextStyle::new(18.0, Color::rgb(0xD9, 0xE0, 0xEE)).with_line_height(29.0),
|
||||
),
|
||||
])
|
||||
}
|
||||
|
||||
fn sidebar_card(
|
||||
title: &str,
|
||||
body: &str,
|
||||
gutter: f32,
|
||||
align: Option<TextAlign>,
|
||||
max_lines: Option<usize>,
|
||||
) -> Element {
|
||||
let mut body_style = TextStyle::new(16.0, Color::rgb(0xD4, 0xDB, 0xEA)).with_line_height(25.0);
|
||||
if let Some(align) = align {
|
||||
body_style = body_style.with_align(align);
|
||||
}
|
||||
if let Some(max_lines) = max_lines {
|
||||
body_style = body_style.with_max_lines(max_lines);
|
||||
}
|
||||
|
||||
Element::column()
|
||||
.padding(Edges::all(gutter * 0.9))
|
||||
.gap(gutter * 0.35)
|
||||
.background(Color::rgb(0x1C, 0x24, 0x34))
|
||||
.children([
|
||||
Element::paragraph(
|
||||
title,
|
||||
TextStyle::new(18.0, Color::rgb(0xF4, 0xF7, 0xFF)).with_line_height(24.0),
|
||||
),
|
||||
Element::paragraph(body, body_style),
|
||||
])
|
||||
}
|
||||
Reference in New Issue
Block a user