Row
A row is horizontal container that allows you to position components side by side.
Last updated
A row is horizontal container that allows you to position components side by side.
Last updated
For more information on sizing in your app, please see our introduction here
Property
Description
Height
Fill container - The row fills the entire screen vertically
Fit contents - The row’s height changes to fit the components it contains
Relative size - The row fills the specified percentage of the screen
Absolute size - Sizes the row to a specified number of pixels
Width
Fill container - The row fills the entire screen horizontally
Fit contents - The row’s width changes to fit the components it contains
Relative size - The row fills the specified percentage of the screen
Absolute - Sizes the row to a specified number of pixels
The Horizontal Alignment
property allows you to space elements in a Row horizontally
The Vertical Alignment
property allows you to space elements in a Row vertically
Property
Description
Background Color
Default (none
). Select any color using the color picker, RGBA or HEX value
Background Picture
You can upload a background image to your app or reference an image url e.g.beaver-yellow.png
Background Picture Resize Mode
Cover: Fills the entire screen without changing the height and width ratio of the image
Contain: The entire image will be scaled down to fit inside the screen, without changing the height and width ratio of the image
Stretch: The image's height will change to fill the screen length-wise
Repeat: Repeat the image to cover the screen. The image's height and width ratio
will not change
Center: Positions the image in the middle of the frame