mirror of
https://github.com/ratatui-org/ratatui
synced 2024-11-10 07:04:17 +00:00
feat: Add one eighth wide and tall border sets ✨ (#831)
This PR adds the [`McGugan`](https://www.willmcgugan.com/blog/tech/post/ceo-just-wants-to-draw-boxes/) border set, which allows for tighter borders. For example, with the `flex` example you can get this effect (top is mcgugan wide, bottom is mcgugan tall): <img width="759" alt="image" src="https://github.com/ratatui-org/ratatui/assets/1813121/756bb50e-f8c3-4eec-abe8-ce358058a526"> <img width="759" alt="image" src="https://github.com/ratatui-org/ratatui/assets/1813121/583485ef-9eb2-4b45-ab88-90bd7cb14c54"> As of this PR, `MCGUGAN_WIDE` has to be styled manually, like so: ```rust let main_color = color_for_constraint(*constraint); let cell = buf.get_mut(block.x, block.y + 1); cell.set_style(Style::reset().fg(main_color).reversed()); let cell = buf.get_mut(block.x, block.y + 2); cell.set_style(Style::reset().fg(main_color).reversed()); let cell = buf.get_mut(block.x + block.width.saturating_sub(1), block.y + 1); cell.set_style(Style::reset().fg(main_color).reversed()); let cell = buf.get_mut(block.x + block.width.saturating_sub(1), block.y + 2); cell.set_style(Style::reset().fg(main_color).reversed()); ``` `MCGUGAN_TALL` has to be styled manually, like so: ```rust let main_color = color_for_constraint(*constraint); for x in block.x + 1..(block.x + block.width).saturating_sub(1) { let cell = buf.get_mut(x, block.y); cell.set_style(Style::reset().fg(main_color).reversed()); let cell = buf.get_mut(x, block.y + block.height - 1); cell.set_style(Style::reset().fg(main_color).reversed()); } ```
This commit is contained in:
parent
4d262d21cb
commit
f299463847
1 changed files with 43 additions and 0 deletions
|
@ -381,6 +381,49 @@ pub mod border {
|
|||
horizontal_top: QUADRANT_BOTTOM_HALF,
|
||||
horizontal_bottom: QUADRANT_TOP_HALF,
|
||||
};
|
||||
|
||||
pub const ONE_EIGHTH_TOP_EIGHT: &str = "▔";
|
||||
pub const ONE_EIGHTH_BOTTOM_EIGHT: &str = "▁";
|
||||
pub const ONE_EIGHTH_LEFT_EIGHT: &str = "▏";
|
||||
pub const ONE_EIGHTH_RIGHT_EIGHT: &str = "▕";
|
||||
|
||||
/// Wide border set based on McGugan box technique
|
||||
///
|
||||
/// ```text
|
||||
/// ▁▁▁▁▁▁▁
|
||||
/// ▏xxxxx▕
|
||||
/// ▏xxxxx▕
|
||||
/// ▔▔▔▔▔▔▔
|
||||
/// ```
|
||||
pub const ONE_EIGHTH_WIDE: Set = Set {
|
||||
top_right: ONE_EIGHTH_BOTTOM_EIGHT,
|
||||
top_left: ONE_EIGHTH_BOTTOM_EIGHT,
|
||||
bottom_right: ONE_EIGHTH_TOP_EIGHT,
|
||||
bottom_left: ONE_EIGHTH_TOP_EIGHT,
|
||||
vertical_left: ONE_EIGHTH_LEFT_EIGHT,
|
||||
vertical_right: ONE_EIGHTH_RIGHT_EIGHT,
|
||||
horizontal_top: ONE_EIGHTH_BOTTOM_EIGHT,
|
||||
horizontal_bottom: ONE_EIGHTH_TOP_EIGHT,
|
||||
};
|
||||
|
||||
/// Tall border set based on McGugan box technique
|
||||
///
|
||||
/// ```text
|
||||
/// ▕▔▔▏
|
||||
/// ▕xx▏
|
||||
/// ▕xx▏
|
||||
/// ▕▁▁▏
|
||||
/// ```
|
||||
pub const ONE_EIGHTH_TALL: Set = Set {
|
||||
top_right: ONE_EIGHTH_LEFT_EIGHT,
|
||||
top_left: ONE_EIGHTH_RIGHT_EIGHT,
|
||||
bottom_right: ONE_EIGHTH_LEFT_EIGHT,
|
||||
bottom_left: ONE_EIGHTH_RIGHT_EIGHT,
|
||||
vertical_left: ONE_EIGHTH_RIGHT_EIGHT,
|
||||
vertical_right: ONE_EIGHTH_LEFT_EIGHT,
|
||||
horizontal_top: ONE_EIGHTH_TOP_EIGHT,
|
||||
horizontal_bottom: ONE_EIGHTH_BOTTOM_EIGHT,
|
||||
};
|
||||
}
|
||||
|
||||
pub const DOT: &str = "•";
|
||||
|
|
Loading…
Reference in a new issue