agorum.tabContainer

Das agorum.tabContainer-Layout stellt jedes seiner Elemente in einer eigenen Registerkarte dar. Das System verwendet das title-Attribut des Elements als Überschrift der Registerkarte.

Hinweis: Das System blendet die Registerkarten für die mit hidden unsichtbar markierten Elemente zwar aus, sie können Sie aber immer noch programmatisch aktivieren. Sorgen Sie dafür, dass jederzeit nur sichtbare Registerkarten aktiv sind.

Events

activeTabChanged (Integer)

Löst aus, wenn das System programmatisch oder ein Benutzer die aktive Registerkarte ändert.

Das System übergibt als Parameter den neuen Wert des Parameters activeTab.

Parameter

activeTab (Integer)

Enthält den Index der aktiven Registerkarte.

Sie können den Index sowohl lesen als auch setzen.

icon (String)

Definiert das zu verwendende Symbol für Menüeinträge und Schaltflächen (siehe Liste von aguila-icons).

Funktionen

keine

Beispiel

Dieses Beispiel stellt die beiden vorangegangen Beispiele in zwei getrennten Tabs dar:

Screenshot zum Beispiel

(
  {
    type: 'agorum.tabContainer',
    width: 400,
    height: 300,
    items: [
      {
        type: 'agorum.vbox',
        title: 'Tab1',
        items: [
          {
            type: 'agorum.textArea',
            text: 'Hallo, Welt!',
            name: 'textArea',
            width: 300,
            flexible: true
          },
          {
            type: 'agorum.hbox',
            items: [
              {
                type: 'agorum.spacer',
                flexible: true
              },
              {
                type: 'agorum.button',
                text: 'Hallo, aguila!',
                name: 'button'
              }
            ]
          }
        ]
      },
      {
        type: 'agorum.vbox',
        title: 'Tab2',
        items: [
          {
            type: 'agorum.textInput',
            value: 'Hallo, Welt!',
            label: 'Eingabe',
            name: 'textinput',
          }
        ]
      }    
    ]
  }
);