mdbook-iced

将iced代码块转换为交互式示例的mdBook预处理器。

概述

这是一个简单的mdBook预处理器，可以向任何iced代码块添加播放按钮。

按下播放按钮将加载并嵌入结果Wasm应用程序，位于代码块下方完全交互的<canvas>中。

它与任何具有main函数的代码块兼容，其中运行iced程序——即使它被隐藏！这意味着它可以用于创建与iced完全不相关的书籍的交互式示例。

目前，这个预处理器主要在官方指南中用于iced。去看看吧！

安装

使用cargo install安装mdbook-iced预处理器和wasm-bindgen-cli工具

cargo install mdbook-iced wasm-bindgen-cli

此外，确保您的工具链具有wasm32-unknown-unknown目标

rustup target add wasm32-unknown-unknown

用法

将[preprocessor.iced]条目添加到您的book.toml，并指定您的书籍将使用的iced版本

[preprocessor.iced]
# You can use a commit hash
rev = "9db6ac8f202ebdc1453edee01da0b30aee0949d8"
# ... a branch
branch = "master"
# ... or a tag!
tag = "0.13.0" # Not yet released!

然后，只需将一个iced标签添加到您希望可播放的任何可执行代码块中。例如，经典的计数器

# A cool example

This is an mdBook and here is an iced counter:

```rust,ignore,iced
use iced::widget::{button, column, text, Column};

pub fn main() -> iced::Result {
    iced::run("A counter", update, view)
}

#[derive(Debug, Clone)]
enum Message {
    Increment,
}

fn update(value: &mut u64, message: Message) {
    match message {
        Message::Increment => *value += 1,
    }
}

fn view(value: &u64) -> Column<Message> {
    column![
        text(value),
        button("+").on_press(Message::Increment),
    ]
}
```

您可以通过使用iced(height=<CSS高度>)作为标签来控制嵌入应用程序的高度（例如，iced(height=100px)）。

查看 book 目录以获取真实的 mdBook 示例！