Column
A column is a vertical container that allows you to stack components.
.png?alt=media&token=42f1efb3-6ab4-420f-957c-67c3a6385580)
Property | Description |
Height |
|
Width |
|
The
Vertical Alignment
property allows you to space elements in a Column vertically

The
Horizontal Alignment
property allows you to space elements in a Column horizontally.png?alt=media&token=63a5c57b-4767-41d2-967d-24a4bf49c08d)
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 |
This determines how to resize the image when the frame doesn't match the raw image dimensions.

- 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 ratiowill not change
- Center: Positions the image in the middle of the frame
Property | Description |
Scrollable | Default ( false ). Indicates whether the column is scrollable. For scrollable to work, you must also set your screen height to fit contents and the components in your column must have heights set in absolute pixels |
Last modified 11mo ago