Skip to content

layouts.md

Latest commit

 

History

History
140 lines (102 loc) · 4.41 KB

layouts.md

File metadata and controls

140 lines (102 loc) · 4.41 KB

Pages

  1. Getting started
  2. Layouts
  3. Styling
  4. Components
  5. Writing component

Layouts

Defined in layout.sh

Preview

img

Description

Layout defines rectangle within components are drawn, we can create layout with four ways

First two are not requiring any layout, created before

# $1 - layout name
# Creates layout that takes all size of screen
layout.create_from_screen MyScreenLayout

# $1 - layout name
# $2 - start x position
# $3 - start y position
# $4 - end x position
# $5 - end y position
layout.create_from_size MySmallLayout 1 1 2 2

layout.create_from_screen only accepts a layout name and creates a layout with full screen size

layout.create_from_size accepts a layout name, and its size

One big difference between theese two functions is that when screen resized, layouts that created with layout.create_from_screen are resized, an so do all layouts that were splitted with from thoose layouts.

Layouts, created with layout.create_from_size needs to be resized manually with layout.set_size function

# $1 - layout name
# $2 - start x position
# $3 - start y position
# $4 - end x position
# $5 - end y position
layout.set_size MySmallLayout 2 2 4 4

Next two methods requiring base layout

# $1 - layout name from which new layouts will be created
# $2, $3, $4 and etc... - names of layouts that will be created
layout.v_split LAYOUT_NAME layout1 layout2...

# $1 - layout name that new layouts will be created
# $2, $3, $4 and etc... - names of layouts that will be created
layout.h_split LAYOUT_NAME layout1 layout2...

Both functions as first argument take layout, which will be splitted.

For arguments in [$2..$inf] default value is 1g, optionally you can pass value after = symbol, which will define GROW_TYPE - how much space layout should take of base layout

You can pass theese params as GROW_TYPE

  • {number}g - grow type, like flex grow, specifies how much layout will grow, relative to other layouts
  • {number}px - layout should take precisely this amount of pixels
  • {number}% - layout should take exactly this percentage of base layout

For example:

layout.h_split LAYOUT L1=9g L2=1g #L1 will take 90% of left space and L2 will take 10%
layout.h_split LAYOUT L1=30% L2=30% #L1 will take 30% of left space and L2 will take next 30%
layout.h_split LAYOUT L1 L2 # L1 will take 50% and L2 takes 50%, as default values will be 1g
layout.h_split LAYOUT L1=5px l2=1g # L1 will take only 5 rows, and other space will be taken by L2

Note that, when you change size of base layouts via layout.set_size or when layouts were created with layout.create_from_screen and terminal size changes, all layouts that were split from them will be recalculated on next draw, this will apply to nested splitting, like

layout.v_split LAYOUT_NAME layout1 layout2
layout.h_split layout2 h1 h2
# Layouts (layout1 layout2 h1 h2) will be recalculated when size of LAYOUT_NAME is changed

To get layouts size you can call

# $1 - layout
# $2 - variable name for start x position
# $3 - variable name for start y position
# $4 - variable name for end x position
# $5 - variable name for end y position
layout.get_rect layout start_x start_y end_x end_y
echo $start_x $start_y $end_x $end_y

Code from preview

Preview from layouts.sh in examples folder

source ../src/lib.sh
init_screen

layout.create_from_screen Layout

layout.v_split Layout vbox1 vbox2 # First vbox1 takes half of screen and vbox2 takes other half
layout.h_split vbox2 hbox1=3px hbox2 hbox3=3px # hbox1 and hbox3 takes 3px and, in center, hbox2 will fill free space of vbox1

rect.new rect
rect.new child_rect

rect.set_title rect "Im first rect"
rect.set_title child_rect "And im a child"


# We can also split non-screen layouts!
# Here we split layout inside rectangle
rect.get_layout rect layout_inside_rect
layout.v_split layout_inside_rect l1 l2


rect.draw rect vbox1 # Draw rect inside vbox1
# Layout inside rect now has size of vbox1, excluding borders
rect.draw rect hbox2 # Draw the same rect inside hbox2
# Layout inside rect now has size of hbox2, excluding borders

# Draw new rect inside half of rect layout
rect.draw child_rect l1 
rect.draw child_rect l2

buffer.flush
sleep 10
exit_screen