环境
- Time 2022-08-09
- Rust 1.62.0
- Tui 0.18.0
前言
说明
参考:https://github.com/fdehau/tui-rs/blob/master/examples/barchart.rs
目标
使用 tui-rs
显示条形图。
第一个
fn render_top<B: Backend>(frame: &mut Frame<B>, area: layout::Rect, app: &App) {
let chart = widgets::BarChart::default()
.block(Block::default().title("条形图1").borders(Borders::ALL))
.data(&app.data)
.bar_width(9)
.bar_style(Style::default().fg(Color::Yellow))
.value_style(Style::default().fg(Color::Black).bg(Color::Yellow));
frame.render_widget(chart, area);
}
第二个
let chart = widgets::BarChart::default()
.block(Block::default().title("条形图2").borders(Borders::ALL))
.data(&app.data)
.bar_width(5)
.bar_gap(3)
.bar_style(Style::default().fg(Color::Green))
.value_style(
Style::default()
.bg(Color::Green)
.add_modifier(Modifier::BOLD),
);
frame.render_widget(chart, chunks[0]);
第三个
let chart = widgets::BarChart::default()
.block(Block::default().title("条形图3").borders(Borders::ALL))
.data(&app.data)
.bar_style(Style::default().fg(Color::Red))
.bar_width(7)
.bar_gap(0)
.value_style(Style::default().bg(Color::Red))
.label_style(
Style::default()
.fg(Color::Cyan)
.add_modifier(Modifier::ITALIC),
);
frame.render_widget(chart, chunks[1]);
总结
使用 tui-rs
渲染条形图。
附录
源码
use anyhow::{Context, Result};
use crossterm::{event, terminal, ExecutableCommand};
use style::{Color, Modifier, Style};
use tui::backend::{Backend, CrosstermBackend};
use tui::{layout, style, widgets, Frame, Terminal};
use widgets::{Block, Borders};
pub fn main() -> Result<()> {
terminal::enable_raw_mode()?;
let mut backend = CrosstermBackend::new(std::io::stdout());
backend
.execute(terminal::EnterAlternateScreen)?
.execute(terminal::Clear(terminal::ClearType::All))?
.hide_cursor()?;
let mut terminal = tui::Terminal::new(backend)?;
run(&mut terminal)?;
terminal::disable_raw_mode()?;
terminal
.backend_mut()
.execute(terminal::Clear(terminal::ClearType::All))?
.execute(terminal::LeaveAlternateScreen)?
.show_cursor()
.context("重置控制台失败")
}
fn run<B: Backend>(terminal: &mut Terminal<B>) -> Result<()> {
let timeout = std::time::Duration::from_millis(500);
let mut app = App::new();
loop {
terminal.draw(|frame| ui(frame, &app))?;
if event::poll(timeout)? {
if let event::Event::Key(key) = event::read()? {
use event::KeyCode::{Char, Esc};
match key.code {
Char('q') | Char('Q') | Esc => return Ok(()),
_ => {}
}
}
}
app.on_tick();
}
}
struct App<'a> {
data: Vec<(&'a str, u64)>,
}
impl<'a> App<'a> {
fn new() -> App<'a> {
App {
data: vec![
("B1", 9),
("B2", 12),
("B3", 5),
("B4", 8),
("B5", 2),
("B6", 4),
("B7", 5),
("B8", 9),
("B9", 14),
("B10", 15),
("B11", 1),
("B12", 0),
("B13", 4),
("B14", 6),
("B15", 4),
("B16", 6),
("B17", 4),
("B18", 7),
("B19", 13),
("B20", 8),
("B21", 11),
("B22", 9),
("B23", 3),
("B24", 5),
],
}
}
fn on_tick(&mut self) {
let value = self.data.pop().unwrap();
self.data.insert(0, value);
}
}
const CONSTRAINTS: [layout::Constraint; 2] = [
layout::Constraint::Percentage(50),
layout::Constraint::Percentage(50),
];
fn ui<B: Backend>(frame: &mut Frame<B>, app: &App) {
let chunks = layout::Layout::default()
.direction(layout::Direction::Vertical)
.margin(2)
.constraints(CONSTRAINTS)
.split(frame.size());
render_top(frame, chunks[0], app);
render_bottom(frame, chunks[1], app);
}
fn render_top<B: Backend>(frame: &mut Frame<B>, area: layout::Rect, app: &App) {
let chart = widgets::BarChart::default()
.block(Block::default().title("条形图1").borders(Borders::ALL))
.data(&app.data)
.bar_width(9)
.bar_style(Style::default().fg(Color::Yellow))
.value_style(Style::default().fg(Color::Black).bg(Color::Yellow));
frame.render_widget(chart, area);
}
fn render_bottom<B: Backend>(frame: &mut Frame<B>, area: layout::Rect, app: &App) {
let chunks = layout::Layout::default()
.direction(layout::Direction::Horizontal)
.constraints(CONSTRAINTS)
.split(area);
let chart = widgets::BarChart::default()
.block(Block::default().title("条形图2").borders(Borders::ALL))
.data(&app.data)
.bar_width(5)
.bar_gap(3)
.bar_style(Style::default().fg(Color::Green))
.value_style(
Style::default()
.bg(Color::Green)
.add_modifier(Modifier::BOLD),
);
frame.render_widget(chart, chunks[0]);
let chart = widgets::BarChart::default()
.block(Block::default().title("条形图3").borders(Borders::ALL))
.data(&app.data)
.bar_style(Style::default().fg(Color::Red))
.bar_width(7)
.bar_gap(0)
.value_style(Style::default().bg(Color::Red))
.label_style(
Style::default()
.fg(Color::Cyan)
.add_modifier(Modifier::ITALIC),
);
frame.render_widget(chart, chunks[1]);
}
标签:style,bar,示例,default,frame,Tui,Color,data,条形图
From: https://www.cnblogs.com/jiangbo4444/p/16746206.html