Name

tabs — The tabs class takes tabpanes, and provides a tab for each one.

Synopsis

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

Description

The tabs component contains a row of tabs that control the visibility of a stack of tabpanes. When a tabpane is added to a tabs component, a corresponding tab is created for that tabpane. The text which shows up in the tab is derived from the text attribute of the tabpane.

The tabs component will be sized automatically to the largest tabpane, unless an explicit height or width is specified within the tabs tag.

              <canvas width="150" height="100">
              <tabs>
              <tabpane text="one">
              <button>press one</button>
              </tabpane>
              <tabpane text="two">
              <button>press two</button>
              </tabpane>
              </tabs>
              </canvas>
            
Tabs is a component which takes one or more tabpanes and provides a tab for each one to switch between them.

Superclass Chain

node (LzNode) » view (LzView) » basecomponent » basetabs » tabs

Known Subclasses

Details

Properties (7)

barclass
<attribute name="barclass" type="string" value="tabsbar" />
public final var barclass : String;
Class to use for tabs bar. Default is tabsbar.
bordersize
<attribute name="bordersize" type="number" value="1" />
public var bordersize : Number;
Content's border size (see tabscontent). Default is 1.
contentclass
<attribute name="contentclass" type="string" value="tabscontent" />
public final var contentclass : String;
Class to use for tabs content area. Default is tabscontent.
layout
<attribute name="layout" value="class: simplelayout; axis: y; spacing: -2" />
public var layout;
Layout to use between tabsbar and tabscontent. Default is "class: simplelayout; axis: y; spacing: -2".
tabalign
<attribute name="tabalign" type="string" value="left" />
public var tabalign : String;
Align the set of tabs within the dimensions of the "tabs" container ("left", "center", "right"). Defaults to "left".
tabclass
<attribute name="tabclass" type="string" value="tab" />
public final var tabclass : String;
Class to use for tab items in tabsbar. Default is tab.
tabspacing
<attribute name="tabspacing" type="number" value="-15" />
public var tabspacing : Number;
Spacing between the tabs. Defaults to -15 so tabs overlap.

LZX Synopsis

<class name="tabs" extends=" basetabs ">
  <attribute name=" barclass " type="string" value="tabsbar" />
  <attribute name=" bordersize " type="number" value="1" />
  <attribute name=" contentclass " type="string" value="tabscontent" />
  <attribute name=" layout " value="class: simplelayout; axis: y; spacing: -2" />
  <attribute name=" tabalign " type="string" value="left" />
  <attribute name=" tabclass " type="string" value="tab" />
  <attribute name=" tabspacing " type="number" value="-15" />
</class>

JavaScript Synopsis

public tabs extends  basetabs  {
  public final var barclass  : String;
  public var bordersize  : Number;
  public final var contentclass  : String;
  public var layout ;
  public var tabalign  : String;
  public final var tabclass  : String;
  public var tabspacing  : Number;
}