agorum.border

Das agorum.border-Layout stellt ein zentrales Element (immer vorhanden, center) und bis zu vier optionale Rand-Elemente (north, south, west, east) dar, die Sie einzeln in ihrer Größe verändern und sogar wegklappen können.

Die Randelemente einzeln sind in ihrer Höhe (north / south) und Breite (west / east) statisch. Das System gibt eventuelle Größenänderungen von außen direkt an das center-Element weiter.

Das Beispiel in dieser Dokumentation verdeutlicht die Aufteilung in die fünf Regionen.

Sie verwenden das border-Layout typischerweise an oberster Ebene einer Widget-Struktur, um die Darstellung in den Hauptinhalt (center) und zusätzliche Informationen / Bedienelemente zu gliedern.

Im Gegensatz zu den anderen Layout-Arten deklarieren Sie die Elemente des border-Layouts nicht per items, sondern ausschließlich per docked.

Events

---

keine

Parameter

---

keine items

docked

• center (Pflicht)
• north
• east
• south
• west

Funktionen

---

keine

Beispiel

 

---

 

 

module.exports = {
  type: 'agorum.border',
  width: 600,
  height: 400,
  docked: {
    center: {
      type: 'agorum.textArea',
      text: 'center'
    },
    north: {
      type: 'agorum.textArea',
      text: 'north',
      height: 100
    },
    south: {
      type: 'agorum.textArea',
      text: 'south',
      height: 100
    },
    west: {
      type: 'agorum.textArea',
      text: 'west',
      width: 100
    },
    east: {
      type: 'agorum.textArea',
      text: 'east',
      width: 100
    }
  }
};