Name

list — contains listitems and provides selection capabilities.

Synopsis

LZX: list
JavaScript: list
Type: Class
Access: public
Topic: Components.Laszlo Components
Declared in: lps/components/lz/list.lzx

Description

The list tag creates a list which may contain listitems. Subclasses of listitem, such as textlistitem, may be used as well. list provides basic layout and a selection API . If there are more items than specified in the shownitems attribute, a scrollbar will be provided.

              <canvas width="200" height="100">
              <list x="10" y="10">
              <textlistitem text="item 1" value="1" selected="true"/>
              <textlistitem text="item 2" value="2"/>
              <textlistitem text="item 3" value="3"/>
              </list>
              </canvas>
            

Optimizing performance with lazy replication and data pooling

When you have more items on your list than appear to the user, or if you are creating a list from data and then changing the data that is represented by the list, you should use "lazy replication" and data pooling, respectively, to optimize performance of your lists. See Performance Tuning for a discussion.

See the list_example.lzx for more list use cases.

A list containing listitems and providing selection capabilities.

Superclass Chain

node (LzNode) » view (LzView) » basecomponent » basevaluecomponent » baseformitem » baselist » list

Known Subclasses

Known Direct Subclasses: basefloatinglist, simpledefaultlist

Details

Properties (12)

autoscrollbar
<attribute name="autoscrollbar" value="true" />
public var autoscrollbar;
If true, a scrollbar will show up automatically when there are more items than shownitems.
border_bottom
<attribute name="border_bottom" value="${this.bordersize}" />
public var border_bottom;
The size of the bottom border which defaults to bordersize.
border_left
<attribute name="border_left" value="${this.bordersize}" />
public var border_left;
The size of the left border which defaults to bordersize.
border_right
<attribute name="border_right" value="${this.bordersize}" />
public var border_right;
The size of the right border which defaults to bordersize.
bordersize
<attribute name="bordersize" value="1" />
public var bordersize;
The size in pixels for this list.
border_top
<attribute name="border_top" value="${this.bordersize}" />
public var border_top;
The size of the top border which defaults to bordersize.
minheight
<attribute name="minheight" type="number" value="24" />
public var minheight : Number;
minumum height of the list, default: 24
scrollable
<attribute name="scrollable" value="false" />
public read-only var scrollable;
scrollbarclassname
<attribute name="scrollbarclassname" type="string" value="vscrollbar" />
public var scrollbarclassname : String;
The name of the class to instantiate as our scrollbar.
shownitems
<attribute name="shownitems" value="-1" />
public var shownitems;
The number of items that are displayed. This value will ignored if this view attempts to draw past the canvas boundary.
spacing
<attribute name="spacing" value="0" />
public var spacing;
The number of pixels that items should be spaced from one another.
tracking
<attribute name="tracking" value="false" />
public var tracking;
Toggles the mousedown tracking.

Methods (3)

addItem()
<method name="addItem" args="txt, val" />
public function addItem(txt : String, val : Object);
Add the specified item to the end of the list.
ensureItemInView()
<method name="ensureItemInView" args="item" />
public function ensureItemInView(item);
If the item is not in view, the list is auto-scrolled so that the specified item appears at the top of the list.
select()
<method name="select" args="v" />
public function select(v : LzView);
Select an item. Scrolls list so that it appears, if not in view.

LZX Synopsis

<class name="list" extends=" baselist ">
  <attribute name=" autoscrollbar " value="true" />
  <attribute name=" border_bottom " value="${this.bordersize}" />
  <attribute name=" border_left " value="${this.bordersize}" />
  <attribute name=" border_right " value="${this.bordersize}" />
  <attribute name=" bordersize " value="1" />
  <attribute name=" border_top " value="${this.bordersize}" />
  <attribute name=" minheight " type="number" value="24" />
  <attribute name=" scrollable " value="false" />
  <attribute name=" scrollbarclassname " type="string" value="vscrollbar" />
  <attribute name=" shownitems " value="-1" />
  <attribute name=" spacing " value="0" />
  <attribute name=" tracking " value="false" />
  <method name=" addItem " args="txt, val" />
  <method name=" ensureItemInView " args="item" />
  <method name=" select " args="v" />
</class>

JavaScript Synopsis

public list extends  baselist  {
  public var autoscrollbar ;
  public var border_bottom ;
  public var border_left ;
  public var border_right ;
  public var bordersize ;
  public var border_top ;
  public var minheight  : Number;
  public read-only var scrollable ;
  public var scrollbarclassname  : String;
  public var shownitems ;
  public var spacing ;
  public var tracking ;
  prototype public function addItem (txt : String, val : Object);
  prototype public function ensureItemInView (item);
  prototype public function select (v : LzView);
}