class ListView
package feathers.controls
extends BaseScrollContainer › FeathersControl › MeasureSprite › ValidatingSprite
implements IDataSelector<Dynamic>, IIndexSelector
Displays a one-dimensional list of items. Supports scrolling, custom item renderers, and custom layouts.
Layouts may be, and are highly encouraged to be, virtual, meaning that the list view is capable of creating a limited number of item renderers to display a subset of the data provider that is currently visible, instead of creating a renderer for every single item. This allows for optimized performance with very large data providers.
The following example creates a list view, gives it a data provider, tells the item renderer how to interpret the data, and listens for when the selection changes:
var listView = new ListView();
listView.dataProvider = new ArrayCollection([
{ text: "Milk" },
{ text: "Eggs" },
{ text: "Bread" },
{ text: "Chicken" },
]);
listView.itemToText = (item:Dynamic) -> {
return item.text;
};
listView.addEventListener(Event.CHANGE, (event:Event) -> {
var listView = cast(event.currentTarget, ListView);
trace("ListView changed: " + listView.selectedIndex + " " + listView.selectedItem.text);
});
this.addChild(listView);
1.0.0
.See also:
Static variables
staticfinalread onlyVARIANT_BORDER:String = "border"
A variant used to style the list view with a border. This variant is used by default on desktop.
The following example uses this variant:
var listView = new ListView();
listView.variant = ListView.VARIANT_BORDER;
1.0.0
.See also:
staticfinalread onlyVARIANT_BORDERLESS:String = "borderless"
A variant used to style the list view without a border. The variant is used by default on mobile.
The following example uses this variant:
var listView = new ListView();
listView.variant = ListView.VARIANT_BORDERLESS;
1.0.0
.See also:
Constructor
Variables
allowMultipleSelection:Bool
Determines if multiple items may be selected at the same time. Has no
effect if selectable
is false
.
In the following example, multiple selection is enabled:
listView.allowMultipleSelection = true;
1.0.0
.See also:
dataProvider:IFlatCollection<Dynamic>
The collection of data displayed by the list view.
The following example passes in a data provider and tells the item renderer how to interpret the data:
listView.dataProvider = new ArrayCollection([
{ text: "Milk" },
{ text: "Eggs" },
{ text: "Bread" },
{ text: "Chicken" },
]);
listView.itemToText = (item:Dynamic) -> {
return item.text;
};
1.0.0
.See also:
itemRendererRecycler:DisplayObjectRecycler<Dynamic, ListViewItemState, DisplayObject>
Manages item renderers used by the list view.
In the following example, the list view uses a custom item renderer class:
listView.itemRendererRecycler = DisplayObjectRecycler.withClass(CustomItemRenderer);
1.0.0
.layout:ILayout
The layout algorithm used to position and size the list view's items.
By default, if no layout is provided by the time that the list view initializes, a default layout that displays items vertically will be created.
The following example tells the list view to use a horizontal layout:
var layout = new HorizontalListLayout();
layout.gap = 20.0;
layout.padding = 20.0;
listView.layout = layout;
1.0.0
.pointerSelectionEnabled:Bool = true
Indicates if selection is changed with MouseEvent.CLICK
or
TouchEvent.TOUCH_TAP
when the item renderer does not implement the
IToggle
interface. If set to false
, all item renderers must control
their own selection manually (not only ones that implement IToggle
).
The following example disables pointer selection:
listView.pointerSelectionEnabled = false;
1.0.0
.selectable:Bool
Determines if items in the list view may be selected. By default only a single item may be selected at any given time. In other words, if item A is already selected, and the user selects item B, item A will be deselected automatically.
The following example disables selection of items in the list view:
listView.selectable = false;
See also:
selectedIndices:Array<Int>
Contains all of the indices that are currently selected. The most recently selected index will appear at the beginning of the array. In other words, the indices are in the reverse order that they were selected by the user.
When the selectedIndices
array contains multiple items, the
selectedIndex
property will return the first item from
selectedIndices
.
1.0.0
.See also:
selectedItems:Array<Dynamic>
Contains all of the items that are currently selected. The most recently selected item will appear at the beginning of the array. In other words, the items are in the reverse order that they were selected by the user.
When the selectedItems
array contains multiple items, the
selectedItem
property will return the first item from selectedItems
.
1.0.0
.See also:
virtualLayout:Bool
Indicates if the list view's layout is allowed to virtualize items or not.
The following example disables virtual layouts:
listView.virtualLayout = false;
1.0.0
.Methods
itemRendererToItem(itemRenderer:DisplayObject):Dynamic
Returns the current item from the data provider that is rendered by a specific item renderer.
1.0.0
.itemToItemRenderer(item:Dynamic):DisplayObject
Returns the current item renderer used to render a specific item from
the data provider. May return null
if an item doesn't currently have
an item renderer.
Note: Most list views use "virtual" layouts, which means that only the currently-visible subset of items will have an item renderer. As the list view scrolls, the items with item renderers will change, and item renderers may even be re-used to display different items.
1.0.0
.dynamicitemToText(data:Dynamic):String
Converts an item to text to display within list view. By default, the
toString()
method is called to convert an item to text. This method
may be replaced to provide custom text.
For example, consider the following item:
{ text: "Example Item" }
If the ListView
should display the text "Example Item", a custom
implementation of itemToText()
might look like this:
listView.itemToText = (item:Dynamic) -> {
return item.text;
};
1.0.0
.scrollToIndex(index:Int, ?animationDuration:Float):Void
Scrolls the list view so that the specified item renderer is completely visible. If the item renderer is already completely visible, does not update the scroll position.
A custom animation duration may be specified. To update the scroll
position without animation, pass a value of 0.0
for the duration.
@since 1.0.0