Warning
The examples in this folder run against the main
branch. There may be backwards
incompatible changes compared to the latest stable version.
If you find that code copied from an example fails to run in your own application, please check the tag of the release that your project is using.
To view examples that match the version of Ratatui that you are using checkout the matching tag in your local git repository, or select the tag in the "Switch branches/tags" button if you're viewing this file on GitHub.
To use incompatible example code as is, you can also use the most recent alpha release of Ratatui (we release these weekly).
These gifs were created using VHS. Each example has a
corresponding .tape
file that holds instructions for how to generate the images. Note that the
images themselves are stored in a separate git branch to avoid bloating the main repository.
This is the demo example from the main README and crate page. Source: demo2.
cargo run --example=demo2 --features="crossterm widget-calendar"
This is the previous demo example from the main README. It is available for each of the backends. Source: demo.rs.
cargo run --example=demo --features=crossterm
cargo run --example=demo --no-default-features --features=termion
cargo run --example=demo --no-default-features --features=termwiz
This is a pretty boring example, but it contains some good documentation on writing tui apps. Source: hello_world.rs.
cargo run --example=hello_world --features=crossterm
Demonstrates the BarChart
widget. Source: barchart.rs.
cargo run --example=barchart --features=crossterm
Demonstrates the Block
widget. Source: block.rs.
cargo run --example=block --features=crossterm
Demonstrates the Calendar
widget. Source: calendar.rs.
cargo run --example=calendar --features="crossterm widget-calendar"
Demonstrates the Canvas
widget
and related shapes in the
canvas
module. Source:
canvas.rs.
cargo run --example=canvas --features=crossterm
Demonstrates the Chart
widget.
Source: chart.rs.
cargo run --example=chart --features=crossterm
Demonstrates the available Color
options. These can be used in any style field. Source: colors.rs.
cargo run --example=colors --features=crossterm
Demonstrates the available RGB
Color
options. These can be used
in any style field. Source: colors_rgb.rs. Uses a half block technique to render
two square-ish pixels in the space of a single rectangular terminal cell.
cargo run --example=colors_rgb --features=crossterm
Note: VHs renders full screen animations poorly, so this is a screen capture rather than the output of the VHS tape.
Screen.Recording.2023-12-16.at.5.12.22.PM.mov
Demonstrates how to implement the
Widget
trait. Also shows mouse
interaction. Source: custom_widget.rs.
cargo run --example=custom_widget --features=crossterm
Demonstrates the Gauge
widget.
Source: gauge.rs.
cargo run --example=gauge --features=crossterm
Demonstrates how to use the
Inline
Viewport mode for ratatui apps. Source: inline.rs.
cargo run --example=inline --features=crossterm
Demonstrates the Layout
and
interaction between each constraint. Source: layout.rs.
cargo run --example=layout --features=crossterm
Demonstrates the List
widget.
Source: list.rs.
cargo run --example=list --features=crossterm
Demonstrates the style
Modifiers
. Source:
modifiers.rs.
cargo run --example=modifiers --features=crossterm
Demonstrates how to handle panics by ensuring that panic messages are written correctly to the screen. Source: panic.rs.
cargo run --example=panic --features=crossterm
Demonstrates the Paragraph
widget. Source: paragraph.rs
cargo run --example=paragraph --features=crossterm
Demonstrates how to render a widget over the top of previously rendered widgets using the
Clear
widget. Source:
popup.rs.
cargo run --example=popup --features=crossterm
A fun example of using half blocks to render graphics Source: ratatui-logo.rs.
cargo run --example=ratatui-logo --features=crossterm
Demonstrates the Scrollbar
widget. Source: scrollbar.rs.
cargo run --example=scrollbar --features=crossterm
Demonstrates the Sparkline
widget. Source: sparkline.rs.
cargo run --example=sparkline --features=crossterm
Demonstrates the Table
widget.
Source: table.rs.
cargo run --example=table --features=crossterm
Demonstrates the Tabs
widget.
Source: tabs.rs.
cargo run --example=tabs --features=crossterm
Demonstrates one approach to accepting user input. Source user_input.rs.
Note
Consider using tui-textarea
or
tui-input
crates for more functional text entry UIs.
cargo run --example=user_input --features=crossterm