#declarative-ui #gui-framework #cross-platform-gui #ui #declarative #compose-ui

ribir_widgets

A non-intrusive declarative GUI framework, to build modern native/wasm cross-platform applications

43 releases (4 breaking)

new 0.4.0-alpha.14 Oct 30, 2024
0.4.0-alpha.10 Sep 25, 2024
0.4.0-alpha.3 Jun 26, 2024
0.3.0-alpha.1 Mar 27, 2024
0.0.0 Feb 26, 2023

#1007 in GUI

Download history 163/week @ 2024-07-25 112/week @ 2024-08-01 106/week @ 2024-08-08 122/week @ 2024-08-15 156/week @ 2024-08-22 114/week @ 2024-08-29 106/week @ 2024-09-05 212/week @ 2024-09-12 175/week @ 2024-09-19 212/week @ 2024-09-26 183/week @ 2024-10-03 51/week @ 2024-10-10 4/week @ 2024-10-17 195/week @ 2024-10-24

538 downloads per month
Used in 2 crates

MIT license

775KB
20K SLoC

Ribir - Non-intrusive GUI Framework for Rust

Ribir-logo

Use Rust to build multi-platform applications from a single codebase.

What's Ribir?

Ribir is a Rust GUI framework that helps you build beautiful and native multi-platform applications from a single codebase.

Experience a novel approach to UI development that's directly based on your data structure APIs. Any data mutation will trigger a precise UI update. Your focus should be on designing your data structure and its APIs. Then, you can describe your data's UI without intruding on its logic.

At First Glance

A simple example of a counter:

use ribir::prelude::*;
fn main() {
  let counter = fn_widget! {
    let cnt = Stateful::new(0);
    @Row {
      @FilledButton {
        on_tap: move |_| *$cnt.write() += 1,
        @{ Label::new("Inc") }
      }
      @H1 { text: pipe!($cnt.to_string()) }
    }
  };
  App::run(counter);
}

To use Ribir without DSL:

use ribir::prelude::*;

fn main() {
  let counter = |ctx: &mut BuildCtx| {
    let cnt = Stateful::new(0);

    let c_cnt = cnt.clone_writer();
    let inc_btn = FilledButton::declarer()
      .on_tap(move |_| *c_cnt.write() += 1)
      .finish(ctx)
      .with_child(Label::new("Inc"));

    let counter = H1::declarer()
      .text(pipe!($cnt.to_string()))
      .finish(ctx);

    Row::declarer()
      .finish(ctx)
      .with_child(inc_btn)
      .with_child(counter)
      .into_widget()
  };

  App::run(counter);
}

More Examples

Features

  • Declarative language It doesn't introduce a completely new language. Instead, it provides a set of Rust macros for easier interaction. You can choose to use it or not.
  • Widgets compose system has four kinds of widgets to support you can implement your widget in different ways:
    • function widget and Compose, from other widgets composition.
    • Render, implement your layout and paint anything you want.
    • ComposeChild, control the compose logic between parent and child widgets and specify the template of child widgets.
  • Non-intrusive state converts your data to a listenable state and updates the view according to the change of the state.
  • Layout system learning and inspired by Flutter Sublinear layout, but not the same.
  • Event system is a composition event system, that supports event bubbling and capture. Allow to compose with any widget, and exists only if you use it.
  • Theme System: Supports using different themes for various parts of the sub-tree and enables theme modifications at runtime.
  • Painter converts the view to 2D paths.
  • GPU render is a backend of the Painter, do path tessellation so that you can easily render the triangles in any GPU render engine. A wgpu implementation is provided as the default GPU render engine. Tessellation base on [lyon].
  • Text support basic text typography and IME input, in a usable but rough stage.
  • Widgets library provides 20+ basic widgets, but all are in a rough stage, and the API is not stable yet.

Architecture overview

Support Platform

Platform Support situation
Linux
Windows
macOS
iOS 🚧 Not yet
Android 🚧 Not yet
Web

Ribir is actively being developed and tested on desktop platforms, with both desktop and web platforms integrated into our CI/CD pipeline.

While the framework can compile and run on mobile platforms, we haven't fully tested or adapted the user interface for them yet. We plan to focus on mobile support once the core framework is stable and a production-ready widget library is released.

Love Ribir?

If you like Ribir, give our repo a ⭐ STAR ⬆️ and WATCH 👀 our repository to stay updated with the latest developments!

Every encouragement and feedback can support us to go further.

Contributing

We are grateful to the community for contributing bug fixes and improvements.

😎 New to Ribir?

Start learning about the framework by helping us improve our documentation. Feel free to open a new "Documentation" issue. We are also very welcome:

  • Point out to us where our document has misunderstandings
  • Pull requests which improve test coverage
  • Add undocumented code (e.g. built-in widget)
  • Report typo

For more information please read:

🤔 Confused about something?

Feel free to go to Discussions and open a new "Q&A" to get help from contributors. Often questions lead to improvements to the ergonomics of the framework, better documentation, and even new features!

😱 Found a bug?

Please report all bugs! We are happy to help support developers fix the bugs they find if they are interested and have the time.

Thanks

This project exists thanks to all the people who contributed:


We also found inspiration from the following frameworks:

License

Ribir is MIT-licensed

Dependencies

~19–36MB
~641K SLoC