tui-realm-treeview

~ tui-realm 的 Treeview 组件 ~

orange trees · tui-realm · 文档

由 @veeso 开发

当前版本：1.1.0 (2021/11/22)

• tui-realm-treeview
  • 关于 tui-realm-treeview 🌲
  • 开始使用 🏁
    • 将 tui-realm-treeview 添加到您的 Cargo.toml 🦀
    • 示例 📋
    • 关于性能
  • 组件 API
    • 更新树
      • 重新挂载组件
      • 从 "on" 方法更新树
  • 文档 📚
  • 贡献和问题 🤝🏻
  • 变更日志 ⏳
  • 支持开发者 ☕
  • 许可证 📃

关于 tui-realm-treeview 🌲

tui-realm-treeview 是 tui-realm 的 treeview 组件 实现。它使用 Orange trees 引擎来实现树。

开始使用 🏁

将 tui-realm-treeview 添加到您的 Cargo.toml 🦀

tui-realm-treeview = "^1.1.0"

如果不使用 Crossterm，则按照 tui-realm 的方式定义后端

tui-realm-treeview = { version = "^1.1.0", default-features = false, features = [ "with-termion" ] }

示例 📋

按照以下 示例 了解如何使用 treeview 组件。示例包含一个简单的文件浏览器，使用树视图，深度设置为 3。

cargo run --example demo

• 按 ENTER 展开所选目录
• 按 BACKSPACE 返回上级目录
• 使用 UP/DOWN 上/下箭头键上下移动
• 使用 PGUP/PGDOWN 上/下翻页
• 使用 RIGHT 打开目录
• 使用 LEFT 关闭目录
• 使用 TAB 在输入字段和树视图之间切换窗口
• 按 ESC 退出

关于性能

❗ 如果您曾是 tui-realm-treeview 0.x 的用户，我很高兴地宣布，这个库的新版本比旧版本快得多，也更可靠。这是因为现在我在树方面使用了新的引擎，并且不再依赖于 tui_tree_widget，这要求我将树转换成另一种结构，而这种结构实际上与树数据结构并不兼容。对于这个新库，我已经重新实现了所有内容，包括小部件，以确保与 orange-trees 引擎100%兼容。

在这个库中，递归的使用是一致的，由于 rust 不是函数式编程语言，因此在处理大型树时可能会出现栈溢出。

组件 API

命令:

状态：返回的状态是一个 One(String)，包含所选节点的 id。如果没有选择节点，则返回 None。

属性:

• Background(Color)：背景颜色。背景颜色将用作未选择条目的背景，但在焦点为 true 时将用作选中条目的前景
• Borders(Borders)：为组件设置边框属性
• Custom($TREE_IDENT_SIZE, Size)：设置每个深度级别渲染的空间
• Custom($TREE_INITIAL_NODE, String)：选择树中的初始节点。此选项具有比 keep_state 优先级
• Custom($TREE_PRESERVE_STATE, Flag)：如果为 true，则树更新后（显然如果条目仍存在于树中），所选条目将被保留
• FocusStyle(Style)：非活动样式
• Foreground(Color)：前景颜色。当焦点为 false 时，前景颜色将用作选中项的前景，否则用作背景
• HighlightedColor(Color)：提供的颜色将用于突出显示所选节点。如果未设置，则使用 Foreground
• HighlightedStr(String)：提供的字符串将显示在树中选中条目的左侧
• ScrollStep(Length)：定义最大滚动行数
• TextProps(TextModifiers)：设置文本修饰符
• Title(Title)：设置框标题

更新树

此组件中的树不在 props 中，而是 TreeView 模拟组件结构的一个成员。为了更新和操作树，您有基本上两种方法来实现这一点。

重新挂载组件

在您需要更新树的更新例程（如在示例中发生的情况）的情况下，更新树的最佳方法是重新从头开始重新挂载组件。如果您遵循示例，您会看到我已经按照以下方式实现了我的 treeview 组件的构造函数

impl FsTree {
    pub fn new(tree: Tree, initial_node: Option<String>) -> Self {
        // Preserve initial node if exists
        let initial_node = match initial_node {
            Some(id) if tree.root().query(&id).is_some() => id,
            _ => tree.root().id().to_string(),
        };
        FsTree {
            component: TreeView::default()
                .foreground(Color::Reset)
                .borders(
                    Borders::default()
                        .color(Color::LightYellow)
                        .modifiers(BorderType::Rounded),
                )
                .inactive(Style::default().fg(Color::Gray))
                .indent_size(3)
                .scroll_step(6)
                .title(tree.root().id(), Alignment::Left)
                .highlighted_color(Color::LightYellow)
                .highlight_symbol("🦄")
                .with_tree(tree)
                .initial_node(initial_node),
        }
    }
}

我在构造函数中始终设置初始节点和树。这种实现允许我随时更新树而不会丢失当前状态。

从 "on" 方法更新树

这种方法可能比重新挂载更好，但并不总是可以使用。当您为treeview实现Component时，您有一个组件的可变引用，因此在这里您可以调用这些方法来操作树

• pub fn tree(&self) -> &Tree：返回树的引用
• pub fn tree_mut(&mut self) -> &mut Tree：返回树的可变引用；这允许您对其进行操作
• pub fn set_tree(&mut self, tree: Tree)：使用另一棵树更新当前树
• pub fn tree_state(&self) -> &TreeState：获取当前树状态的引用。（参见树状态文档）

您可以像之前所说的那样，从on()方法访问这些方法。因此，在更新树后，这些方法可能很有用，甚至更好的是，如果您从一个UserEvent接收树，您可以设置树。

文档 📚

开发者文档可以在Rust Docs上找到：https://docs.rs/tui-realm-treeview

贡献和问题 🤝🏻

欢迎贡献、错误报告、新功能和提问！😉如果您有任何问题或疑虑，或者您想建议一个新功能，或者您只想改进tui-realm，请随时提出问题或PR。

请遵循我们的贡献指南

变更日志 ⏳

在此处查看tui-realm-treeview的变更日志

支持开发者 ☕

如果您喜欢tui-realm并对我所做的工作表示感激，请考虑小额捐赠🥳

您可以使用以下平台之一进行捐赠

许可证 📃

tui-realm-treeview采用MIT许可。

您可以在此处阅读完整许可