No description
Find a file
Neal Fachan d72968d86b
feat(scrolling-regions)!: use terminal scrolling regions to stop Terminal::insert_before from flickering (#1341)
The current implementation of Terminal::insert_before causes the
viewport to flicker. This is described in #584 .

This PR removes that flickering by using terminal scrolling regions
(sometimes called "scroll regions"). A terminal can have its scrolling
region set to something other than the whole screen. When a scroll ANSI
sequence is sent to the terminal and it has a non-default scrolling
region, the terminal will scroll just inside of that region.

We use scrolling regions to implement insert_before. We create a region
on the screen above the viewport, scroll that up to make room for the
newly inserted lines, and then draw the new lines. We may need to repeat
this process depending on how much space there is and how many lines we
need to draw.

When the viewport takes up the entire screen, we take a modified
approach. We create a scrolling region of just the top line (could be
more) of the viewport, then use that to draw the lines we want to
output. When we're done, we scroll it up by one line, into the
scrollback history, and then redraw the top line from the viewport.

A final edge case is when the viewport hasn't yet reached the bottom of
the screen. This case, we set up a different scrolling region, where the
top is the top of the viewport, and the bottom is the viewport's bottom
plus the number of lines we want to scroll by. We then scroll this
region down to open up space above the viewport for drawing the inserted
lines.

Regardless of what we do, we need to reset the scrolling region. This PR
takes the approach of always resetting the scrolling region after every
operation. So the Backend gets new scroll_region_up and
scroll_region_down methods instead of set_scrolling_region, scroll_up,
scroll_down, and reset_scrolling_region methods. We chose that approach
for two reasons. First, we don't want Ratatui to have to remember that
state and then reset the scrolling region when tearing down. Second, the
pre-Windows-10 console code doesn't support scrolling regio

This PR:
- Adds a new scrolling-regions feature.
- Adds two new Backend methods: scroll_region_up and scroll_region_down.
- Implements those Backend methods on all backends in the codebase.
- The crossterm and termion implementations use raw ANSI escape
sequences. I'm trying to merge changes into those two projects
separately to support these functions.
- Adds code to Terminal::insert_before to choose between
insert_before_scrolling_regions and insert_before_no_scrolling_regions.
The latter is the old implementation.
- Adds lots of tests to the TestBackend to for the
scrolling-region-related Backend methods.
- Adds versions of terminal tests that show that insert_before doesn't
clobber the viewport. This is a change in behavior from before.
2024-10-14 15:46:13 -07:00
.github chore(deps): bump bnjbvr/cargo-machete from 0.6.2 to 0.7.0 (#1392) 2024-10-05 23:43:00 +03:00
assets docs: add logo and favicon to docs.rs page (#473) 2023-09-09 17:04:16 -07:00
benches fix(rect)!: Rect::area now returns u32 and Rect::new() no longer clamps area to u16::MAX (#1378) 2024-10-14 15:04:56 -07:00
examples fix(rect)!: Rect::area now returns u32 and Rect::new() no longer clamps area to u16::MAX (#1378) 2024-10-14 15:04:56 -07:00
src feat(scrolling-regions)!: use terminal scrolling regions to stop Terminal::insert_before from flickering (#1341) 2024-10-14 15:46:13 -07:00
tests feat(scrolling-regions)!: use terminal scrolling regions to stop Terminal::insert_before from flickering (#1341) 2024-10-14 15:46:13 -07:00
.cz.toml style(config): apply formatting to config files (#238) 2023-06-11 20:26:45 +00:00
.editorconfig chore(editorconfig): set and apply some defaults (#974) 2024-03-03 21:41:19 -08:00
.gitignore gitignore 2019-05-17 14:25:55 +02:00
.markdownlint.yaml feat(examples): add demo2 example (#500) 2023-09-21 01:47:23 -07:00
bacon.toml chore(editorconfig): set and apply some defaults (#974) 2024-03-03 21:41:19 -08:00
BREAKING-CHANGES.md feat!: add an impl of DoubleEndedIterator for Columns and Rows (#1358) 2024-10-14 15:41:39 -07:00
Cargo.toml feat(scrolling-regions)!: use terminal scrolling regions to stop Terminal::insert_before from flickering (#1341) 2024-10-14 15:46:13 -07:00
CHANGELOG.md chore(release): prepare for 0.28.1 (#1343) 2024-08-25 12:23:26 +03:00
cliff.toml chore: rename ratatui-org to ratatui (#1334) 2024-08-21 11:35:08 -07:00
clippy.toml chore: rename ratatui-org to ratatui (#1334) 2024-08-21 11:35:08 -07:00
CODE_OF_CONDUCT.md docs(github): Create CODE_OF_CONDUCT.md (#1279) 2024-08-04 17:26:02 +03:00
codecov.yml ci(codecov): adjust threshold and noise settings (#615) 2023-11-05 10:21:11 +01:00
committed.toml style(config): apply formatting to config files (#238) 2023-06-11 20:26:45 +00:00
CONTRIBUTING.md chore: rename ratatui-org to ratatui (#1334) 2024-08-21 11:35:08 -07:00
deny.toml chore(deny): allow Zlib license in cargo-deny configuration (#1411) 2024-10-14 02:48:30 -07:00
FUNDING.json chore(funding): add eth address for receiving funds from drips.network (#994) 2024-03-27 18:11:26 +03:00
LICENSE docs(license): update copyright years (#962) 2024-02-21 11:24:38 +01:00
MAINTAINERS.md chore(maintainers): remove EdJoPaTo (#1314) 2024-08-11 20:27:11 -07:00
Makefile.toml build: simplify Windows build (#1317) 2024-08-13 10:09:46 -07:00
README.md docs: use Frame::area() instead of size() in examples (#1361) 2024-09-08 13:20:59 -07:00
RELEASE.md chore(ci): update release strategy (#1337) 2024-08-25 11:02:29 +03:00
rust-toolchain.toml chore: Create rust-toolchain.toml (#415) 2023-08-19 03:51:53 +00:00
rustfmt.toml style: enable more rustfmt settings (#1125) 2024-05-26 19:50:10 +02:00
SECURITY.md chore: rename ratatui-org to ratatui (#1334) 2024-08-21 11:35:08 -07:00
typos.toml chore: rename ratatui-org to ratatui (#1334) 2024-08-21 11:35:08 -07:00

Table of Contents

Demo

Ratatui

Ratatui is a crate for cooking up terminal user interfaces in Rust. It is a lightweight library that provides a set of widgets and utilities to build complex Rust TUIs. Ratatui was forked from the tui-rs crate in 2023 in order to continue its development.

Installation

Add ratatui as a dependency to your cargo.toml:

cargo add ratatui

Ratatui uses Crossterm by default as it works on most platforms. See the Installation section of the Ratatui Website for more details on how to use other backends (Termion / Termwiz).

Introduction

Ratatui is based on the principle of immediate rendering with intermediate buffers. This means that for each frame, your app must render all widgets that are supposed to be part of the UI. This is in contrast to the retained mode style of rendering where widgets are updated and then automatically redrawn on the next frame. See the Rendering section of the Ratatui Website for more info.

You can also watch the FOSDEM 2024 talk about Ratatui which gives a brief introduction to terminal user interfaces and showcases the features of Ratatui, along with a hello world demo.

Other documentation

Quickstart

The following example demonstrates the minimal amount of code necessary to setup a terminal and render "Hello World!". The full code for this example which contains a little more detail is in the Examples directory. For more guidance on different ways to structure your application see the Application Patterns and Hello World tutorial sections in the Ratatui Website and the various Examples. There are also several starter templates available in the templates repository.

Every application built with ratatui needs to implement the following steps:

  • Initialize the terminal
  • A main loop to:
    • Handle input events
    • Draw the UI
  • Restore the terminal state

The library contains a [prelude] module that re-exports the most commonly used traits and types for convenience. Most examples in the documentation will use this instead of showing the full path of each type.

Initialize and restore the terminal

The [Terminal] type is the main entry point for any Ratatui application. It is a light abstraction over a choice of Backend implementations that provides functionality to draw each frame, clear the screen, hide the cursor, etc. It is parametrized over any type that implements the Backend trait which has implementations for Crossterm, Termion and Termwiz.

Most applications should enter the Alternate Screen when starting and leave it when exiting and also enable raw mode to disable line buffering and enable reading key events. See the backend module and the Backends section of the Ratatui Website for more info.

Drawing the UI

The drawing logic is delegated to a closure that takes a Frame instance as argument. The Frame provides the size of the area to draw to and allows the app to render any Widget using the provided render_widget method. After this closure returns, a diff is performed and only the changes are drawn to the terminal. See the Widgets section of the Ratatui Website for more info.

Handling events

Ratatui does not include any input handling. Instead event handling can be implemented by calling backend library methods directly. See the Handling Events section of the Ratatui Website for more info. For example, if you are using Crossterm, you can use the crossterm::event module to handle events.

Example

use std::io::{self, stdout};

use ratatui::{
    backend::CrosstermBackend,
    crossterm::{
        event::{self, Event, KeyCode},
        terminal::{
            disable_raw_mode, enable_raw_mode, EnterAlternateScreen, LeaveAlternateScreen,
        },
        ExecutableCommand,
    },
    widgets::{Block, Paragraph},
    Frame, Terminal,
};

fn main() -> io::Result<()> {
    enable_raw_mode()?;
    stdout().execute(EnterAlternateScreen)?;
    let mut terminal = Terminal::new(CrosstermBackend::new(stdout()))?;

    let mut should_quit = false;
    while !should_quit {
        terminal.draw(ui)?;
        should_quit = handle_events()?;
    }

    disable_raw_mode()?;
    stdout().execute(LeaveAlternateScreen)?;
    Ok(())
}

fn handle_events() -> io::Result<bool> {
    if event::poll(std::time::Duration::from_millis(50))? {
        if let Event::Key(key) = event::read()? {
            if key.kind == event::KeyEventKind::Press && key.code == KeyCode::Char('q') {
                return Ok(true);
            }
        }
    }
    Ok(false)
}

fn ui(frame: &mut Frame) {
    frame.render_widget(
        Paragraph::new("Hello World!").block(Block::bordered().title("Greeting")),
        frame.area(),
    );
}

Running this example produces the following output:

docsrs-hello

Layout

The library comes with a basic yet useful layout management object called Layout which allows you to split the available space into multiple areas and then render widgets in each area. This lets you describe a responsive terminal UI by nesting layouts. See the Layout section of the Ratatui Website for more info.

use ratatui::{
    layout::{Constraint, Layout},
    widgets::Block,
    Frame,
};

fn ui(frame: &mut Frame) {
    let [title_area, main_area, status_area] = Layout::vertical([
        Constraint::Length(1),
        Constraint::Min(0),
        Constraint::Length(1),
    ])
    .areas(frame.area());
    let [left_area, right_area] =
        Layout::horizontal([Constraint::Percentage(50), Constraint::Percentage(50)])
            .areas(main_area);

    frame.render_widget(Block::bordered().title("Title Bar"), title_area);
    frame.render_widget(Block::bordered().title("Status Bar"), status_area);
    frame.render_widget(Block::bordered().title("Left"), left_area);
    frame.render_widget(Block::bordered().title("Right"), right_area);
}

Running this example produces the following output:

docsrs-layout

Text and styling

The Text, Line and Span types are the building blocks of the library and are used in many places. Text is a list of Lines and a Line is a list of Spans. A Span is a string with a specific style.

The style module provides types that represent the various styling options. The most important one is Style which represents the foreground and background colors and the text attributes of a Span. The style module also provides a Stylize trait that allows short-hand syntax to apply a style to widgets and text. See the Styling Text section of the Ratatui Website for more info.

use ratatui::{
    layout::{Constraint, Layout},
    style::{Color, Modifier, Style, Stylize},
    text::{Line, Span},
    widgets::{Block, Paragraph},
    Frame,
};

fn ui(frame: &mut Frame) {
    let areas = Layout::vertical([Constraint::Length(1); 4]).split(frame.area());

    let line = Line::from(vec![
        Span::raw("Hello "),
        Span::styled(
            "World",
            Style::new()
                .fg(Color::Green)
                .bg(Color::White)
                .add_modifier(Modifier::BOLD),
        ),
        "!".red().on_light_yellow().italic(),
    ]);
    frame.render_widget(line, areas[0]);

    // using the short-hand syntax and implicit conversions
    let paragraph = Paragraph::new("Hello World!".red().on_white().bold());
    frame.render_widget(paragraph, areas[1]);

    // style the whole widget instead of just the text
    let paragraph = Paragraph::new("Hello World!").style(Style::new().red().on_white());
    frame.render_widget(paragraph, areas[2]);

    // use the simpler short-hand syntax
    let paragraph = Paragraph::new("Hello World!").blue().on_yellow();
    frame.render_widget(paragraph, areas[3]);
}

Running this example produces the following output:

docsrs-styling

Status of this fork

In response to the original maintainer Florian Dehau's issue regarding the future of tui-rs, several members of the community forked the project and created this crate. We look forward to continuing the work started by Florian 🚀

In order to organize ourselves, we currently use a Discord server, feel free to join and come chat! There is also a Matrix bridge available at #ratatui:matrix.org.

While we do utilize Discord for coordinating, it's not essential for contributing. We have recently launched the Ratatui Forum, and our primary open-source workflow is centered around GitHub. For bugs and features, we rely on GitHub. Please Report a bug, Request a Feature or Create a Pull Request.

Please make sure you read the updated contributing guidelines, especially if you are interested in working on a PR or issue opened in the previous repository.

Widgets

Built in

The library comes with the following widgets:

Each widget has an associated example which can be found in the Examples folder. Run each example with cargo (e.g. to run the gauge example cargo run --example gauge), and quit by pressing q.

You can also run all examples by running cargo make run-examples (requires cargo-make that can be installed with cargo install cargo-make).

Third-party libraries, bootstrapping templates and widgets

  • ansi-to-tui — Convert ansi colored text to ratatui::text::Text
  • color-to-tui — Parse hex colors to ratatui::style::Color
  • templates — Starter templates for bootstrapping a Rust TUI application with Ratatui & crossterm
  • tui-builder — Batteries-included MVC framework for Tui-rs + Crossterm apps
  • tui-clap — Use clap-rs together with Tui-rs
  • tui-log — Example of how to use logging with Tui-rs
  • tui-logger — Logger and Widget for Tui-rs
  • tui-realm — Tui-rs framework to build stateful applications with a React/Elm inspired approach
  • tui-realm-treeview — Treeview component for Tui-realm
  • tui-rs-tree-widgets — Widget for tree data structures.
  • tui-windows — Tui-rs abstraction to handle multiple windows and their rendering
  • tui-textarea — Simple yet powerful multi-line text editor widget supporting several key shortcuts, undo/redo, text search, etc.
  • tui-input — TUI input library supporting multiple backends and tui-rs.
  • tui-term — A pseudoterminal widget library that enables the rendering of terminal applications as ratatui widgets.

Apps

Check out awesome-ratatui for a curated list of awesome apps/libraries built with ratatui!

Alternatives

You might want to checkout Cursive for an alternative solution to build text user interfaces in Rust.

Acknowledgments

Special thanks to Pavel Fomchenkov for his work in designing an awesome logo for the ratatui project and ratatui organization.

License

MIT