Zum Inhalt springen

Wie man ein Menü in Jitterbit App Builder erstellt

Menüs sind die primäre Möglichkeit, Benutzern die Navigation in Ihren Anwendungen zu ermöglichen. Sie können Zugriff auf bestimmte Seiten bieten, indem Sie diese in einem leicht verständlichen und benutzerfreundlichen Format gruppieren und auflisten. Einige werden automatisch eingerichtet, wenn Sie eine Anwendung erstellen. Andere Menüs müssen Sie selbst einrichten. Diese Seite beschreibt den Prozess zum Erstellen und Konfigurieren eines neuen Menüs in App Builder.

Standardmenüs und Startseite

Standardmäßig hat jede neue Anwendung die folgenden Menüs und eine Startseite:

  • Application Menu ist das Menü, das in der Anwendungssymbolleiste sichtbar sein soll.

  • Mobile definiert Menüs, die nur auf Mobilgeräten sichtbar sind.

  • Home ist die Standardseite, die als Startseite der App verwendet wird.

Sie können eigene Menüs erstellen sowie ändern, welche angezeigt werden auf Ihrer App.

Menü erstellen

Um ein Menü zu erstellen, führen Sie diese Schritte aus:

  1. Wählen Sie App Workbench > UI Layer - Menu. Das Panel Menus wird geöffnet.

  2. Das Panel Menus listet die Menüs auf, die derzeit vorhanden sind. Das Panel Menu Diagram zeigt die Struktur des ausgewählten Menüs, einschließlich aller Untermenüs und deren Elemente.

  3. Klicken Sie auf die Schaltfläche + Menu im Panel Menus.

  4. Geben Sie die folgenden Informationen ein:

    create a menu

    1. Name: Ein Name für das neue Menü. Dies ist das einzige erforderliche Feld.

    2. Width: Ein fester Breitenwert für das neue Menü.

    3. Menu Item Themes: Wenn Sie Themes verwenden, wählen Sie hier eines aus, um Stil auf die Menüelemente anzuwenden.

    4. Source Rule: Wählen Sie eine zugrunde liegende Source Rule.

    5. Public: Aktivieren Sie diese Option, um das Menü in einer anderen Anwendung verwenden zu können.

  5. Klicken Sie auf die Schaltfläche Save. Sie können nun mit dem Panel Menu Items interagieren, um Elemente zu Ihrem neu erstellten Menü hinzuzufügen (siehe Menüelemente hinzufügen, um mehr zu erfahren).

Wenn eine neue Anwendung erstellt wird, stellt App Builder automatisch Home als Startseite der App ein und richtet ein Menü namens Application Menu ein, das auf der rechten Seite der oberen Symbolleiste angezeigt wird und auf allen Seiten sichtbar ist. Sie können diese Einstellungen ändern, z. B. indem Sie Ihre eigene Seite oder eigene Menüs auswählen, um diese Rollen auszufüllen, indem Sie diese Schritte ausführen:

  1. Wechseln Sie zu App Workbench.

  2. Klicken Sie auf die Registerkarte App Settings.

  3. Klicken Sie im Panel App Settings auf More > Edge Case.

  4. Wählen Sie die Registerkarte Regions - Controls:

    application menu

    1. Wählen Sie unter Application Menu aus, welches Menü auf der rechten Seite der oberen Symbolleiste sichtbar sein soll. Der Standardwert ist das Menü mit demselben Namen.

    2. Wählen Sie unter Home Page eine Seite aus, die die Startseite sein soll. Der Standardwert ist Home.

    3. Wählen Sie unter Mobile Menu aus, welches Menü Benutzer auf Mobilgeräten sehen. Der Standardwert ist das Menü Mobile.

    4. Wählen Sie unter System Menu ein Menü aus, das auf der linken Seite der oberen Symbolleiste sichtbar sein soll. Standardmäßig gibt es keines.

      Hinweis

      In der Dropdown-Liste gibt es eine vom System erstellte Option namens System Menu. Wenn diese ausgewählt ist, werden Symbole mit einigen nützlichen Einstellungen wie Audit, Benutzerprofil, Sprachen und andere angezeigt. Allerdings sind alle diese Einstellungen auch im Hamburger-Menü rechts neben der oberen Symbolleiste verfügbar.

Menüelemente hinzufügen

Um Elemente zu einem Menü hinzuzufügen, suchen Sie es auf, indem Sie auf App Workbench > UI Layer - Menu zugreifen und es im Panel Menus finden.

Sobald Sie das Menü gefunden haben, dem Sie Elemente hinzufügen möchten, können Sie auf das Symbol klicken oder doppelklicken Sie entweder auf seine Zeile oder seinen Namen im Panel Menu Diagram, um eine Aufschlüsselung seiner Elemente zu sehen.

Das Panel Menu Items zeigt alle vorhandenen Elemente in diesem Menü. Um ein neues Element hinzuzufügen, klicken Sie auf die Schaltfläche + Menu Item und das Dialogfeld Menu Item wird geöffnet, das die folgenden Registerkarten enthält:

  • Einstellungen: In diesem Tab sind die folgenden Felder verfügbar:

    • Menüsteuerelementtypen: Wählen Sie Menüelement, wenn Sie eine Option zu einem Menü hinzufügen, oder Verschachteltes Menü, wenn Sie ein neues Untermenü erstellen.

    • Übergeordnetes Menü: Wählen Sie das übergeordnete Menü des Elements aus, das Sie erstellen.

    • Position: Geben Sie eine Nummer ein, um die Anzeigereihenfolge dieses Elements zu definieren.

    • Name: Geben Sie den Namen des neuen Elements ein.

    • Link zur Seite: Nutzen Sie das Dropdown-Menü, um auszuwählen, mit welcher Seite Ihrer Anwendung dieses Element verlinkt werden soll.

  • Linkoptionen: Die in diesem Tab verfügbaren Felder hängen davon ab, ob im Feld Link zur Seite des Tabs Einstellungen eine Seite ausgewählt ist:

    • Wenn eine Seite ausgewählt ist, werden in diesem Tab die folgenden Felder angezeigt:

      • Initialzustand der verknüpften Seite: Wählen Sie den Initialzustand aus, in dem die verknüpfte Seite geladen wird: Standard, Hinzufügen oder Bearbeiten.

      • Linkziel: Wählen Sie, wo die verknüpfte Seite geöffnet wird – im aktuellen Fenster, in einem neuen Tab usw.

      • Seite im Verlauf ersetzen: Bestimmen Sie, wohin die Schaltfläche < Zurück nach dem Laden der verknüpften Seite zurückführt. Weitere Informationen finden Sie unter Konfigurieren, wie verknüpfte Seiten geöffnet werden.

    • Wenn im Feld Link zur Seite keine Seiten ausgewählt sind, wird in diesem Tab das folgende Feld angezeigt:

      • Externer Link: Geben Sie einen Link zu einer anderen Seite auf dem App Builder-Server oder zu einer externen Webressource ein. Die eingegebene URL muss mit https:// oder http:// beginnen. Nach der Eingabe eines Werts wird auch das Feld Linkziel angezeigt.

    Wenn sich das Linkziel eines Menüelements zu einem ändert, das Seite im Verlauf ersetzen nicht unterstützt (z. B. wenn von Link zur Seite zu einem externen Link gewechselt wird, der nicht im aktuellen Browser-Tab geöffnet wird), deaktiviert App Builder automatisch Seite im Verlauf ersetzen, statt es mit keiner Auswirkung aktiviert zu lassen.

  • Anzeigeoptionen: In diesem Tab sind die folgenden Felder verfügbar:

    • Beschriftung: Definieren Sie eine Beschriftung, die im Menü angezeigt wird.

    • Tooltip-Beschriftung: Definieren Sie den Tooltip-Text, der angezeigt wird, wenn ein Benutzer den Mauszeiger über das Element bewegt.

    • Bild: Nutzen Sie das Dropdown-Menü, um ein Bild zu suchen und auszuwählen, das mit dem Element verknüpft werden soll.

    • Symbol: Nutzen Sie das Dropdown-Menü, um ein Symbol zu suchen und auszuwählen, das mit dem Element verknüpft werden soll. Unter Symbollkategorien finden Sie die verfügbaren Symbolsätze.

    • Beschriftungssichtbarkeit: Wählen Sie aus, ob die Beschriftung in der Anwendung Sichtbar oder Verborgen sein soll.

    • Design: Wenn Sie Designs verwenden, wählen Sie hier eines aus, um das Element zu gestalten.

    • Aktiv: Dieses Kontrollkästchen bestimmt, ob das Element im Menü angezeigt wird (standardmäßig aktiviert).

Klicken Sie auf Speichern, um Ihre Einstellungen zu bestätigen und das neue Element zu speichern.

Menü zu einem Formularfeld hinzufügen

Alle erstellten Menüs können direkt in einem Formular-Panel angezeigt werden, statt sie nur einem Menü-Rollenset aus den App-Einstellungen zuzuweisen. Hierzu fügen Sie ein Steuerelement vom Typ Inline-Menü zum Panel hinzu. Weitere Informationen zur Konfiguration des Steuerelements finden Sie unter Inline-Menü.