Class zebkit.ui.List
extends <zebkit.ui.BaseList>
<zebkit.ui>

The class is list component implementation that visualizes zebkit.data.ListModel. It is supposed the model can have any type of items. Visualization of the items is customized by defining a view provider.

The general use case:

       // create list component that contains three item
       var list = new zebkit.ui.List([
           "Item 1",
           "Item 2",
           "Item 3"
       ]);

       ...
       // add new item
       list.model.add("Item 4");

       ...
       // remove first item
       list.model.removeAt(0);

To customize list items views you can redefine item view provider as following:

       // suppose every model item is an array that contains two elements,
       // first element points to the item icon and the second element defines
       // the list item text
       var list = new zebkit.ui.List([
           [ "icon1.gif", "Caption 1" ],
           [ "icon2.gif", "Caption 1" ],
           [ "icon3.gif", "Caption 1" ]
       ]);

       // define new list item views provider that represents every
       // list model item as icon with a caption
       list.setViewProvider(new zebkit.ui.List.ViewProvider([
           function getView(target, i, value) {
               var caption = value[1];
               var icon    = value[0];
               return new zebkit.ui.CompRender(new zebkit.ui.ImageLabel(caption, icon));
           }
       ]));
Constructor:
zebkit.ui.List ([model], [isComboMode])

Parameters:
  • [model] <zebkit.data.ListModel | Array>

    a list model that should be passed as an instance of zebkit.data.ListModel or as an array.

  • [isComboMode] <Boolean>

    true if the list navigation has to be triggered by pointer cursor moving





Inherited methods:
$pointerMoved(x, y)    $select(o)    $setConstraints(c)    add(constr, d)    byConstraints([p], c)    byPath(path, [cb])    calcMaxItemSize( )    calcPreferredSize(target)    doLayout( )    drawView(g, id, x, y, w, h)    drawViewAt(g, id, index)    findSelectable(off, d)    fire(event, [path], [params])    fireSelected(prev)    focused( )    getBottom( )    getCanvas( )    getComponentAt(x, y)    getHorPadding( )    getItemIdxAt(x, y)    getItemLocation(i)    getItemSize(i)    getLeft( )    getLines( )    getLineSize(l)    getMaxOffset( )    getPreferredSize( )    getRight( )    getSelected( )    getTop( )    getValue( )    getVerPadding( )    hasFocus( )    indexOf(c)    insert(i, constr, d)    invalidate( )    invalidateLayout( )    isItemSelectable(i)    isSelected(i)    keyTyped(e)    kidAdded(index, constr, l)    kidRemoved(i, l)    laidout( )    load(JSON)    lookupItem(ch)    off([eventName], [path], [cb])    on([eventName], [path], cb)    pageSize(d)    paintComponent(g)    paintViewAt(g, ax, ay, v)    properties([path], props)    property([path], name, value)    recalc( )    relocated(px, py)    remove(c)    removeAll( )    removeAt(i)    removeByConstraints(ctr)    removeMe([after])    repaint([x], [y], [w], [h])    repaintByOffsets(p, n)    requestFocus( )    requestFocusIn([timeout])    resized(pw, ph)    select(index)    setAt(i, d)    setBackground(v)    setBorder([v])    setBottomPadding(bottom)    setBounds(x, y, w, h)    setByConstraints(constr, c)    setConstraints(ctr)    setEnabled(b)    setId(id)    setKids(a)    setLayout(m)    setLeftPadding(left)    setLocation(xx, yy)    setModel(m)    setPadding(v)    setParent(o)    setPosition(c)    setPreferredSize(w, h)    setProperties([path], props)    setRightPadding(right)    setSize(w, h)    setTopPadding(top)    setValue(v)    setViewProvider(v)    setViews(views)    setVisible(b)    toBack( )    toFront( )    toPreferredHeight( )    toPreferredSize( )    toPreferredWidth( )    toView(target)    validate( )    validateMetric( )    vrp( )   


public chainable setItemGap (g)

Set the left, right, top and bottom a list item paddings


Parameters:
  • g <Integer>

    a left, right, top and bottom a list item paddings



Inherited attributes:
public zebkit.draw.View bg    public zebkit.draw.View border    public Boolean canHaveFocus    public Object constraints    public Integer height    public Boolean isComboMode    public Boolean isEnabled    public Boolean isValid    public Boolean isVisible    public Array kids    public zebkit.layout.Layout layout    public model    public zebkit.layout.Layoutable parent    public zebkit.util.Position position    protected zebkit.ui.ScrollManager scrollManager    public Integer selectedIndex    public Integer width    public Integer x    public Integer y   



private <Integer> firstVisible

Index of the first visible list item

private <Integer> firstVisibleY

Y coordinate of the first visible list item

public <Integer> gap

Extra list item side gaps

private <Boolean> visValid

Internal flag to track list items visibility status. It is set to false to trigger list items metrics and visibility recalculation