description
The List Viewer component allows you to add, view and click on items in a list.

List Viewer

Add items to a List Viewer

We recommend adding a short list of items within the app itself as the Screen starts

For longer lists, we recommend using the Spreadsheet component

Property	Description
Text Items	Default (`none`); items must be in list format

Property	Description
Item Click	Returns an `item` value and a numeric `index` number when an item is selected

You can customize the List Viewer with the following properties:

Show Arrow: To see an arrow beside each item in the list, set the switch to true
Visible: To see the text input in your app, set the switch to true
Border
- Width: Enter how wide you want the border outline of the List Viewer to be
- Color: Pick a color for the border of the List Viewer
- Style: Select if you want the border to be a dotted, dashed or solid line
- Radius: Enter how round you want the edges of the border for the List Viewer to be
Background Colour (Advanced): Sets the background color of the List Viewer

A List Viewer automatically fill 100% of the Screen width

You can set how tall the List Viewer is using the height property.

Height

Fill container - The List Viewer fills the entire screen vertically
Fit contents - The List Viewer’s height changes to fit the contents it contains
Relative size - The List Viewer fills the specified percentage of the screen
Absolute size - Sizes the List Viewer to a specified number of pixels

You change the spacing and positioning of the List Viewer with the Margin and Padding properties.

Margin

You can specify how much space you want between the border and the contents of List Viewer using either pixel or percent values.

Padding

You can specify how much space you want between the edges of the List Viewer and the screen using either pixel or percent values.