Kontext

In der React-Oberfläche (.view.xml-Schicht) bündelt das Benutzermenü der App-Leiste die Einstellungen des angemeldeten Benutzers. Die Werkzeuge für die Entwicklung in der laufenden Anwendung – Designer, Aufzeichnen (Skript-Rekorder), Untersuchen (UI-Inspektor) und Agentenzugriff – standen dagegen als einzelne Schaltflächen direkt in der App-Leiste.

Außerdem brachte tl-layout-view keine Hauptsicht app.view.xml mit: Eine Anwendung, die nur die Abhängigkeit auf tl-layout-view einträgt, musste das Grundgerüst (App-Leiste mit Benutzermenü, Seitenleiste mit Administration, Systemhinweise) aus einer anderen Anwendung kopieren.

Verhalten

Entwicklungsmenü

Die Entwicklerwerkzeuge sind in einem Menü Entwicklung (Werkzeug-Symbol) der App-Leiste zusammengefasst, das links neben dem Benutzermenü steht. Es zeigt die Einträge in zwei Gruppen:

• Seite: Designer, Untersuchen (UI-Inspektor, Symbol: Fernglas) – wirken auf die aktuell angezeigte Seite bzw. das aktuelle Fenster.
• Automatisierung: Aufzeichnen (Skript-Rekorder), Agentenzugriff.

Jeder Eintrag behält seine Sichtbarkeitsregel (z.B. erscheint der UI-Inspektor nur bei eingeschalteter UI-Inspektion). Hat ein Dropdown-Menü (<menu>) keinen sichtbaren Eintrag, erscheint auch sein Auslöser nicht; ein sichtbarer, aber deaktivierter Eintrag zählt als angeboten.

Standard-Hauptsicht

tl-layout-view liefert eine Standard-Hauptsicht WEB-INF/views/app.view.xml mit: App-Leiste (Titel, Slots für Seitenleisten-Schalter und Seiteninhalte, Entwicklungsmenü, Benutzermenü), Systemhinweise (Wartung, Sitzungsablauf) und Seitenleiste mit Trenner (system-separator) und dem Eintrag Administration. Eine Anwendung erhält damit ohne eigene Datei eine lauffähige Oberfläche und ergänzt ihre Seiten, den Titel usw. über eine gleichnamige Overlay-Datei, statt das Grundgerüst zu kopieren.

Technische Hinweise

• dev-menu.view.xml in tl-layout-view ist wie user-menu.view.xml aufgebaut. Abhängige Module ergänzen Einträge über eine gleichnamige Overlay-Datei; so steuert tl-layout-view-agent den Eintrag Agentenzugriff zur Gruppe automation bei.
• Menügruppen (<groups><group id="...">) haben eine optionale ID als Schlüssel; ein Overlay ergänzt eine bestehende Gruppe mit <group id="automation" config:operation="update"> (auch das Benutzermenü: Gruppe account).
• MenuRegionControl blendet die Auslöserregion eines <menu> aus, solange kein Eintrag sichtbar ist, und folgt den Zustandsänderungen der Befehle. Ein <context-menu> behält seinen Inhalt auch ohne Einträge.
• Die Bereiche von <app-shell> (header, notices, content, footer) sind nach der Elementart geschlüsselt: ein <sidebar> bzw. <app-bar> eines Overlays erweitert das gleichartige Element der Basis, statt ein zweites danebenzustellen.
• Die React-Demo (tl-demo-react) enthält nur noch ein Overlay der Standard-Hauptsicht mit ihren eigenen Seiten, Texten und Kanälen.
• Beschreibung in docs/faq/react-view-layer.md ("The application shell: extending app.view.xml").

Migration

tl-layout-view liefert eine Anwendungs-Shell WEB-INF/views/app.view.xml aus. Gleichnamige Views aller Module werden als Overlays zusammengeführt; eine Anwendung, die eine eigene vollständige app.view.xml mitbringt, würde damit auf die mitgelieferte Shell aufgesetzt (doppelte Hinweise, doppeltes Benutzermenü, doppelter Administrationseintrag). Eine solche Anwendung muss eine der beiden folgenden Anpassungen vornehmen.

Variante 1 (empfohlen): Auf ein Overlay reduzieren. Die eigene app.view.xml enthält nur noch, was die Anwendung hinzufügt; alles, was die mitgelieferte Shell bereits enthält (<notices>, drawer-open-slot-name, die Slots appbar-leading/`appbar-content`, dev-menu.view.xml/`user-menu.view.xml` im <trailing>, Trenner und Administrationseintrag, variant), entfällt:

• Am <view>-Element den Namespace xmlns:config="http://www.top-logic.com/ns/config/6.0" deklarieren.
• Eigene Kanäle bleiben in <channels>.
• Unter <app-shell><content><sidebar>: active-item, die eigenen Einträge sowie bei Bedarf <header>, <header-collapsed>, <footer>, <footer-collapsed> jeweils mit config:override="true" (sonst werden sie zu den neutralen Texten der Shell hinzugefügt).
• Einträge, die vor dem Systembereich stehen sollen, erhalten config:position="before" config:reference="system-separator"; Einträge ohne Position werden nach "Administration" angehängt.
• Unter <app-shell><header><app-bar>: der eigene <title>.

{{{#!xml <view xmlns:config="http://www.top-logic.com/ns/config/6.0"> <app-shell> <content> <sidebar active-item="home"> <header config:override="true"> <text><label><en>My App</en></label></text> </header> <items> <nav-item id="home" config:position="before" config:reference="system-separator"> <view-ref view="home.view.xml"/> <label><en>Home</en></label> </nav-item> </items> </sidebar> </content> <header> <app-bar> <title><en>My App</en></title> </app-bar> </header> </app-shell> </view> }}}

Variante 2: Vollständige eigene Shell behalten. Am <view>-Element xmlns:config="http://www.top-logic.com/ns/config/6.0" deklarieren und die Shell als Ersatz markieren: <app-shell config:override="true">. Die eigene Kopie ersetzt dann die mitgelieferte Shell vollständig; spätere Erweiterungen der mitgelieferten Shell erreichen die Anwendung in diesem Fall nicht.

Zusätzlich gilt: Jeder Bereich von <app-shell> (header, notices, content, footer) darf jede Elementart höchstens einmal enthalten; zwei gleichartige Elemente in einem Bereich (z.B. zwei <text> in <content>) werden beim Laden abgewiesen und müssen in einen Container (z.B. <stack>) gelegt werden.

Die Entwicklerbefehle (<open-designer>, Skript-Rekorder, UI-Inspektor, Agentenzugriff) gehören nicht mehr in die <commands> der eigenen App-Leiste; sie kommen über dev-menu.view.xml.