# 90-2 参考资料：页面树 Rust 生态调研

是的，Rust生态中有多种类似Notion页面树的实现，覆盖**数据结构库**、**UI组件库**（终端/桌面）和**完整应用**三类，均支持层次化文档管理、折叠展开、节点操作等核心功能。Notion页面树的关键特性是**块级编辑+嵌套页面+树形导航**，以下是Rust中的对应方案。

---

### 一、核心数据结构库：构建页面树的基础

这些库提供树状数据结构，可作为Notion风格页面树的底层存储，支持节点增删改查、层级管理等操作。

| 库名称 | 核心特点 | 适用场景 |
|--------|----------|----------|
| **easy-tree** | 轻量级树结构，深度优先遍历，支持并行迭代  | 快速构建简单页面树，文件系统映射 |
| **tree-ds** | 支持节点插入/删除/移动，整树枚举，子树修剪与嫁接  | 复杂层次结构管理，需要灵活节点操作 |
| **treelog** | 自定义树渲染，支持多种样式(Unicode/ASCII/Box)  | 命令行工具中展示页面树结构 |
| **ptree** | 美观的树状结构打印，支持自定义节点显示  | 调试或展示页面树层级关系 |

---

### 二、UI组件库：实现页面树的可视化与交互

这些组件库提供现成的树形UI，支持折叠展开、拖拽、键盘导航等Notion页面树关键交互功能。

#### 1. 终端(TUI)组件库

| 组件库 | 适配框架 | 核心特性 |
|--------|----------|----------|
| **tui-file-explorer** | Ratatui | 双面板布局，文件/目录层级展示，支持Git状态标记  |
| **ratatui-toolkit** | Ratatui | 包含树视图组件，支持自定义渲染与交互  |
| **cursive-tree** | Cursive | 支持"<>"/"↑↓"导航，鼠标点击切换折叠状态，多选择模式  |

#### 2. 桌面(GUI)组件库

| 组件库 | 适配框架 | 核心特性 |
|--------|----------|----------|
| **gpui-component::tree** | GPUI | 支持折叠/展开、键盘导航、自定义项渲染，适合文件浏览器和导航菜单  |
| **fyrox::gui::tree** | Fyrox | 内置选择控制，支持Ctrl+Click多选，Alt+Click拖拽  |
| **iced_file_tree** | Iced | 适配Iced跨平台GUI框架，支持文件系统导航与层级展示  |
| **egui-tree-view** | egui | 纯Rust即时模式GUI，支持嵌套节点，折叠展开，拖拽排序  |

---

### 三、完整应用：Notion风格页面树的直接体验

这些应用提供完整的Notion-like体验，包含页面树导航+块级编辑器，可直接使用或作为参考实现。

| 应用名称 | 技术栈 | 页面树特性 |
|----------|--------|------------|
| **Rustree** | Rust | 分层结构存储HTML文本，支持节点引用，类似Treepad  |
| **TauriNote** | Tauri(Rust+WebView) | 仿Notion块级编辑器，文件树管理，支持创建/删除笔记  |
| **Ferrite** | Rust+egui | 轻量级文本编辑器，支持Markdown，内置文档结构导航  |
| **ylin** | Tauri 2+Rust | 文件树侧边栏，支持Markdown编辑，实时预览  |

---

### 四、Notion页面树核心功能的Rust实现方案

#### 1. 块级编辑+页面树结合

Notion的核心是**块级内容+嵌套页面**，Rust中可通过以下方式实现：
- 后端：使用`tree-ds`或`easy-tree`存储块/页面层次结构，每个节点包含内容类型(文本/标题/列表等)和子节点列表
- 前端：使用GPUI/egui/Iced的树组件渲染页面树，块编辑器可集成`rust-markdown`或自定义块解析器

#### 2. 拖拽调整页面顺序

拖拽是Notion页面树的重要交互，Rust GUI框架中实现方式：
- **egui**：通过`egui::DragValue`和自定义状态管理实现节点拖拽排序
- **Fyrox**：内置`Tree`组件支持Alt+Click拖拽，无需额外实现 
- **Tauri**：结合Rust后端与前端拖拽库(如SortableJS)，通过IPC同步节点位置

#### 3. 动态加载与懒渲染

大型页面树需要懒加载优化，Rust中可通过：
- 使用`TreeBackend`按需加载子节点（如`cursive-tree`的实现）
- 在Tauri应用中，Rust后端监听节点展开事件，读取子页面数据并返回给前端

---

### 五、使用场景与选择建议

| 使用场景 | 推荐选择 | 理由 |
|----------|----------|------|
| 快速体验Notion风格页面树 | TauriNote/Rustree | 开箱即用，完整UI体验，支持块编辑与页面树导航 |
| 集成到Ratatui终端应用 | tui-file-explorer | 专为Ratatui设计，双面板布局，功能完善 |
| 构建跨平台GUI应用 | egui-tree-view/iced_file_tree | 纯Rust实现，原生GUI体验，无需WebView |
| 开发Tauri桌面应用 | 自定义实现+前端组件 | 结合Rust后端性能与前端交互灵活性，最接近Notion体验 |
| 仅需页面树数据结构 | easy-tree/tree-ds | 轻量级，API简单，适合快速开发 |

---

### 六、快速上手示例：egui-tree-view实现Notion风格页面树

```rust
use egui::{CentralPanel, Context, TopBottomPanel};
use egui_tree_view::{TreeView, TreeViewState};

struct PageNode {
    title: String,
    children: Vec<PageNode>,
    expanded: bool,
}

impl PageNode {
    fn new(title: &str) -> Self {
        Self {
            title: title.to_string(),
            children: Vec::new(),
            expanded: false,
        }
    }
}

fn main() -> eframe::Result<()> {
    let mut tree_state = TreeViewState::default();
    let mut root_node = PageNode::new("Notion Style Page Tree");
    root_node.children.push(PageNode::new("Getting Started"));
    root_node.children.push({
        let mut node = PageNode::new("Advanced Features");
        node.children.push(PageNode::new("Block Editing"));
        node.children.push(PageNode::new("Page Nesting"));
        node
    });

    eframe::run_simple_native("Notion Page Tree Demo", Default::default(), move |ctx, _frame| {
        TopBottomPanel::top("menu").show(ctx, |ui| {
            ui.heading("Notion Style Editor");
        });

        CentralPanel::default().show(ctx, |ui| {
            TreeView::new("page_tree", &mut tree_state)
                .with_nodes(&mut root_node.children, |ui, node, _depth| {
                    ui.checkbox(&mut node.expanded, &node.title);
                    node.expanded
                })
                .show(ui);
        });
    })
}
```

---

### 七、总结

Rust生态中已有丰富的工具可构建Notion风格页面树，从底层数据结构到完整应用全覆盖。若需快速开发，可选择现成组件库或应用；若需高度定制，可基于树结构库+UI框架组合实现，充分发挥Rust的性能与安全优势。