mirror of
https://github.com/ratatui/ratatui.git
synced 2025-09-30 14:32:01 +00:00
128 lines
4.1 KiB
Markdown
128 lines
4.1 KiB
Markdown
# Examples
|
|
|
|
This folder contains examples that are more app focused. There are also other examples in example
|
|
folders under each crate folder e.g. [ratatui examples], [ratatui-widgets examples].
|
|
|
|
[ratatui examples]: ../ratatui/examples
|
|
[ratatui-widgets examples]: ../ratatui-widgets/examples
|
|
|
|
You can run these examples using:
|
|
|
|
```shell
|
|
cargo run -p example-name
|
|
```
|
|
|
|
This folder might use unreleased code. Consider viewing the examples in the `latest` branch instead
|
|
of the `main` branch for code which is guaranteed to work with the released ratatui version.
|
|
|
|
> [!WARNING]
|
|
>
|
|
> There may be backwards incompatible changes in these examples, as they are designed to compile
|
|
> against the `main` branch.
|
|
>
|
|
> There are a few workaround for this problem:
|
|
>
|
|
> - View the examples as they were when the latest version was release by selecting the tag that
|
|
> matches that version. E.g. <https://github.com/ratatui/ratatui/tree/v0.26.1/examples>.
|
|
> - If you're viewing this file on GitHub, there is a combo box at the top of this page which
|
|
> allows you to select any previous tagged version.
|
|
> - To view the code locally, checkout the tag. E.g. `git switch --detach v0.26.1`.
|
|
> - Use the latest [alpha version of Ratatui] in your app. These are released weekly on Saturdays.
|
|
> - Compile your code against the main branch either locally by adding e.g. `path = "../ratatui"` to
|
|
> the dependency, or remotely by adding `git = "https://github.com/ratatui/ratatui"`
|
|
>
|
|
> For a list of unreleased breaking changes, see [BREAKING-CHANGES.md].
|
|
>
|
|
> We don't keep the CHANGELOG updated with unreleased changes, check the git commit history or run
|
|
> `git-cliff -u` against a cloned version of this repository.
|
|
|
|
## Demo
|
|
|
|
This is the original demo example from the main README. It is available for each of the backends.
|
|
[Source](./apps/demo/).
|
|
|
|

|
|
|
|
## Demo2
|
|
|
|
This is the demo example from the main README and crate page. [Source](./apps/demo2/).
|
|
|
|

|
|
|
|
## Async GitHub demo
|
|
|
|
Shows how to fetch data from GitHub API asynchronously. [Source](./apps/async-github/).
|
|
|
|
## Calendar explorer demo
|
|
|
|
Shows how to render a calendar with different styles. [Source](./apps/calendar-explorer/).
|
|
|
|
## Canvas demo
|
|
|
|
Shows how to render a canvas with different shapes. [Source](./apps/canvas/).
|
|
|
|
## Colors-RGB demo
|
|
|
|
This example shows the full range of RGB colors in an animation. [Source](./apps/colors-rgb/).
|
|
|
|
## Constraint Explorer demo
|
|
|
|
This interactive example shows how different constraints can be used to layout widgets. [Source](./apps/constraint-explorer/).
|
|
|
|
## Constraints demo
|
|
|
|
This example shows different types of constraints. [Source](./apps/constraints/).
|
|
|
|
## Custom widget demo
|
|
|
|
This example shows how to create a custom widget that can be interacted with the mouse. [Source](./apps/custom-widget/).
|
|
|
|
## Hyperlink demo
|
|
|
|
Shows how to render hyperlinks in a terminal using [OSC
|
|
8](https://gist.github.com/egmontkob/eb114294efbcd5adb1944c9f3cb5feda). [Source](./apps/hyperlink/).
|
|
|
|
## Flex demo
|
|
|
|
This interactive example shows how to use the flex layouts. [Source](./apps/flex/).
|
|
|
|
## Hello World demo
|
|
|
|
This example shows how to create a simple TUI with a text. [Source](./apps/hello-world/).
|
|
|
|
## Gauge demo
|
|
|
|
This example shows different types of gauges. [Source](./apps/gauge/).
|
|
|
|
## Inline demo
|
|
|
|
Shows how to use the inlined viewport to render in a specific area of the screen. [Source](./apps/inline/).
|
|
|
|
## Input form
|
|
|
|
Shows how to render a form with input fields. [Source](./apps/input-form/).
|
|
|
|
## Todo List demo
|
|
|
|
Shows how to create a simple todo list application. [Source](./apps/todo-list/).
|
|
|
|
## Modifiers demo
|
|
|
|
Shows different types of modifiers. [Source](./apps/modifiers/).
|
|
|
|
## Mouse Drawing demo
|
|
|
|
Shows how to handle mouse events. [Source](./apps/mouse-drawing/).
|
|
|
|
## Minimal demo
|
|
|
|
Shows how to create a minimal application. [Source](./apps/minimal/).
|
|
|
|
## User input demo
|
|
|
|
Shows how to handle user input. [Source](./apps/user-input/).
|
|
|
|
## Weather demo
|
|
|
|
Shows how to render weather data using barchart widget. [Source](./apps/weather/).
|