agorum.spacer

Dieses Widget fügt einen Abstand ein. Je nach Verwendung in einer agorum.hbox oder agorum.vbox ist die Breite oder die Höhe entscheidend. In Kombination mit dem Parameter flexible können Sie den Spacer dazu verwenden, um dahinter folgende Elemente nach rechts oder nach unten zu platzieren (siehe Beispiele).

Folgende Container verwenden das Widget:

Verwendung

let aguila = require('common/aguila');

let widget = aguila.create({
  type: 'agorum.hbox',
  height: 50,
  width: 300,
  items: [
    {
      type: 'agorum.textDisplay',
      text: 'Vor Abstand'
    },
    {
      type: 'agorum.spacer',
      width: 100
    },
    {
      type: 'agorum.textDisplay',
      text: 'Nach Abstand'
    }
  ]
});

widget;

Events

keine

Parameter

width

Definiert die Breite in Pixeln bei Verwendung in horizontal orientierten Elementen, etwa agorum.hbox (Standard: 1).

height

Definiert die Höhe in Pixeln bei Verwendung in vertikal orientierten Elementen, etwa agorum.vbox (Standard: 1).

flexible

Wert	Beschreibung
true	Skaliert den Abstand mit der Größe des Containers (agorum.hbox oder agorum.vbox), um Elemente am rechten oder unteren Rand auszurichten.
false (Standard)	Skaliert den Abstand NICHT mit der Größe des Containers (agorum.hbox oder agorum.vbox).

Funktionen

keine

Beispiele

Den Text links und rechts in einer agorum.hbox ausrichten

let aguila = require('common/aguila');

let widget = aguila.create({
  type: 'agorum.hbox',
  height: 50,
  width: 300,
  items: [
    {
      type: 'agorum.textDisplay',
      text: 'vorne'
    },
    {
      type: 'agorum.spacer',
      flexible: true
    },
    {
      type: 'agorum.textDisplay',
      text: 'hinten'
    }
  ]
});

widget;