class GroupListView
package feathers.controls
extends BaseScrollContainer › FeathersControl › MeasureSprite › ValidatingSprite
implements IDataSelector<Dynamic>
Displays a list of items divided into groups or sections. Accepts a
hierarchical tree of items, similar to TreeView, but limits the display to
two levels of hierarchy at most. Supports scrolling, custom item renderers,
and custom layouts.
The following example creates a group list, gives it a data provider, tells the item renderer how to interpret the data, and listens for when the selection changes:
var groupListView = new GroupListView();
groupListView.dataProvider = new TreeCollection([
new TreeNode({text: "Group A"}, [
new TreeNode({text: "Node A1"}),
new TreeNode({text: "Node A2"}),
new TreeNode({text: "Node A3"}),
new TreeNode({text: "Node A4"})
]),
new TreeNode({text: "Group B"}, [
new TreeNode({text: "Node B1"}),
new TreeNode({text: "Node B2"}),
new TreeNode({text: "Node B3"})
]),
new TreeNode({text: "Group C"}, [
new TreeNode({text: "Node C1"})
])
]);
groupListView.itemToText = (item:TreeNode<Dynamic>) -> {
return item.data.text;
};
groupListView.addEventListener(Event.CHANGE, (event:Event) -> {
var groupListView = cast(event.currentTarget, GroupListView);
trace("GroupListView changed: " + groupListView.selectedLocation + " " + groupListView.selectedItem.text);
});
this.addChild(groupListView);Events:
openfl.events.Event.CHANGE | Dispatched when either
|
|---|---|
feathers.events.GroupListViewEvent.ITEM_TRIGGER | Dispatched when the user taps or clicks an item renderer in the list view. The pointer must remain within the bounds of the item renderer on release, and the list view cannot scroll before release, or the gesture will be ignored. |
1.0.0
.See also:
Static variables
staticfinalread onlyCHILD_VARIANT_HEADER_RENDERER:String = "groupListView_headerRenderer"
The variant used to style the group headers in a theme.
To override this default variant, set the
GroupListView.customHeaderRendererVariant property.
1.0.0
.See also:
staticfinalread onlyCHILD_VARIANT_ITEM_RENDERER:String = "groupListView_itemRenderer"
The variant used to style the group list view's item renderers in a theme.
To override this default variant, set the
GroupListView.customItemRendererVariant property.
1.0.0
.See also:
staticfinalread onlyVARIANT_BORDER:String = "border"
A variant used to style the group list view with a border. This variant is used by default on desktop.
The following example uses this variant:
var groupListView = new GroupListView();
groupListView.variant = GroupListView.VARIANT_BORDER;1.0.0
.See also:
staticfinalread onlyVARIANT_BORDERLESS:String = "borderless"
A variant used to style the group list view without a border. The variant is used by default on mobile.
The following example uses this variant:
var groupListView = new GroupListView();
groupListView.variant = GroupListView.VARIANT_BORDERLESS;1.0.0
.See also:
Constructor
new(?dataProvider:IHierarchicalCollection<Dynamic>)
Creates a new GroupListView object.
1.0.0
.Variables
customHeaderRendererVariant:String
A custom variant to set on all header renderers, instead of
GroupListView.CHILD_VARIANT_HEADER_RENDERER.
The customHeaderRendererVariant will be not be used if the result of
headerRendererRecycler.create() already has a variant set.
1.0.0
.See also:
customItemRendererVariant:String
A custom variant to set on all item renderers, instead of
GroupListView.CHILD_VARIANT_ITEM_RENDERER.
The customItemRendererVariant will be not be used if the result of
itemRendererRecycler.create() already has a variant set.
1.0.0
.See also:
dataProvider:IHierarchicalCollection<Dynamic>
The collection of data displayed by the group list view.
Items in the collection must be class instances or anonymous structures. Do not add primitive values (such as strings, booleans, or numeric values) directly to the collection.
Additionally, all items in the collection must be unique object instances. Do not add the same instance to the collection more than once because a runtime exception will be thrown.
The following example passes in a data provider and tells the item renderer how to interpret the data:
groupListView.dataProvider = new TreeCollection([
new TreeNode({text: "Group A"}, [
new TreeNode({text: "Node A1"}),
new TreeNode({text: "Node A2"}),
new TreeNode({text: "Node A3"}),
new TreeNode({text: "Node A4"})
]),
new TreeNode({text: "Group B"}, [
new TreeNode({text: "Node B1"}),
new TreeNode({text: "Node B2"}),
new TreeNode({text: "Node B3"})
]),
new TreeNode({text: "Group C"}, [
new TreeNode({text: "Node C1"})
])
]);
groupListView.itemToText = (item:Dynamic) -> {
return item.text;
};1.0.0
.headerRendererRecycler:DisplayObjectRecycler<Dynamic, GroupListViewItemState, DisplayObject>
Manages header renderers used by the group list view.
In the following example, the group list view uses a custom header renderer class:
groupListView.headerRendererRecycler = DisplayObjectRecycler.withClass(CustomHeaderRenderer);1.0.0
.itemRendererRecycler:DisplayObjectRecycler<Dynamic, GroupListViewItemState, DisplayObject>
Manages item renderers used by the group list view.
In the following example, the group list view uses a custom item renderer class:
groupListView.itemRendererRecycler = DisplayObjectRecycler.withClass(CustomItemRenderer);1.0.0
.layout:ILayout
The layout algorithm used to position and size the group list view's items.
By default, if no layout is provided by the time that the group list view initializes, a default layout that displays items vertically will be created.
The following example tells the group list view to use a horizontal layout:
var layout = new HorizontalListLayout();
layout.gap = 20.0;
layout.padding = 20.0;
groupListView.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:
groupListView.pointerSelectionEnabled = false;1.0.0
.selectable:Bool
Determines if items in the group 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 group list view:
groupListView.selectable = false;See also:
selectedLocation:Array<Int>
The currently selected location. Returns null if no location is
selected.
The following example selects a specific location:
groupListView.selectedLocation = [2, 0];The following example clears the currently selected location:
groupListView.selectedLocation = null;The following example listens for when the selection changes, and it prints the new selected location to the debug console:
var groupListView = new GroupListView();
function changeHandler(event:Event):Void
{
var groupListView = cast(event.currentTarget, GroupListView);
trace("selection change: " + groupListView.selectedLocation);
}
groupListView.addEventListener(Event.CHANGE, changeHandler);1.0.0
.virtualLayout:Bool
Indicates if the group list view's layout is allowed to virtualize items or not.
The following example disables virtual layouts:
groupListView.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
.dynamicitemToHeaderText(data:Dynamic):String
Converts an group to text to display within a group list view header. 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 Section" }If the GroupListView should display the text "Example Item", a custom
implementation of itemToHeaderText() might look like this:
groupListView.itemToHeaderText = (item:Dynamic) -> {
return item.text;
};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 group 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 GroupListView should display the text "Example Item", a custom
implementation of itemToText() might look like this:
groupListView.itemToText = (item:Dynamic) -> {
return item.text;
};1.0.0
.locationToItemRenderer(location:Array<Int>):DisplayObject
Returns the current item renderer used to render the item at the
specified location in 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
.scrollToLocation(location:Array<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.
1.0.0
.