Rust GUI / iced 入門

[dependencies]
iced = "0.3"

use iced::{button, Button, Element, Sandbox, Settings, Text};

/// App の状態を保持する State を定義
/// この State に Sandbox を実装することで App として実行することが可能
#[derive(Default)]
struct MyButton {
    button_state: button::State, // Button の状態を保持する必要がある
}

/// ユーザの操作やイベントの通知に使う Message を定義
/// Debug, Clone の実装が必要
#[derive(Debug, Clone)]
enum Message {
    ButtonPressed,
}

/// Sandbox を State に実装することで、App として実行が可能になる
impl Sandbox for MyButton {
    /// State とやりとりする関連型 Message を定義
    type Message = Message;

    /// State を初期化 (iced 内部で使用される)
    fn new() -> Self {
        Self::default()
    }

    /// ウィンドウタイトルを設定
    fn title(&self) -> String {
        String::from("Button")
    }

    /// Message を受け取って State を更新する
    fn update(&mut self, message: Message) {
        match message {
            Message::ButtonPressed => println!("Button pressed"),
        }
    }

    /// State に応じて Widget を表示する
    /// Message を update() で処理した場合や Event 発生時のみ呼ばれる
    fn view(&mut self) -> Element<Message> {
        // Button Widget を生成し、
        // Button が押されたら Message を送信する
        // この Widget を `into()` で Element<Element> に変換して返すことで描画される
        Button::new(&mut self.button_state, Text::new("Button"))
            .on_press(Message::ButtonPressed)
            .into()
    }
}

fn main() -> iced::Result {
    // Sandbox を実装した State (Counter) を実行する
    // Settings を変更すれば、ウィンドウサイズ等の設定が変更可能
    MyButton::run(Settings::default())
}

fn view(&mut self) -> Element<Message> {
    // Button Widget を生成し、
    // Button が押されたら Message を送信する
    // この Widget を `into()` で Element<Element> に変換して返すことで描画される
    Button::new(&mut self.button_state, Text::new("Button"))
        .on_press(Message::ButtonPressed)
        .into()
}

fn view(&mut self) -> Element<Message> {
    // 3つの Widget を作成
    let count_text = Text::new(self.count.to_string()).size(50);
    let increment_button = Button::new(&mut self.increment_button_state, Text::new("+"))
        .on_press(Message::IncrementButtonPressed);
    let decrement_button = Button::new(&mut self.decrement_button_state, Text::new("-"))
        .on_press(Message::DecrementButtonPressed);

    // 上記の Widget のうち2つの Button をRow にまとめる
    let button_row = Row::new().push(increment_button).push(decrement_button);

    // Text と Row にまとめた Button を Column にまとめる
    // into() によって Widget は Element<Message> に変換される
    Column::new().push(count_text).push(button_row).into()
}

fn view(&mut self) -> Element<Message> {
    // 3つの Widget を作成
    // color, size を指定
    let count_text = Text::new(self.count.to_string())
        .color(Color::from_rgb(0.0, 0.0, 1.0))
        .size(50);
    // padding を指定
    let increment_button = Button::new(&mut self.increment_button_state, Text::new("+"))
        .padding(10)
        .on_press(Message::IncrementButtonPressed);
    // padding を指定
    let decrement_button = Button::new(&mut self.decrement_button_state, Text::new("-"))
        .padding(10)
        .on_press(Message::DecrementButtonPressed);

    // 上記の Widget のうち2つの Button をRow にまとめる
    // padding, spacing, max_width, align を設定する
    let button_row = Row::new()
        .padding(20)
        .spacing(20)
        .max_width(500)
        .align_items(Align::Center)
        .push(increment_button)
        .push(decrement_button);

    // Text と Row にまとめた Button を Column にまとめる
    // padding, spacing, max_width, align を設定する
    let content = Column::new()
        .padding(20)
        .spacing(20)
        .max_width(500)
        .align_items(Align::Center)
        .push(count_text)
        .push(button_row);

    // Column にまとめたすべての要素を Container にまとめ、
    // Window の width, height を設定し、
    // Window の上下の中央に配置する
    Container::new(content)
        .width(Length::Fill)
        .height(Length::Fill)
        .center_x()
        .center_y()
        .into()
}

fn main() -> iced::Result {
    // Settings を使って、ウィンドウサイズを設定する
    let mut settings = Settings::default();
    settings.window.size = (200, 200);
    Counter::run(settings)
}

[dependencies]
iced = { version = "0.3", features = ["async-std"] }

use iced::{button, executor, Application, Button, Clipboard, Command, Element, Settings, Text};

#[derive(Default)]
struct MyApplication {
    button_state: button::State,
}

#[derive(Debug, Clone)]
enum Message {
    ButtonClicked,  // ボタンが押されたら 1 秒スリープし、
    AwakeFromSleep, // スリープから復帰したら AwakeFromSleep を送る
}

/// Application を State (AsyncHello) に実装することで、App として実行が可能になる
/// Application には非同期処理関連の型や Flags が Sandbox に追加されている
impl Application for MyApplication {
    /// 非同期処理の Executor を指定
    /// executor::Default は feature flag によって切り替わる
    /// - "tokio": executor::Tokio
    /// - "async-std": executor::AsyncStd
    /// - "smol": executor::Smol
    /// - 指定なし: iced_futures::executor::ThreadPool
    type Executor = executor::Default;
    /// 初期化を分岐するために使用する Flags だが、ここでは未使用
    type Flags = ();
    type Message = Message;

    /// State(AsyncHello) を初期化、Sandbox との違いは下記 2 点
    /// - Flags によって処理を分岐させることが可能
    /// - Command を使うことで、単発の非同期処理を行うことが可能
    fn new(_flags: Self::Flags) -> (Self, Command<Self::Message>) {
        (Self::default(), Command::none())
    }

    fn title(&self) -> String {
        String::from("MyApplication")
    }

    /// Message を受け取って State (Counter) を更新する
    /// Command を使うことで、単発の非同期処理を行うことが可能
    fn update(&mut self, message: Message, _clipboard: &mut Clipboard) -> Command<Self::Message> {
        match message {
            Message::ButtonClicked => {
                println!("Clicked!");

                // Command::perform() によって単発の非同期処理を行うことが可能
                // 第一引数に Future を与える (ここでは async fn を指定)
                // 第二引数に Future の返り値を引数とし Message を返す closure を指定 (Future 完了後に呼ばれる)
                Command::perform(sleep_for_a_second(), |_| Message::AwakeFromSleep)
            }
            Message::AwakeFromSleep => Command::none(),
        }
    }

    fn view(&mut self) -> Element<Message> {
        // 押されたら Message::ButtonClick を送るだけの Button を設置
        Button::new(&mut self.button_state, Text::new("click"))
            .on_press(Message::ButtonClicked)
            .into()
    }
}

/// Button が押されたら呼ばれる非同期関数
/// 1 秒スリープして文字列をコンソールに表示する
async fn sleep_for_a_second() {
    use async_std::task::sleep;
    use std::time::Duration;

    sleep(Duration::from_secs(1)).await;
    println!("Hello, from 1 sec sleep!");
}

fn main() -> iced::Result {
    MyApplication::run(Settings::default())
}

impl Application for ApplicationSubscription {
    // ...

    /// 定期的な非同期処理を行うために、デフォルト実装をオーバーライドする
    fn subscription(&self) -> Subscription<Message> {
        use std::time::Duration;

        // 1 秒ごとに Message::Tick を Subscription<Message> として返す
        iced::time::every(Duration::from_secs(1)).map(|_| Message::Tick)
    }

    // ...
}

fn subscription(&self) -> Subscription<Message> {
    use std::time::Duration;

    // 1 秒ごとに Message::Tick を送る
    iced::time::every(Duration::from_secs(1)).map(|_| Message::Tick)
}

[dependencies]
iced = { version = "0.3", features = ["async-std"] }
iced_native = "0.4"

fn subscription(&self) -> Subscription<Message> {
    use iced_native::{keyboard, subscription, Event};

    // キーボード入力があった場合、Message::KeyPressed(key_code) を送る
    subscription::events_with(|event, _status| match event {
        Event::Keyboard(keyboard::Event::KeyPressed {
            key_code,
            modifiers: _,
        }) => Some(Message::KeyPressed(key_code)),
        _ => None,
    })
}

[dependencies]
iced = { version = "0.3", features = ["async-std"] }
iced_native = "0.4"

fn subscription(&self) -> Subscription<Message> {
    use iced_native::{mouse, subscription, Event};

    // マウスボタン入力があった場合、Message::MouseButtonPressed を送る
    subscription::events_with(|event, _status| match event {
        Event::Mouse(mouse::Event::ButtonPressed(button)) => {
            Some(Message::MouseButtonPressed(button))
        }
        _ => None,
    })
}

    fn subscription(&self) -> Subscription<Message> {
        // tick, key_pressed, mouse_pressed の subscription を作成
        // ...

        // Subscription::batch() で複数の非同期処理 (Subscription) をまとめて登録することができる
        Subscription::batch([tick, key_pressed, mouse_pressed])
    }

[dependencies]
iced = { version = "0.3", features = ["async-std"] }
iced_native = "0.4"
iced_futures = "0.3"
async-std = "1.11"

/// 独自の Subscription を実装する型
pub struct Timer;

/// Recipe<Hasher, Event> を実装することで、独自の Subscription が構築できる
impl<Hasher, Event> Recipe<Hasher, Event> for Timer
where
    Hasher: std::hash::Hasher,
{
    /// Subscription の Output 型を定義する
    type Output = Instant;

    /// Subscription を比較するための hash メソッド
    fn hash(&self, state: &mut Hasher) {
        use std::hash::Hash;
        std::any::TypeId::of::<Self>().hash(state);
    }

    /// Recipe を実行して Subscription Event を生成する
    /// Subscription Event は Stream として返される
    fn stream(
        self: Box<Self>,
        _input: futures::stream::BoxStream<'static, Event>,
    ) -> futures::stream::BoxStream<'static, Self::Output> {
        use futures::stream::StreamExt;
        async_std::stream::interval(Duration::from_secs(1))
            .map(|_| Instant::now())
            .boxed()
    }
}

// ...

impl Application for MyApplication {
    // ...

    fn subscription(&self) -> Subscription<Message> {
        // Recipe を実装した Timer を生成し、
        // Subscription::from_recipe で Subscription Stream を生成する
        iced::Subscription::from_recipe(Timer).map(Message::Tick)
    }

    // ...
}