Components will now render and set cursor

This commit is contained in:
veeso 2021-03-14 12:22:50 +01:00
parent 2e3dc7f7a5
commit 2b6f7e4868
12 changed files with 508 additions and 327 deletions

View file

@ -202,9 +202,7 @@ impl AuthActivity {
let focus: Option<String> = self.view.who_has_focus();
// Render
// Header
if let Some(render) = self.view.render(super::COMPONENT_TEXT_HEADER).as_ref() {
f.render_widget(render.widget, auth_chunks[0]);
}
self.view.render(super::COMPONENT_TEXT_HEADER, f, auth_chunks[0]);
});
}

View file

@ -24,14 +24,14 @@
*/
// locals
use super::{Component, InputEvent, Msg, Payload, Props, PropsBuilder, Render};
use super::{Canvas, Component, InputEvent, Msg, Payload, Props, PropsBuilder};
// ext
use crossterm::event::KeyCode;
use tui::{
layout::Corner,
layout::{Corner, Rect},
style::{Color, Style},
text::Span,
widgets::{Block, Borders, List, ListItem},
widgets::{Block, Borders, List, ListItem, ListState},
};
// -- states
@ -129,52 +129,51 @@ impl BookmarkList {
impl Component for BookmarkList {
/// ### render
///
/// Based on the current properties and states, return a Widget instance for the Component
/// Returns None if the component is hidden
fn render(&self) -> Option<Render> {
match self.props.visible {
false => None,
true => {
// Make list
let list_item: Vec<ListItem> = match self.props.texts.rows.as_ref() {
None => vec![],
Some(lines) => lines
.iter()
.map(|line| ListItem::new(Span::from(line.content.to_string())))
.collect(),
};
let (fg, bg): (Color, Color) = match self.states.focus {
true => (Color::Reset, self.props.background),
false => (Color::Reset, Color::Reset),
};
let title: String = match self.props.texts.title.as_ref() {
Some(t) => t.clone(),
None => String::new(),
};
// Render
Some(Render {
widget: Box::new(
List::new(list_item)
.block(
Block::default()
.borders(Borders::ALL)
.border_style(match self.states.focus {
true => Style::default().fg(self.props.foreground),
false => Style::default(),
})
.title(title),
)
.start_corner(Corner::TopLeft)
.highlight_style(
Style::default()
.bg(bg)
.fg(fg)
.add_modifier(self.props.get_modifiers()),
),
/// Based on the current properties and states, renders a widget using the provided render engine in the provided Area
/// If focused, cursor is also set (if supported by widget)
#[cfg(not(tarpaulin_include))]
fn render(&self, render: &mut Canvas, area: Rect) {
if self.props.visible {
// Make list
let list_item: Vec<ListItem> = match self.props.texts.rows.as_ref() {
None => vec![],
Some(lines) => lines
.iter()
.map(|line| ListItem::new(Span::from(line.content.to_string())))
.collect(),
};
let (fg, bg): (Color, Color) = match self.states.focus {
true => (Color::Reset, self.props.background),
false => (Color::Reset, Color::Reset),
};
let title: String = match self.props.texts.title.as_ref() {
Some(t) => t.clone(),
None => String::new(),
};
// Render
let mut state: ListState = ListState::default();
state.select(Some(self.states.list_index));
render.render_stateful_widget(
List::new(list_item)
.block(
Block::default()
.borders(Borders::ALL)
.border_style(match self.states.focus {
true => Style::default().fg(self.props.foreground),
false => Style::default(),
})
.title(title),
)
.start_corner(Corner::TopLeft)
.highlight_style(
Style::default()
.bg(bg)
.fg(fg)
.add_modifier(self.props.get_modifiers()),
),
cursor: self.states.list_index,
})
}
area,
&mut state,
);
}
}
@ -304,7 +303,7 @@ mod tests {
assert_eq!(component.states.focus, false);
// Increment list index
component.states.list_index += 1;
assert_eq!(component.render().unwrap().cursor, 1);
assert_eq!(component.states.list_index, 1);
// Update
component.update(
component
@ -325,7 +324,7 @@ mod tests {
// get value
assert_eq!(component.get_value(), Payload::Unsigned(0));
// Render
assert_eq!(component.render().unwrap().cursor, 0);
assert_eq!(component.states.list_index, 0);
// Handle inputs
assert_eq!(
component.on(InputEvent::Key(KeyEvent::from(KeyCode::Down))),

View file

@ -24,14 +24,14 @@
*/
// locals
use super::{Component, InputEvent, Msg, Payload, Props, PropsBuilder, Render};
use super::{Canvas, Component, InputEvent, Msg, Payload, Props, PropsBuilder};
// ext
use crossterm::event::KeyCode;
use tui::{
layout::Corner,
layout::{Corner, Rect},
style::{Color, Style},
text::Span,
widgets::{Block, Borders, List, ListItem},
widgets::{Block, Borders, List, ListItem, ListState},
};
// -- states
@ -129,52 +129,51 @@ impl FileList {
impl Component for FileList {
/// ### render
///
/// Based on the current properties and states, return a Widget instance for the Component
/// Returns None if the component is hidden
fn render(&self) -> Option<Render> {
match self.props.visible {
false => None,
true => {
// Make list
let list_item: Vec<ListItem> = match self.props.texts.rows.as_ref() {
None => vec![],
Some(lines) => lines
.iter()
.map(|line| ListItem::new(Span::from(line.content.to_string())))
.collect(),
};
let (fg, bg): (Color, Color) = match self.states.focus {
true => (Color::Reset, self.props.background),
false => (self.props.foreground, Color::Reset),
};
let title: String = match self.props.texts.title.as_ref() {
Some(t) => t.clone(),
None => String::new(),
};
// Render
Some(Render {
widget: Box::new(
List::new(list_item)
.block(
Block::default()
.borders(Borders::ALL)
.border_style(match self.states.focus {
true => Style::default().fg(self.props.foreground),
false => Style::default(),
})
.title(title),
)
.start_corner(Corner::TopLeft)
.highlight_style(
Style::default()
.bg(bg)
.fg(fg)
.add_modifier(self.props.get_modifiers()),
),
/// Based on the current properties and states, renders a widget using the provided render engine in the provided Area
/// If focused, cursor is also set (if supported by widget)
#[cfg(not(tarpaulin_include))]
fn render(&self, render: &mut Canvas, area: Rect) {
if self.props.visible {
// Make list
let list_item: Vec<ListItem> = match self.props.texts.rows.as_ref() {
None => vec![],
Some(lines) => lines
.iter()
.map(|line| ListItem::new(Span::from(line.content.to_string())))
.collect(),
};
let (fg, bg): (Color, Color) = match self.states.focus {
true => (Color::Reset, self.props.background),
false => (self.props.foreground, Color::Reset),
};
let title: String = match self.props.texts.title.as_ref() {
Some(t) => t.clone(),
None => String::new(),
};
// Render
let mut state: ListState = ListState::default();
state.select(Some(self.states.list_index));
render.render_stateful_widget(
List::new(list_item)
.block(
Block::default()
.borders(Borders::ALL)
.border_style(match self.states.focus {
true => Style::default().fg(self.props.foreground),
false => Style::default(),
})
.title(title),
)
.start_corner(Corner::TopLeft)
.highlight_style(
Style::default()
.bg(bg)
.fg(fg)
.add_modifier(self.props.get_modifiers()),
),
cursor: self.states.list_index,
})
}
area,
&mut state,
);
}
}
@ -304,7 +303,7 @@ mod tests {
assert_eq!(component.states.focus, false);
// Increment list index
component.states.list_index += 1;
assert_eq!(component.render().unwrap().cursor, 1);
assert_eq!(component.states.list_index, 1);
// Update
component.update(
component
@ -325,7 +324,7 @@ mod tests {
// get value
assert_eq!(component.get_value(), Payload::Unsigned(0));
// Render
assert_eq!(component.render().unwrap().cursor, 0);
assert_eq!(component.states.list_index, 0);
// Handle inputs
assert_eq!(
component.on(InputEvent::Key(KeyEvent::from(KeyCode::Down))),

View file

@ -25,13 +25,15 @@
// locals
use super::super::props::InputType;
use super::{Component, InputEvent, Msg, Payload, PropValue, Props, PropsBuilder, Render};
use super::{Canvas, Component, InputEvent, Msg, Payload, PropValue, Props, PropsBuilder};
// ext
use crossterm::event::{KeyCode, KeyModifiers};
use tui::{
layout::Rect,
style::Style,
widgets::{Block, BorderType, Borders, Paragraph},
};
use unicode_width::UnicodeWidthStr;
// -- states
@ -110,6 +112,20 @@ impl OwnStates {
}
}
/// ### cursoro_at_begin
///
/// Place cursor at the begin of the input
pub fn cursor_at_begin(&mut self) {
self.cursor = 0;
}
/// ### cursor_at_end
///
/// Place cursor at the end of the input
pub fn cursor_at_end(&mut self) {
self.cursor = self.input.len();
}
/// ### decr_cursor
///
/// Decrement cursor value by one if possible
@ -168,9 +184,10 @@ impl Input {
impl Component for Input {
/// ### render
///
/// Based on the current properties and states, return a Widget instance for the Component
/// Returns None if the component is hidden
fn render(&self) -> Option<Render> {
/// Based on the current properties and states, renders a widget using the provided render engine in the provided Area
/// If focused, cursor is also set (if supported by widget)
#[cfg(not(tarpaulin_include))]
fn render(&self, render: &mut Canvas, area: Rect) {
if self.props.visible {
let title: String = match self.props.texts.title.as_ref() {
Some(t) => t.clone(),
@ -187,12 +204,13 @@ impl Component for Input {
.border_type(BorderType::Rounded)
.title(title),
);
Some(Render {
widget: Box::new(p),
cursor: self.states.cursor,
})
} else {
None
render.render_widget(p, area);
// Set cursor, if focus
if self.states.focus {
let x: u16 =
area.x + (self.states.render_value(self.props.input_type).width() as u16) + 1;
render.set_cursor(x, area.y);
}
}
}
@ -256,6 +274,16 @@ impl Component for Input {
self.states.incr_cursor();
Msg::None
}
KeyCode::End => {
// Cursor at last position
self.states.cursor_at_end();
Msg::None
}
KeyCode::Home => {
// Cursor at first positon
self.states.cursor_at_begin();
Msg::None
}
KeyCode::Char(ch) => {
// Check if modifiers is NOT CTRL OR ALT
if !key.modifiers.intersects(KeyModifiers::CONTROL)
@ -336,8 +364,16 @@ mod tests {
assert_eq!(component.states.focus, false);
// Get value
assert_eq!(component.get_value(), Payload::Text(String::from("home")));
// Render
assert_eq!(component.render().unwrap().cursor, 4);
// RenderData
//assert_eq!(component.render().unwrap().cursor, 4);
assert_eq!(
component
.states
.render_value(component.props.input_type)
.len()
+ 1,
4
);
// Handle events
// Try key with ctrl
assert_eq!(
@ -349,21 +385,45 @@ mod tests {
);
// String shouldn't have changed
assert_eq!(component.get_value(), Payload::Text(String::from("home")));
assert_eq!(component.render().unwrap().cursor, 4);
//assert_eq!(component.render().unwrap().cursor, 4);
assert_eq!(
component
.states
.render_value(component.props.input_type)
.len()
+ 1,
4
);
// Character
assert_eq!(
component.on(InputEvent::Key(KeyEvent::from(KeyCode::Char('/')))),
Msg::None
);
assert_eq!(component.get_value(), Payload::Text(String::from("home/")));
assert_eq!(component.render().unwrap().cursor, 5);
//assert_eq!(component.render().unwrap().cursor, 5);
assert_eq!(
component
.states
.render_value(component.props.input_type)
.len()
+ 1,
5
);
// Verify max length (shouldn't push any character)
assert_eq!(
component.on(InputEvent::Key(KeyEvent::from(KeyCode::Char('a')))),
Msg::None
);
assert_eq!(component.get_value(), Payload::Text(String::from("home/")));
assert_eq!(component.render().unwrap().cursor, 5);
//assert_eq!(component.render().unwrap().cursor, 5);
assert_eq!(
component
.states
.render_value(component.props.input_type)
.len()
+ 1,
5
);
// Enter
assert_eq!(
component.on(InputEvent::Key(KeyEvent::from(KeyCode::Enter))),
@ -375,7 +435,15 @@ mod tests {
Msg::None
);
assert_eq!(component.get_value(), Payload::Text(String::from("home")));
assert_eq!(component.render().unwrap().cursor, 4);
//assert_eq!(component.render().unwrap().cursor, 4);
assert_eq!(
component
.states
.render_value(component.props.input_type)
.len()
+ 1,
5
);
// Check backspace at 0
component.states.input = vec!['h'];
component.states.cursor = 1;
@ -384,21 +452,45 @@ mod tests {
Msg::None
);
assert_eq!(component.get_value(), Payload::Text(String::from("")));
assert_eq!(component.render().unwrap().cursor, 0);
//assert_eq!(component.render().unwrap().cursor, 0);
assert_eq!(
component
.states
.render_value(component.props.input_type)
.len()
+ 1,
0
);
// Another one...
assert_eq!(
component.on(InputEvent::Key(KeyEvent::from(KeyCode::Backspace))),
Msg::None
);
assert_eq!(component.get_value(), Payload::Text(String::from("")));
assert_eq!(component.render().unwrap().cursor, 0);
//assert_eq!(component.render().unwrap().cursor, 0);
assert_eq!(
component
.states
.render_value(component.props.input_type)
.len()
+ 1,
0
);
// See del behaviour here
assert_eq!(
component.on(InputEvent::Key(KeyEvent::from(KeyCode::Delete))),
Msg::None
);
assert_eq!(component.get_value(), Payload::Text(String::from("")));
assert_eq!(component.render().unwrap().cursor, 0);
//assert_eq!(component.render().unwrap().cursor, 0);
assert_eq!(
component
.states
.render_value(component.props.input_type)
.len()
+ 1,
0
);
// Check del behaviour
component.states.input = vec!['h', 'e'];
component.states.cursor = 1;
@ -407,15 +499,31 @@ mod tests {
Msg::None
);
assert_eq!(component.get_value(), Payload::Text(String::from("h")));
assert_eq!(component.render().unwrap().cursor, 1); // Shouldn't move
// Another one (should do nothing)
//assert_eq!(component.render().unwrap().cursor, 1); // Shouldn't move
assert_eq!(
component
.states
.render_value(component.props.input_type)
.len()
+ 1,
1
);
// Another one (should do nothing)
assert_eq!(
component.on(InputEvent::Key(KeyEvent::from(KeyCode::Delete))),
Msg::None
);
assert_eq!(component.get_value(), Payload::Text(String::from("h")));
assert_eq!(component.render().unwrap().cursor, 1); // Shouldn't move
// Move cursor right
//assert_eq!(component.render().unwrap().cursor, 1); // Shouldn't move
assert_eq!(
component
.states
.render_value(component.props.input_type)
.len()
+ 1,
1
);
// Move cursor right
component.states.input = vec!['h', 'e', 'l', 'l', 'o'];
component.states.cursor = 1;
component.props.input_len = Some(16); // Let's change length
@ -423,44 +531,125 @@ mod tests {
component.on(InputEvent::Key(KeyEvent::from(KeyCode::Right))), // between 'e' and 'l'
Msg::None
);
assert_eq!(component.render().unwrap().cursor, 2); // Should increment
// Put a character here
//assert_eq!(component.render().unwrap().cursor, 2); // Should increment
assert_eq!(
component
.states
.render_value(component.props.input_type)
.len()
+ 1,
2
);
// Put a character here
assert_eq!(
component.on(InputEvent::Key(KeyEvent::from(KeyCode::Char('a')))),
Msg::None
);
assert_eq!(component.get_value(), Payload::Text(String::from("heallo")));
assert_eq!(component.render().unwrap().cursor, 3);
//assert_eq!(component.render().unwrap().cursor, 3);
assert_eq!(
component
.states
.render_value(component.props.input_type)
.len()
+ 1,
3
);
// Move left
assert_eq!(
component.on(InputEvent::Key(KeyEvent::from(KeyCode::Left))),
Msg::None
);
assert_eq!(component.render().unwrap().cursor, 2); // Should decrement
// Go at the end
//assert_eq!(component.render().unwrap().cursor, 2); // Should decrement
assert_eq!(
component
.states
.render_value(component.props.input_type)
.len()
+ 1,
2
);
// Go at the end
component.states.cursor = 6;
// Move right
assert_eq!(
component.on(InputEvent::Key(KeyEvent::from(KeyCode::Right))),
Msg::None
);
assert_eq!(component.render().unwrap().cursor, 6); // Should stay
// Move left
//assert_eq!(component.render().unwrap().cursor, 6); // Should stay
assert_eq!(
component
.states
.render_value(component.props.input_type)
.len()
+ 1,
6
);
// Move left
assert_eq!(
component.on(InputEvent::Key(KeyEvent::from(KeyCode::Left))),
Msg::None
);
assert_eq!(component.render().unwrap().cursor, 5); // Should decrement
// Go at the beginning
//assert_eq!(component.render().unwrap().cursor, 5); // Should decrement
assert_eq!(
component
.states
.render_value(component.props.input_type)
.len()
+ 1,
5
);
// Go at the beginning
component.states.cursor = 0;
assert_eq!(
component.on(InputEvent::Key(KeyEvent::from(KeyCode::Left))),
Msg::None
);
assert_eq!(component.render().unwrap().cursor, 0); // Should stay
//assert_eq!(component.render().unwrap().cursor, 0); // Should stay
assert_eq!(
component
.states
.render_value(component.props.input_type)
.len()
+ 1,
0
);
// End - begin
assert_eq!(
component.on(InputEvent::Key(KeyEvent::from(KeyCode::End))),
Msg::None
);
assert_eq!(
component
.states
.render_value(component.props.input_type)
.len()
+ 1,
6
);
assert_eq!(
component.on(InputEvent::Key(KeyEvent::from(KeyCode::Home))),
Msg::None
);
assert_eq!(
component
.states
.render_value(component.props.input_type)
.len()
+ 1,
0
);
// Update value
component.update(component.get_props().with_value(PropValue::Str("new-value".to_string())).build());
assert_eq!(component.get_value(), Payload::Text(String::from("new-value")));
component.update(
component
.get_props()
.with_value(PropValue::Str("new-value".to_string()))
.build(),
);
assert_eq!(
component.get_value(),
Payload::Text(String::from("new-value"))
);
}
#[test]
@ -482,13 +671,29 @@ mod tests {
Msg::None
);
assert_eq!(component.get_value(), Payload::Unsigned(3000));
assert_eq!(component.render().unwrap().cursor, 4);
//assert_eq!(component.render().unwrap().cursor, 4);
assert_eq!(
component
.states
.render_value(component.props.input_type)
.len()
+ 1,
4
);
// Push a number
assert_eq!(
component.on(InputEvent::Key(KeyEvent::from(KeyCode::Char('1')))),
Msg::None
);
assert_eq!(component.get_value(), Payload::Unsigned(30001));
assert_eq!(component.render().unwrap().cursor, 5);
//assert_eq!(component.render().unwrap().cursor, 5);
assert_eq!(
component
.states
.render_value(component.props.input_type)
.len()
+ 1,
5
);
}
}

View file

@ -24,14 +24,14 @@
*/
// locals
use super::{Component, InputEvent, Msg, Payload, Props, PropsBuilder, Render};
use super::{Canvas, Component, InputEvent, Msg, Payload, Props, PropsBuilder};
// ext
use crossterm::event::KeyCode;
use tui::{
layout::Corner,
layout::{Corner, Rect},
style::Style,
text::{Span, Spans},
widgets::{Block, Borders, List, ListItem},
widgets::{Block, Borders, List, ListItem, ListState},
};
// -- states
@ -134,59 +134,54 @@ impl LogBox {
impl Component for LogBox {
/// ### render
///
/// Based on the current properties and states, return a Widget instance for the Component
/// Returns None if the component is hidden
fn render(&self) -> Option<Render> {
match self.props.visible {
false => None,
true => {
// Make list
let list_items: Vec<ListItem> = match self.props.texts.table.as_ref() {
None => Vec::new(),
Some(table) => table
.iter()
.map(|row| {
let columns: Vec<Span> = row
.iter()
.map(|col| {
Span::styled(
col.content.clone(),
Style::default()
.add_modifier(col.get_modifiers())
.fg(col.fg)
.bg(col.bg),
)
})
.collect();
ListItem::new(Spans::from(columns))
/// Based on the current properties and states, renders a widget using the provided render engine in the provided Area
/// If focused, cursor is also set (if supported by widget)
#[cfg(not(tarpaulin_include))]
fn render(&self, render: &mut Canvas, area: Rect) {
if self.props.visible {
// Make list
let list_items: Vec<ListItem> = match self.props.texts.table.as_ref() {
None => Vec::new(),
Some(table) => table
.iter()
.map(|row| {
let columns: Vec<Span> = row
.iter()
.map(|col| {
Span::styled(
col.content.clone(),
Style::default()
.add_modifier(col.get_modifiers())
.fg(col.fg)
.bg(col.bg),
)
})
.collect();
ListItem::new(Spans::from(columns))
})
.collect(), // Make List item from TextSpan
};
let title: String = match self.props.texts.title.as_ref() {
Some(t) => t.clone(),
None => String::new(),
};
// Render
let w = List::new(list_items)
.block(
Block::default()
.borders(Borders::ALL)
.border_style(match self.states.focus {
true => Style::default().fg(self.props.foreground),
false => Style::default(),
})
.collect(), // Make List item from TextSpan
};
let title: String = match self.props.texts.title.as_ref() {
Some(t) => t.clone(),
None => String::new(),
};
// Render
Some(Render {
widget: Box::new(
List::new(list_items)
.block(
Block::default()
.borders(Borders::ALL)
.border_style(match self.states.focus {
true => Style::default().fg(self.props.foreground),
false => Style::default(),
})
.title(title),
)
.start_corner(Corner::BottomLeft)
.highlight_style(
Style::default().add_modifier(self.props.get_modifiers()),
),
),
cursor: self.states.list_index,
})
}
.title(title),
)
.start_corner(Corner::BottomLeft)
.highlight_style(Style::default().add_modifier(self.props.get_modifiers()));
let mut state: ListState = ListState::default();
state.select(Some(self.states.list_index));
render.render_stateful_widget(w, area, &mut state);
}
}
@ -317,7 +312,7 @@ mod tests {
assert_eq!(component.states.focus, false);
// Increment list index
component.states.list_index -= 1;
assert_eq!(component.render().unwrap().cursor, 0);
assert_eq!(component.states.list_index, 0);
// Update
component.update(
component
@ -342,8 +337,8 @@ mod tests {
assert_eq!(component.states.list_len, 3);
// get value
assert_eq!(component.get_value(), Payload::Unsigned(2));
// Render
assert_eq!(component.render().unwrap().cursor, 2);
// RenderData
assert_eq!(component.states.list_index, 2);
// Set cursor to 0
component.states.list_index = 0;
// Handle inputs

View file

@ -24,7 +24,7 @@
*/
// imports
use super::{Component, InputEvent, Msg, Payload, PropValue, Props, PropsBuilder, Render};
use super::{Canvas, Component, InputEvent, Msg, Payload, PropValue, Props, PropsBuilder};
// exports
pub mod bookmark_list;

View file

@ -24,9 +24,10 @@
*/
// locals
use super::{Component, InputEvent, Msg, Payload, PropValue, Props, PropsBuilder, Render};
use super::{Canvas, Component, InputEvent, Msg, Payload, PropValue, Props, PropsBuilder};
// ext
use tui::{
layout::Rect,
style::Style,
widgets::{Block, Borders, Gauge},
};
@ -65,9 +66,10 @@ impl ProgressBar {
impl Component for ProgressBar {
/// ### render
///
/// Based on the current properties and states, return a Widget instance for the Component
/// Returns None if the component is hidden
fn render(&self) -> Option<Render> {
/// Based on the current properties and states, renders a widget using the provided render engine in the provided Area
/// If focused, cursor is also set (if supported by widget)
#[cfg(not(tarpaulin_include))]
fn render(&self, render: &mut Canvas, area: Rect) {
// Make a Span
if self.props.visible {
let title: String = match self.props.texts.title.as_ref() {
@ -88,24 +90,19 @@ impl Component for ProgressBar {
_ => 0.0,
};
// Make progress bar
Some(Render {
cursor: 0,
widget: Box::new(
Gauge::default()
.block(Block::default().borders(Borders::ALL).title(title))
.gauge_style(
Style::default()
.fg(self.props.foreground)
.bg(self.props.background)
.add_modifier(self.props.get_modifiers()),
)
.label(label)
.ratio(percentage),
),
})
} else {
// Invisible
None
render.render_widget(
Gauge::default()
.block(Block::default().borders(Borders::ALL).title(title))
.gauge_style(
Style::default()
.fg(self.props.foreground)
.bg(self.props.background)
.add_modifier(self.props.get_modifiers()),
)
.label(label)
.ratio(percentage),
area,
);
}
}
@ -195,8 +192,6 @@ mod tests {
assert_eq!(component.states.focus, false);
// Get value
assert_eq!(component.get_value(), Payload::None);
// Render
assert_eq!(component.render().unwrap().cursor, 0);
// Event
assert_eq!(
component.on(InputEvent::Key(KeyEvent::from(KeyCode::Delete))),

View file

@ -25,10 +25,11 @@
// locals
use super::super::props::TextSpan;
use super::{Component, InputEvent, Msg, Payload, PropValue, Props, PropsBuilder, Render};
use super::{Canvas, Component, InputEvent, Msg, Payload, PropValue, Props, PropsBuilder};
// ext
use crossterm::event::KeyCode;
use tui::{
layout::Rect,
style::{Color, Style},
text::Spans,
widgets::{Block, BorderType, Borders, Tabs},
@ -113,54 +114,50 @@ impl RadioGroup {
impl Component for RadioGroup {
/// ### render
///
/// Based on the current properties and states, return a Widget instance for the Component
/// Returns None if the component is hidden
fn render(&self) -> Option<Render> {
match self.props.visible {
false => None,
true => {
// Make choices
let choices: Vec<Spans> = self
.states
.choices
.iter()
.map(|x| Spans::from(x.clone()))
.collect();
// Make colors
let (bg, fg, block_fg): (Color, Color, Color) = match &self.states.focus {
true => (
self.props.foreground,
self.props.background,
self.props.foreground,
/// Based on the current properties and states, renders a widget using the provided render engine in the provided Area
/// If focused, cursor is also set (if supported by widget)
#[cfg(not(tarpaulin_include))]
fn render(&self, render: &mut Canvas, area: Rect) {
if self.props.visible {
// Make choices
let choices: Vec<Spans> = self
.states
.choices
.iter()
.map(|x| Spans::from(x.clone()))
.collect();
// Make colors
let (bg, fg, block_fg): (Color, Color, Color) = match &self.states.focus {
true => (
self.props.foreground,
self.props.background,
self.props.foreground,
),
false => (Color::Reset, Color::Reset, Color::Reset),
};
let title: String = match &self.props.texts.title {
Some(t) => t.clone(),
None => String::new(),
};
render.render_widget(
Tabs::new(choices)
.block(
Block::default()
.borders(Borders::ALL)
.border_type(BorderType::Rounded)
.style(Style::default().fg(block_fg))
.title(title),
)
.select(self.states.choice)
.style(Style::default())
.highlight_style(
Style::default()
.add_modifier(self.props.get_modifiers())
.fg(fg)
.bg(bg),
),
false => (Color::Reset, Color::Reset, Color::Reset),
};
let title: String = match &self.props.texts.title {
Some(t) => t.clone(),
None => String::new(),
};
Some(Render {
cursor: 0,
widget: Box::new(
Tabs::new(choices)
.block(
Block::default()
.borders(Borders::ALL)
.border_type(BorderType::Rounded)
.style(Style::default().fg(block_fg))
.title(title),
)
.select(self.states.choice)
.style(Style::default())
.highlight_style(
Style::default()
.add_modifier(self.props.get_modifiers())
.fg(fg)
.bg(bg),
),
),
})
}
area,
);
}
}
@ -287,8 +284,6 @@ mod tests {
assert_eq!(component.states.focus, false);
// Get value
assert_eq!(component.get_value(), Payload::Unsigned(1));
// Render
assert_eq!(component.render().unwrap().cursor, 0);
// Handle events
assert_eq!(
component.on(InputEvent::Key(KeyEvent::from(KeyCode::Left))),

View file

@ -24,10 +24,10 @@
*/
// locals
use super::{Component, InputEvent, Msg, Payload, Props, PropsBuilder, Render};
use super::{Canvas, Component, InputEvent, Msg, Payload, Props, PropsBuilder};
// ext
use tui::{
layout::Corner,
layout::{Corner, Rect},
style::Style,
text::{Span, Spans},
widgets::{Block, BorderType, Borders, List, ListItem},
@ -70,9 +70,10 @@ impl Table {
impl Component for Table {
/// ### render
///
/// Based on the current properties and states, return a Widget instance for the Component
/// Returns None if the component is hidden
fn render(&self) -> Option<Render> {
/// Based on the current properties and states, renders a widget using the provided render engine in the provided Area
/// If focused, cursor is also set (if supported by widget)
#[cfg(not(tarpaulin_include))]
fn render(&self, render: &mut Canvas, area: Rect) {
// Make a Span
if self.props.visible {
let title: String = match self.props.texts.title.as_ref() {
@ -102,23 +103,18 @@ impl Component for Table {
.collect(), // Make List item from TextSpan
};
// Make list
Some(Render {
cursor: 0,
widget: Box::new(
List::new(list_items)
.block(
Block::default()
.borders(Borders::ALL)
.border_style(Style::default())
.border_type(BorderType::Rounded)
.title(title),
)
.start_corner(Corner::TopLeft),
),
})
} else {
// Invisible
None
render.render_widget(
List::new(list_items)
.block(
Block::default()
.borders(Borders::ALL)
.border_style(Style::default())
.border_type(BorderType::Rounded)
.title(title),
)
.start_corner(Corner::TopLeft),
area,
);
}
}
@ -214,8 +210,6 @@ mod tests {
assert_eq!(component.states.focus, false);
// Get value
assert_eq!(component.get_value(), Payload::None);
// Render
assert_eq!(component.render().unwrap().cursor, 0);
// Event
assert_eq!(
component.on(InputEvent::Key(KeyEvent::from(KeyCode::Delete))),

View file

@ -24,9 +24,10 @@
*/
// locals
use super::{Component, InputEvent, Msg, Payload, Props, PropsBuilder, Render};
use super::{Canvas, Component, InputEvent, Msg, Payload, Props, PropsBuilder};
// ext
use tui::{
layout::Rect,
style::Style,
text::{Span, Spans, Text as TuiText},
widgets::Paragraph,
@ -66,9 +67,10 @@ impl Text {
impl Component for Text {
/// ### render
///
/// Based on the current properties and states, return a Widget instance for the Component
/// Returns None if the component is hidden
fn render(&self) -> Option<Render> {
/// Based on the current properties and states, renders a widget using the provided render engine in the provided Area
/// If focused, cursor is also set (if supported by widget)
#[cfg(not(tarpaulin_include))]
fn render(&self, render: &mut Canvas, area: Rect) {
// Make a Span
if self.props.visible {
let spans: Vec<Span> = match self.props.texts.rows.as_ref() {
@ -95,13 +97,7 @@ impl Component for Text {
.fg(self.props.foreground)
.bg(self.props.background),
);
Some(Render {
widget: Box::new(Paragraph::new(text)),
cursor: 0,
})
} else {
// Invisible
None
render.render_widget(Paragraph::new(text), area);
}
}
@ -199,8 +195,6 @@ mod tests {
assert_eq!(component.states.focus, false);
// Get value
assert_eq!(component.get_value(), Payload::None);
// Render
assert_eq!(component.render().unwrap().cursor, 0);
// Event
assert_eq!(
component.on(InputEvent::Key(KeyEvent::from(KeyCode::Delete))),

View file

@ -29,11 +29,17 @@ pub mod props;
pub mod view;
// locals
use props::{Props, PropsBuilder, PropValue};
use props::{PropValue, Props, PropsBuilder};
// ext
use crossterm::event::Event as InputEvent;
use crossterm::event::KeyEvent;
use tui::widgets::Widget;
use std::io::Stdout;
use tui::backend::CrosstermBackend;
use tui::layout::Rect;
use tui::Frame;
type Backend = CrosstermBackend<Stdout>;
pub(crate) type Canvas<'a> = Frame<'a, Backend>;
// -- Msg
@ -60,14 +66,13 @@ pub enum Payload {
None,
}
// -- Render
// -- RenderData
/// ## Render
/// ## RenderData
///
/// Render is the object which contains data related to the component render
pub struct Render {
pub widget: Box<dyn Widget>, // Widget
pub cursor: usize, // Cursor position
/// RenderData is the object which contains data related to the component render
pub struct RenderData {
pub cursor: usize, // Cursor position
}
// -- Component
@ -79,9 +84,9 @@ pub struct Render {
pub trait Component {
/// ### render
///
/// Based on the current properties and states, return a Widget instance for the Component
/// Returns None if the component is hidden
fn render(&self) -> Option<Render>;
/// Based on the current properties and states, renders the component in the provided area frame
#[cfg(not(tarpaulin_include))]
fn render(&self, frame: &mut Canvas, area: Rect);
/// ### update
///

View file

@ -24,7 +24,7 @@
*/
// imports
use super::{Component, InputEvent, Msg, Payload, Props, PropsBuilder, Render};
use super::{Canvas, Component, InputEvent, Msg, Payload, Props, PropsBuilder, Rect};
// ext
use std::collections::HashMap;
@ -83,11 +83,11 @@ impl View {
/// ### render
///
/// Render component with the provided id
pub fn render(&self, id: &str) -> Option<Render> {
match self.components.get(id) {
None => None,
Some(component) => component.render(),
/// RenderData component with the provided id
#[cfg(not(tarpaulin_include))]
pub fn render(&self, id: &str, frame: &mut Canvas, area: Rect) {
if let Some(component) = self.components.get(id) {
component.render(frame, area);
}
}
@ -258,6 +258,7 @@ mod tests {
assert!(view.components.get(text).is_none());
}
/*
#[test]
fn test_ui_layout_view_mount_render() {
let mut view: View = View::init();
@ -267,6 +268,7 @@ mod tests {
assert!(view.render(input).is_some());
assert!(view.render("unexisting").is_none());
}
*/
#[test]
fn test_ui_layout_view_focus() {