Skip to main content

​
List View

Stac listview allows you to build the Flutter listview widget using JSON. To know more about the listview widget in Flutter, refer to the official documentation.

​
Properties

PropertyTypeDescription
scrollDirectionAxisThe Axis along which the scroll view’s offset increases.
reverseboolWhether the scroll view scrolls in the reading direction.
primaryboolWhether this is the primary scroll view.
physicsStacScrollPhysicsHow the scroll view should respond to user input.
shrinkWrapboolWhether the extent of the scroll view in the scrollDirection should be determined by the contents being viewed.
paddingStacEdgeInsetsThe amount of space by which to inset the children.
addAutomaticKeepAlivesboolDetermines whether the children should be automatically kept alive (cached) when they are no longer visible, preserving their state.
addRepaintBoundariesboolDetermines whether each child widget is wrapped in a RepaintBoundary to optimize rendering by reducing unnecessary repaints.
addSemanticIndexesboolDetermines whether semantic indexes are assigned to the children, enabling accessibility tools to understand the order and structure of the list items.
cacheExtentdoubleThe viewport has an area before and after the visible area to cache items that are about to become visible when the user scrolls.
childrenList<Map<String,dynamic>>The widgets below this widget in the tree.
separatorMap<String,dynamic>Defines a widget, to display between each pair of list items.
semanticChildCountintThe number of children that will contribute semantic information.
dragStartBehaviorDragStartBehaviorDetermines the way that drag start behavior is handled.
keyboardDismissBehaviorScrollViewKeyboardDismissBehaviorDefines how this ScrollView will dismiss the keyboard automatically.
restorationIdStringRestoration ID to save and restore the scroll offset of the scrollable.
clipBehaviorClipThe content will be clipped (or not) according to this option.

​
Example JSON

{
  "type": "listView",
  "shrinkWrap": true,
  "separator": {
    "type": "container",
    "height": 10
  },
  "children": [
    {
      "type": "listTile",
      "leading": {
        "type": "container",
        "height": 50,
        "width": 50,
        "color": "#165FC7",
        "child": {
          "type": "column",
          "mainAxisAlignment": "center",
          "crossAxisAlignment": "center",
          "children": [
            {
              "type": "text",
              "data": "1",
              "style": {
                "fontSize": 21
              }
            }
          ]
        }
      },
      "title": {
        "type": "padding",
        "padding": {
          "top": 10
        },
        "child": {
          "type": "text",
          "data": "Item 1",
          "style": {
            "fontSize": 18
          }
        }
      },
      "subtitle": {
        "type": "padding",
        "padding": {
          "top": 10
        },
        "child": {
          "type": "text",
          "data": "Item description",
          "style": {
            "fontSize": 14
          }
        }
      },
      "trailing": {
        "type": "icon",
        "iconType": "material",
        "icon": "more_vert",
        "size": 24
      }
    },
    {
      "type": "listTile",
      "leading": {
        "type": "container",
        "height": 50,
        "width": 50,
        "color": "#165FC7",
        "child": {
          "type": "column",
          "mainAxisAlignment": "center",
          "crossAxisAlignment": "center",
          "children": [
            {
              "type": "text",
              "data": "2",
              "style": {
                "fontSize": 21
              }
            }
          ]
        }
      },
      "title": {
        "type": "padding",
        "padding": {
          "top": 10
        },
        "child": {
          "type": "text",
          "data": "Item 2",
          "style": {
            "fontSize": 18
          }
        }
      },
      "subtitle": {
        "type": "padding",
        "padding": {
          "top": 10
        },
        "child": {
          "type": "text",
          "data": "Item description",
          "style": {
            "fontSize": 14
          }
        }
      },
      "trailing": {
        "type": "icon",
        "iconType": "material",
        "icon": "more_vert",
        "size": 24
      }
    },
    {
      "type": "listTile",
      "leading": {
        "type": "container",
        "height": 50,
        "width": 50,
        "color": "#165FC7",
        "child": {
          "type": "column",
          "mainAxisAlignment": "center",
          "crossAxisAlignment": "center",
          "children": [
            {
              "type": "text",
              "data": "3",
              "style": {
                "fontSize": 21
              }
            }
          ]
        }
      },
      "title": {
        "type": "padding",
        "padding": {
          "top": 10
        },
        "child": {
          "type": "text",
          "data": "Item 3",
          "style": {
            "fontSize": 18
          }
        }
      },
      "subtitle": {
        "type": "padding",
        "padding": {
          "top": 10
        },
        "child": {
          "type": "text",
          "data": "Item description",
          "style": {
            "fontSize": 14
          }
        }
      },
      "trailing": {
        "type": "icon",
        "iconType": "material",
        "icon": "more_vert",
        "size": 24
      }
    }
  ]
}
⌘I