NUI / Components / Scroll, Lists & Data

ListViewBase

ImplementedScroll, Lists & Data

ListViewBase is a base data-driven list component for repeated entries.

Supported as an advanced base list-view data surface.

Overview

ListViewBase is a base data-driven list component for repeated entries.

When to use

Use ListViewBase in advanced documentation or generated docs when a lower-level list view surface is needed. Most public docs should lead users to ListView.

Children

Uses data/template fields instead of normal children.

Basic syntax

nui

ListViewBase ItemsBase {
    items: "wood|Wood|1;stone|Stone|2"
}

Supported properties

Property	Type	Required	Default	Description
`items`	string	No	Empty	Inline item data.
`dataSource`	string	No	Empty	Named external data source.
`itemKey`	string	No	Empty	Field or static key binding.
`itemText`	string	No	Empty	Field or static display text binding.
`itemValue`	string	No	Empty	Field or static value binding.
`itemCommand`	string	No	Empty	Command when an item is used or selected.
`selectedKey`	string	No	Empty	Initially selected item key.
`selectionMode`	enum	No	single	Selection mode.
`entryHeight`	number	No	Default	Entry height.
`virtualized`	bool	No	true	Enables virtualization.
`recycleEntries`	bool	No	true	Reuses entry widgets.
`overscan`	number	No	Default	Extra entries around viewport.
`scrollBarVisibility`	enum	No	auto	Scrollbar visibility.
`gap`	number	No	0	Space between entries.
`width`	number	No	Auto	Desired width.
`height`	number	No	Auto	Desired height.
`visible`	bool	No	true	Visibility flag.

Contextual properties

Contextual property rules

ListViewBase may receive stack, canvas, grid, wrap, or ExpandableArea slot properties only when it is authored as a direct child of the matching parent. It does not support normal authored child nodes.

Full syntax example

nui

ListViewBase ItemsBase {
    items: "wood|Wood|1;stone|Stone|2"
    itemKey: "id"
    itemText: "name"
    itemValue: "count"
    itemCommand: "SelectItem"
    selectedKey: "wood"
    selectionMode: single
    entryHeight: 32
    virtualized: true
    recycleEntries: true
    overscan: 2
    scrollBarVisibility: auto
    gap: 4
    width: 320
    height: 240
    visible: true
}

Limitations

Normal children { ... } blocks are not public syntax for this component.
Drag and drop should not be documented as currently supported.