Is it possible to customize the hamburger menu on the top right?

General Q&A
1

Is it possible to customize the hamburger menu on the top right?

2

Yes, you are able to customise the following hamburger menu (top right) components:

  • logo in the menu (.png only)
  • items in the menu
  • value of the notification indicator (see the docs)

Here is a link to the documentation regarding the hamburger menu.

At this time, you need to edit your editor's URL to access this functionality, .e.g. https://build.journeyapps.com/my-awesome-org/my-awesome-org-my-awesome-app/editor/#mobile/app.xml

Here is an example of a customer hamburger menu:

<app>
<!-- Manually control the number displayed on the app's badge, like this: -->
<!-- <notifications indicator="$:appBadgeCount()" /> -->
    <nav>
        <!-- Add custom entries to the hamburger menu -->
        <menu>
            <!-- images/gunnebo_logo.png Declaring type="messages" will override the default Messages entry -->
            <!-- <item type="messages" label="In-tray" icon="ion-filing"  on-press="viewIntray()" indicator="$:intrayNewCount()" /> -->
            <!-- Declaring type="custom" will add a new entry -->
            <!-- <item type="custom" label="Order Coffee" icon="ion-coffee"  on-press="orderCoffee()" /> -->
            <item type="custom" label="Toggle Theme" icon="ion-ios-toggle" on-press="$:toggleTheme()" />
        </menu>
    </nav>
</app>

Some notes:

  • You have to call SharedJS functions, there is no other view logic linked to this view
  • You are unable to change the hamburger menu icon. It will always be the 3 dots.
  • You can't do a global search from within this view.
1 Like