patina-ui 0.1.2

Patina: the window frame, components and design language shared by Photograph, UnAmp and other egui desktop apps
Documentation

Patina

Patina is the shared window frame, components and design language of a family of egui desktop apps. Photograph and UnAmp are the first.

You can skin each app completely differently. What they share is how they behave: one window frame, one skin format and one set of rules. See docs/design.md.

The Patina gallery

Use

[dependencies]
patina-ui = "0.1"
use patina::frame::{self, FrameStyle, TitleBar};

let style = FrameStyle::from_visuals(ui.visuals());
let radius = frame::corner_radius(ui.ctx(), style.radius);
egui::Panel::top("header")
    .frame(frame::header_frame(ui.style(), &style, radius))
    .show(ui, |ui| {
        TitleBar::new("My App", &style).show(ui, |ui| { /* left */ }, |ui| { /* right */ });
    });

The full wiring is in src/frame.rs and examples/gallery.rs. It covers the viewport, clear colour, edges and input hook.

Patina re-exports egui, and an app has to use the same egui version.

Components

  • frame: the app's own window frame, with a header bar, GNOME-style window controls, resize edges and rounded corners. Moving and resizing go to the compositor.
  • appearance: follows the desktop's light/dark setting through the XDG portal.
  • skin: skins in the suite format, which every app reads, with app sections, a shared user folder and the built-ins Dark Orange, Calendar, Notebook and Steam Classic. See docs/skinning.md.
  • tree: a sidebar folder tree that lists folders on worker threads, so slow network shares never block the UI.

Develop

make              # list targets
make gallery      # every component on one screen
make test         # tests
make check        # tests and clippy
make screenshot   # docs/gallery-*.png

Decisions are recorded as ADRs in docs/adr, and we recommend the same for every Patina app.

License

BSD-3-Clause