Vaadin Menü Design - welche Komponente an der Spitze?

Question

Ich mache ein Eclipse-Arbeitsbereich-ähnliches Menü. Grundsätzlich wird die Seite in 3 Abschnitte (Spalten) aufgeteilt - sagen LHS, MDDL & RHS Abschnitte. Alle diese drei Abschnitte können in der Größe geändert werden, kann minimiert/maximiert werden. Jeder dieser 3 Abschnitte hat eigene Komponenten, , je nachdem, auf welchem ​​Menüpunkt der Benutzer ist.

Eine andere Sache, die sie haben, ist, dass Ereignisse zu/von zwischen Komponenten in 2 verschiedenen dieser 3 Abschnitte ausgelöst/weitergegeben werden. Bsp .: Wenn der Benutzer einen Eintrag im Akkordeon (oder in der Baumstruktur oder den Registerkarten) im LHS-Abschnitt anklickt, wird en Ereignis im MDDL-Abschnitt auftreten.

Vaadin verwaltet die UI-Komponenten hierarchisch - eine Komponente im Stammverzeichnis, und jede Nicht-Root-Komponente ist in einer anderen Komponente selbst oder mit mehreren anderen "Geschwister" -Komponenten enthalten. Aus dieser Ansicht

Von dem, was ich bisher bekommen habe, hier sind die Wege i LHS entwerfen kann, MDDL & RHS:

1.) ein Layout (VerticalLayout oder HorizontalLayout, oder vielleicht ein FormLayout (?)) oder ein Panel an der Wurzel, mit 3 Komponenten, in der es für 3 Abschnitte (was auch immer diese 3 Komponenten sein könnten)

2.) a HorizontalSplitPanel an der Wurzel. Auf der rechten Seite dieser HorizontalSplitPanel, ein weiterer HorizontalSplitPanel, um die 3 Abschnitte zu bilden, die ich suche.

3.) Ein GridLayout von 3 Säulen mit einem Platten in jeweils auf die 3 Abschnitte

4.) 3 verschiedene Window -s zu bilden.

Welche dieser Optionen wäre die beste für meine Verwendung?

Auch - unter Berücksichtigung der zwischen den Abschnitten (Event-Listener und entsprechende Aktionen über Abschnitte hinweg), welches Design sollte ich gehen? Ich suche den Code entkoppelt zu machen. Die drei Abschnitte haben jeweils eigene Stile (LHS: Optionen, MDDL: Dateneinträge, RHS: Kontrolle). In einer anderen Zeile - was genau sind die Unterschiede zwischen einem Panel und einem Layout? Abbildung 6.1 von Vaadin book impliziert, dass die Nachkommen von Layout ausgefeilter sind - auf welche Weise?

Ich bin ein Backend-Entwickler - neu in FE-Sachen. Entschuldigen Sie, wenn dies ein naives Q ist.

TIA.

Answer 1

Ein Panel ist ein einzelner Komponentencontainer, Layouts haben normalerweise mehr als eine untergeordnete Komponente. Der Unterschied ist, was Sie sehen können: Das Panel bietet eine Beschriftung und einen Rahmen für die innere Komponente, Layouts wie Layout-Komponenten in einer definierten Weise, z. horizontal nebeneinander.

Ihre Option 2 scheint mir vernünftig. Nur die split panels bieten ein Trennzeichen, das aus der Box gezogen werden kann.

In Bezug auf die Ereignisbehandlung: Ich empfehle, für jeden Abschnitt eine Klasse zu erstellen, abgeleitet von CustomComponent. Implementiere dann neue Events/Listener analog zu Vaadins in diesen Klassen. Nachdem die drei Abschnitte erstellt wurden, muss jeder Abschnitt den anderen Abschnitten nach Bedarf Listener hinzufügen.