FLORui

Interfaces nativas em Rust, com a expressividade do CSS.

FLORui é o framework de interfaces nativas que a FLOREGREEN constrói e usa em seus próprios produtos: componentes em Rust, marcação inspirada em JSX e um motor de estilos e layout que segue CSS de verdade, não um subconjunto reduzido.

Acompanhar no GitHub

button.rs Rust

use florui::prelude::*;

stylesheet!("./button.css");

#[component]
pub fn Button(label: String) -> Element {
    view! {
        <button class="button">{label}</button>
    }
}

Exemplo real da sintaxe de componentes do FLORui.

button.rs Rust

use florui::prelude::*;

stylesheet!("./button.css");

#[component]
pub fn Button(label: String) -> Element {
    view! {
        <button class="button">{label}</button>
    }
}

Um componente real, com a mesma sintaxe que você escreveria hoje.

Componentes em Rust

Componentes declarativos com a macro #[component], marcação view! inspirada em JSX e propriedades tipadas. Já funcionando, não apenas planejado.

button.css CSS

.button {
    display: flex;
    padding: 10px 16px;
    background-color: #2a2a30;
    color: #ffffff;
}

.button:hover {
    background-color: #3a3a42;
}

Pseudo-classes, cascata e herança funcionam como você espera.

Estilos com CSS

CSS real, processado por um motor de estilos completo, o mesmo usado pelo Firefox e pelo Servo. Não é um subconjunto simulado: seletores, cascata, herança e pseudo-classes funcionam de verdade.

widget.rs Rust

use florui_platform::{InputMode, use_window_controls};

fn widget() -> Element {
    let controls = use_window_controls();

    view! {
        <button
            onclick={move || {
                if let Some(controls) = &controls {
                    controls.set_always_on_top(true);
                    controls.set_input_mode(InputMode::Selective);
                }
            }}
        >
            {"Fixar no topo"}
        </button>
    }
}

Controle de janela em nível de sistema operacional, não simulado.

Renderização nativa

Layout real via um motor de flexbox dedicado, texto renderizado com shaping completo e apresentação acelerada por GPU com transparência de janela genuína, sem embutir um navegador na aplicação.

Onde estamos hoje

Parsing de CSS real, layout com motor de flexbox dedicado e renderização de texto com shaping completo.
Apresentação acelerada por GPU, incluindo transparência de janela verificada de ponta a ponta.
Controle de janela nativo: barra de título personalizada, sempre-no-topo, tela cheia, clique-através seletivo por região e ícone de bandeja do sistema.
Um CLI próprio: florui doctor diagnostica o ambiente gráfico, florui fmt formata o código view!.

É um projeto em construção ativa: o ecossistema de componentes e a cobertura de CSS crescem a cada semana. Já é sólido o suficiente para experimentar; ainda não é o momento de apostar nele em produção.

O que vem a seguir

1
Suporte nativo para macOS e Linux, sobre a mesma base que já usamos no Windows.
2
Interação completa de formulários: campos de texto, seleção, área de transferência, foco e navegação por teclado.
3
Acessibilidade validada pela ponte real do sistema operacional.
4
Múltiplas janelas, menus, diálogos e arrastar-e-soltar nativos.
5
Configuração própria do aplicativo: identidade, ícones e comportamento de janela num único arquivo.
6
FLORui no navegador, com os mesmos componentes rodando via Web.

Perguntas frequentes

Ainda não. O motor de estilos, layout, renderização e controle de janela já funcionam de verdade, mas o ecossistema de componentes e a cobertura de CSS continuam crescendo. Hoje é um bom momento para experimentar, não para apostar nele em um projeto crítico.

Código aberto desde o início

O código original e a documentação estão disponíveis sob MIT ou Apache-2.0, à sua escolha. Dependências e recursos de terceiros mantêm suas próprias licenças.

Explorar o código