@ -6,7 +6,7 @@ use std::{error::Error, io};
use termion ::{ event ::Key , input ::MouseTerminal , raw ::IntoRawMode , screen ::AlternateScreen } ;
use termion ::{ event ::Key , input ::MouseTerminal , raw ::IntoRawMode , screen ::AlternateScreen } ;
use tui ::{
use tui ::{
backend ::TermionBackend ,
backend ::TermionBackend ,
layout ::{ Constraint, Direction , Layout } ,
layout ::{ Alignment, Constraint, Direction , Layout } ,
style ::{ Color , Modifier , Style } ,
style ::{ Color , Modifier , Style } ,
text ::Span ,
text ::Span ,
widgets ::{ Block , BorderType , Borders } ,
widgets ::{ Block , BorderType , Borders } ,
@ -30,21 +30,28 @@ fn main() -> Result<(), Box<dyn Error>> {
// Just draw the block and the group on the same area and build the group
// Just draw the block and the group on the same area and build the group
// with at least a margin of 1
// with at least a margin of 1
let size = f . size ( ) ;
let size = f . size ( ) ;
// Surounding block
let block = Block ::default ( )
let block = Block ::default ( )
. borders ( Borders ::ALL )
. borders ( Borders ::ALL )
. title ( "Main block with round corners" )
. title ( "Main block with round corners" )
. title_alignment ( Alignment ::Center )
. border_type ( BorderType ::Rounded ) ;
. border_type ( BorderType ::Rounded ) ;
f . render_widget ( block , size ) ;
f . render_widget ( block , size ) ;
let chunks = Layout ::default ( )
let chunks = Layout ::default ( )
. direction ( Direction ::Vertical )
. direction ( Direction ::Vertical )
. margin ( 4 )
. margin ( 4 )
. constraints ( [ Constraint ::Percentage ( 50 ) , Constraint ::Percentage ( 50 ) ] . as_ref ( ) )
. constraints ( [ Constraint ::Percentage ( 50 ) , Constraint ::Percentage ( 50 ) ] . as_ref ( ) )
. split ( f . size ( ) ) ;
. split ( f . size ( ) ) ;
// Top two inner blocks
let top_chunks = Layout ::default ( )
let top_chunks = Layout ::default ( )
. direction ( Direction ::Horizontal )
. direction ( Direction ::Horizontal )
. constraints ( [ Constraint ::Percentage ( 50 ) , Constraint ::Percentage ( 50 ) ] . as_ref ( ) )
. constraints ( [ Constraint ::Percentage ( 50 ) , Constraint ::Percentage ( 50 ) ] . as_ref ( ) )
. split ( chunks [ 0 ] ) ;
. split ( chunks [ 0 ] ) ;
// Top left inner block with green background
let block = Block ::default ( )
let block = Block ::default ( )
. title ( vec! [
. title ( vec! [
Span ::styled ( "With" , Style ::default ( ) . fg ( Color ::Yellow ) ) ,
Span ::styled ( "With" , Style ::default ( ) . fg ( Color ::Yellow ) ) ,
@ -53,21 +60,29 @@ fn main() -> Result<(), Box<dyn Error>> {
. style ( Style ::default ( ) . bg ( Color ::Green ) ) ;
. style ( Style ::default ( ) . bg ( Color ::Green ) ) ;
f . render_widget ( block , top_chunks [ 0 ] ) ;
f . render_widget ( block , top_chunks [ 0 ] ) ;
let block = Block ::default ( ) . title ( Span ::styled (
// Top right inner block with styled title aligned to the right
"Styled title" ,
let block = Block ::default ( )
Style ::default ( )
. title ( Span ::styled (
. fg ( Color ::White )
"Styled title" ,
. bg ( Color ::Red )
Style ::default ( )
. add_modifier ( Modifier ::BOLD ) ,
. fg ( Color ::White )
) ) ;
. bg ( Color ::Red )
. add_modifier ( Modifier ::BOLD ) ,
) )
. title_alignment ( Alignment ::Right ) ;
f . render_widget ( block , top_chunks [ 1 ] ) ;
f . render_widget ( block , top_chunks [ 1 ] ) ;
// Bottom two inner blocks
let bottom_chunks = Layout ::default ( )
let bottom_chunks = Layout ::default ( )
. direction ( Direction ::Horizontal )
. direction ( Direction ::Horizontal )
. constraints ( [ Constraint ::Percentage ( 50 ) , Constraint ::Percentage ( 50 ) ] . as_ref ( ) )
. constraints ( [ Constraint ::Percentage ( 50 ) , Constraint ::Percentage ( 50 ) ] . as_ref ( ) )
. split ( chunks [ 1 ] ) ;
. split ( chunks [ 1 ] ) ;
// Bottom left block with all default borders
let block = Block ::default ( ) . title ( "With borders" ) . borders ( Borders ::ALL ) ;
let block = Block ::default ( ) . title ( "With borders" ) . borders ( Borders ::ALL ) ;
f . render_widget ( block , bottom_chunks [ 0 ] ) ;
f . render_widget ( block , bottom_chunks [ 0 ] ) ;
// Bottom right block with styled left and right border
let block = Block ::default ( )
let block = Block ::default ( )
. title ( "With styled borders and doubled borders" )
. title ( "With styled borders and doubled borders" )
. border_style ( Style ::default ( ) . fg ( Color ::Cyan ) )
. border_style ( Style ::default ( ) . fg ( Color ::Cyan ) )