Was ist mit der Flex-Eigenschaft eines ExtJS4-Layouts gemeint?

Um zu vermeiden, die Beschreibung der Dokumentation zu verwenden, die Sie ein wenig knifflig fanden:

Flex wird in hbox- und vbox-Layouts als Eigenschaft verwendet und gibt den Speicherplatz an, den diese Komponente im übergeordneten Container belegen soll.

Sie können eine beliebige Zahl größer als Null als Flex-Eigenschaftswert verwenden. Manche Leute verwenden zur Vereinfachung einfach ganze Zahlen, andere, die ich gesehen habe, verwenden Werte wie 0,25, um Prozentsätze einfacher darzustellen.

Ein grundlegendes Beispiel für Flex in Aktion:

Der Schlüssel hier ist zu wissen, dass es nicht der Wert jedes Flex ist, der das Layout definiert, sondern wie diese Werte miteinander in Beziehung stehen. Wenn ich einen weiteren Container mit einem Flex von 10 in dieses Layout einfügen würde, würde das die Hälfte des Layouts einnehmen, da 10 die Hälfte von 10 + 5 + 3 + 2 = 20 ist.

Hoffe das hilft!

Betrachten wir ein Beispiel dafür, wenn es einen übergeordneten Container mit der Breite 100 gibt und drei untergeordnete Elemente mit folgenden Konfigurationen:

Nun wird die Engine dem ersten Element zuerst 70 zuweisen. Und dann teilt es die verbleibende verfügbare Breite im Verhältnis 2: 1 und teilt 20 dem zweiten und dem 10 bis dritten Element zu.

Somit ist flex eine Möglichkeit, die relativen Breiten zwischen untergeordneten Elementen anzugeben. Außerdem kann ein starker Einsatz von Flex ein Problem bei Fluidlayouts verursachen, da Flex im Allgemeinen auf die verbleibende verfügbare Breite wirkt, die sogar 0 sein kann, wenn die gesamte Containerbreite reduziert wird und dies zu einer Überlappung von Feldern führen kann. Beispiel hier.

Es wird in den VBox- und HBox-Layouts verwendet:

  

Diese Konfigurationsoption wird auf untergeordnete Elemente des   Container, der von diesem Layout verwaltet wird. Jedes untergeordnete Element mit einer flex-Eigenschaft   wird entsprechend dem relativen Flex jedes Gegenstands horizontal gebeugt   Wert im Vergleich zur Summe aller Elemente mit einem angegebenen Flex-Wert.   Alle untergeordneten Elemente, für die entweder ein Flex = 0 oder ein Flex = nicht definiert ist, werden verwendet   nicht "gebeugt" werden (die anfängliche Größe wird nicht geändert).

Siehe Ссылка usw.