https://github.com/vizia/vizia

A declarative GUI library written in Rust
https://github.com/vizia/vizia

binding css declarative-ui framework graphics gui reactive rust toolkit ui user-interface

Last synced: 22 days ago
JSON representation

A declarative GUI library written in Rust

• Host: GitHub
• URL: https://github.com/vizia/vizia
• Owner: vizia
• License: mit
• Created: 2021-09-17T00:32:49.000Z (almost 3 years ago)
• Default Branch: main
• Last Pushed: 2024-05-28T17:45:36.000Z (24 days ago)
• Last Synced: 2024-05-29T08:47:24.443Z (23 days ago)
• Topics: binding, css, declarative-ui, framework, graphics, gui, reactive, rust, toolkit, ui, user-interface
• Language: Rust
• Homepage: https://docs.vizia.dev
• Size: 9.01 MB
• Stars: 1,450
• Watchers: 11
• Forks: 57
• Open Issues: 60
• Metadata Files:
  • Readme: README.md
  • License: LICENSE

Lists

• awesome-2d-graphics-rendering - vizia
• awesome-stars - vizia/vizia - A declarative GUI library written in Rust (Rust)
• awesome-stars - vizia/vizia - A declarative GUI library written in Rust (Rust)

README

        


Vizia





  

  

    

  

  

  

    

  

  

  

    

  

  

  

  

    

  

  

  

    

  

  

  

    

  






A declarative desktop GUI framework for the Rust programming language.







  


     Book 

     • 

     Docs 

     • 

     Demo 

     • 

     Discord 

  






# Features

- ### __Cross-platform (Windows, Linux, MacOS)__

  Build desktop applications which look and behave the same for Windows, Mac, and Linux.

- ### __Declarative__

  Write GUI code in a declarative way in pure Rust (no DSL macros).

- ### __Reactive__

  Views derive from application state. Change the state and the views which bind to it update automatically.

- ### __Flexible layout__

  Create flexible layouts which adapt to changes in size. Powered by [morphorm](https://github.com/vizia/morphorm).

- ### __Powerful styling__

  Take advantage of CSS with hot-reloading to fully customize the style of your application.

- ### __Animations__

  Bring your application to life with animatable style properties.

- ### __Built-in views and themes__

  Utilize over 25 ready-made views as well as two built-in themes (light and dark) to get you started. Includes 4250+ icons, provided by [Tabler Icons](https://tabler-icons.io).

- ### __Accessibility__

  Make you applications accessible to assistive technologies such as screen readers, powered by [accesskit](https://github.com/accesskit/accesskit).

- ### __Localization__

  Adapt your application to different locales, including translating text with [fluent](https://github.com/projectfluent/fluent-rs).

- ### __GPU accelerated rendering__

  Vizia leverages the GPU for fast graphical updates, powered by [femtovg](https://github.com/femtovg/femtovg).

- ### __Audio plugin development__

  Vizia provides an alternative [baseview](https://github.com/RustAudio/baseview) windowing backend for audio plugin development, for example with the [nih-plug](https://github.com/robbert-vdh/nih-plug) framework.




# At a Glance

A simple counter application. Run with `cargo run --example counter`.

```rust, no_run

use vizia::prelude::*;

// Define some model data

#[derive(Lens)]

pub struct AppData {

    count: i32,

}

// Define events to mutate the data

pub enum AppEvent {

    Increment,

}

// Describe how the data is mutated in response to events

impl Model for AppData {

    fn event(&mut self, _: &mut EventContext, event: &mut Event) {

        event.map(|app_event, _| match app_event {

            AppEvent::Increment => {

                self.count += 1;

            }

        });

    }

}

fn main() {

    // Create an application

    Application::new(|cx| {

        // Build the model data into the tree

        AppData { count: 0 }.build(cx);

        // Declare views which make up the UI

        HStack::new(cx, |cx| {

          

            // Declare a button which emits an event

            Button::new(cx, |cx| Label::new(cx, "Increment"))

              .on_press(|cx| cx.emit(AppEvent::Increment));

            // Declare a label which is bound to part of the model, updating when it changes

            Label::new(cx, AppData::count).width(Pixels(50.0));

        })

        .child_space(Stretch(1.0))  // Apply style and layout modifiers

        .col_between(Pixels(50.0));

    })

    .title("Counter") // Configure window properties

    .inner_size((400, 100))

    .run();

}

```



# Learning

## Book

A quickstart guide for vizia is available [here](https://book.vizia.dev).

## Docs

Auto-generated code documentation can be found [here](https://docs.vizia.dev).

## Examples

A list of [examples](https://github.com/vizia/vizia/tree/main/examples) is included in the repository.

To run an example with the [winit](https://github.com/rust-windowing/winit) (default) windowing backend:

```bash

cargo run --release --example name_of_example

```

### Baseview

To run an example with the [baseview](https://github.com/RustAudio/baseview) windowing backend:

```bash

cargo run --release --example name_of_example --no-default-features --features baseview

```

### Web

To run an example as a web application, first ensure that the `wasm32-unknown-unknown` toolchain is installed:

```bash

rustup target add wasm32-unknown-unknown

```

Then run an example with the following:

```bash

cargo run-wasm --release --example name_of_example

```

> **Note**

> Some examples are not compatible with the web target and will intentionally panic if run on web.

# Contributing and Community

For help with vizia, or to get involved with contributing to the project, come join us on [our discord](https://discord.gg/aNkTPsRm2w).

# License and Attribution

Vizia is licensed under [MIT](https://github.com/vizia/vizia/blob/main/LICENSE).

Vizia logo designed by [Lunae Somnia](https://github.com/LunaeSomnia).