egui-reactor

Rust GUI アプリを React っぽく書く

rust

use egui_reactor::prelude::*;
use egui_reactor_elements::prelude::*;

#[component]
pub fn App(cx: &mut Cx) {
    let mut count = use_state(cx, || 0i32);

    rsx! {
        <View direction="column" align="center" justify="center" gap={12} grow={1.0}>
            <Text size={32.0} strong>{format!("{}", *count)}</Text>
            <View direction="row" gap={8}>
                <Button on_click={|| *count -= 1}>"-"</Button>
                <Button on_click={|| *count = 0}>"reset"</Button>
                <Button on_click={|| *count += 1}>"+"</Button>
            </View>
        </View>
    }
}

コンポーネントとフック

JSX 風の rsx! マクロ、#[component] による関数コンポーネント、use_state / use_effect / use_future などのフック。イベントハンドラはローカルな状態を &mut でそのまま借りるだけで、.clone() のお作法は要りません。

Flexbox と Grid が一級市民

<View> は taffy の上に書いた小さな自前レイアウトエンジンのノードです。direction、gap、grow、wrap、グリッド領域は属性であって、手で測る対象ではありません。

ネイティブと Web

run(Options, ..) を 1 回呼べば、ネイティブではウィンドウが開き、ブラウザでは <canvas> を乗っ取ります。このサイトのサンプルはすべて wasm ビルドが動いています。