List
Overview
Add a list to the view.
Component Properties
Dimensions — The placement on the canvas (X and Y) and the size (width and height) of the component.
To move a component freely, the View Property tab must have the Free Positioning option checked. |
Data
Hide Component — The date picker can be hidden by applying a rule on a certain event.
Alternate Views — Create alternate presentation of the list based on the content.
Type — Select the type of list to be displayed.
List
List Source — Select the source dataset. Datasets are created in the Datasets view.
List View — The view to display the list.
On Item Select — Select the event when an item is selected.
On End Reached — Select the event when the end of the dataset is reached.
On End Reached Threshold(0-1) — Set a value between 0 and 1 to define at what distance the end is reached, when loading the list.
On Drag — Select the event when an item is dragged.
On Drag Start — Select the event when an item drag is started.
On Drag End — Select the event when an item drag is ended.
Calendar
List Source — Select the source dataset. Datasets are created in the Datasets view.
List View — The view to display the calendar.
On Item Select — Select the event when an item is selected.
On End Reached — Select the event when the end of the dataset is reached.
On End Reached Threshold(0-1) — Set a value between 0 and 1 to define at what distance the end is reached, when loading the calendar.
On Drag — Select the event when an item is dragged.
On Drag Start — Select the event when an item drag is started.
On Drag End — Select the event when an item drag is ended.
Gallery
List Source — Select the source dataset. Datasets are created in the Datasets view.
List View — The view to display the gallery.
On Item Select — Select the event when an item is selected.
On Drag — Select the event when an item is dragged.
On Drag Start — Select the event when an item drag is started.
On Drag End — Select the event when an item drag is ended.
Map
List Source — Select the source dataset. Datasets are created in the Datasets view.
List View — The view to display the calendar.
On Item Select — Select the event when an item is selected.
On Drag — Select the event when an item is dragged.
On Drag Start — Select the event when an item drag is started.
On Drag End — Select the event when an item drag is ended.
Output Data To — Select an output, configured under the View Properties tab, to output the data to.
Filter — Filter the items in the list.
Group By — Select a column to group by.
Sticky Group Headers — Apply persistent headers, so the headers remain in place when scrolling.
Order By Direction — Select a column to order by, select ascending or descending.
Featured Label — Label for featured items or entries.
Featured — Select an item or entry in a dataset, to be featured in a list, for instance a piece of news.
Featured Type — Select how the featured item will be presented.
Carousel Image — Select an image for the carousel.
Carousel Title — Select a title for the carousel.
Carousel Height — The height of the carousel.
Searchable — Make the list searchable.
Searching Label — Set a label when searching.
Loading Property — Select if a spinner should show while loading a dataset from an external source.
Empty List Icon — Select an icon to display when a dataset is empty.
Empty List Text — Select a text to display when a dataset is empty.
Empty List Text Size — Select the text size of the displayed empty list text.
Styling
Override — Override the currently selected style.
Unselected Icon Color — Select the color of an unselected icon.
Selected Icon Color — Select the color of a selected icon.
Empty List Icon Color — Select the color of an empty list icon.
Background Color — Sets the background color of the component.
Background Image — Select an image as the component’s background.
Background Size — Select if the image should cover the component’s background, be centered, repeated or stretched.
Component Width — The width of the component inside the container (the component’s borders).
Component Height — The height of the component inside the container (the component’s borders)
Flex Direction — Select the main axis where flex items will be placed, for instance horizontal or vertical (along a row or in a column).
Justify Content — Select how flex items will be placed in relation to each other, for instance towards the start of the flex direction, or with space between.
Align Content — Select how flex items will be placed in relation to the components border.
Align Items — Select how flex items will be placed in relation to the flex direction.
Border Top Color — The color of the component’s top border.
Border Top Width — The width of the component’s top border.
Border Bottom Color — The color of the component’s bottom border.
Border Bottom Width — The width of the component’s bottom border.
Border Left Color — The color of the component’s left border.
Border Left Width — The width of the component’s left border.
Border Right Color — The color of the component’s right border.
Border Right Width The width of the component’s right border.
Border Top Left Radius — Sets the rounding of the top left corner.
Border Bottom Left Radius — Sets the rounding of the bottom left corner.
Border Top Right Radius — Sets the rounding of the top right corner.
Border Bottom Right Radius — Sets the rounding of the bottom right corner.
Border Radius (All) — Sets the rounding of all corners.
Border Style — Sets the style, solid, dotted or dashed, of the component’s border.
Shadow — Adds a shadow to the component’s borders.
Opacity — Sets the opacity of the component.
Component Padding — Sets the padding, top, bottom, left, right of the component inside the container (the component’s borders).
Component Container Padding — Sets the padding, top, bottom, left, right of the component container (the component’s borders).