Expand description
A flippable two-faced panel widget for ratatui.
Pack twice as much content into one panel: a front face and a back face. Toggle between them with a smooth horizontal-squish animation that approximates a 3-D card flip on terminals that can’t actually rotate text.
§Quick start
use std::time::Duration;
use ratatui::{widgets::Paragraph, Frame};
use ratatui_flip_panel::{FlipPanel, FlipState};
// Long-lived; survives across render calls.
let mut state = FlipState::new(Duration::from_millis(300));
// On the user pressing `f`:
state.flip();
// Each frame:
fn draw(frame: &mut Frame, state: &mut FlipState) {
let widget = FlipPanel::new(
|area, buf| Paragraph::new("Front face").render(area, buf),
|area, buf| Paragraph::new("Back face").render(area, buf),
);
frame.render_stateful_widget(widget, frame.area(), state);
}The widget uses the StatefulWidget trait so animation progress
lives in your app state, not in the widget instance.
§When to use this vs tabs
Reach for tabs (or tui-tabs) when:
- You have three or more logically distinct views.
- You need the navigation strip to be visible at all times.
- Your terminal renders are static (no per-frame tick loop).
Reach for FlipPanel when:
- You have exactly two related views of the same data (a “front” summary and a “back” detail, for example).
- Your app already runs a per-frame render loop (≥ ~20 Hz). The animation needs frequent re-renders during its 200-400 ms window to look smooth.
- You want the cuteness of a flip to reinforce the “two sides of the same thing” mental model.