Skip to end of metadata
Go to start of metadata

Being one of the most popular navigation pattern on mobile apps, the drawer navigation smartly introduces deep navigation pattern that is easily understandable by the user, thanks to smart visual cues on the top left corner on the view that brings up the navigation drawer, which also can be shown using the swipe gesture from the far edge of the screen. The drawer navigation pattern allows developers to introduce multiple menus in their app, with minimal learning curves for the users of the app. Crosslight realizes this and incorporates this pattern naturally and supports both left and right drawers. This page discusses the drawer navigation pattern in detail. See Implementing Drawer Navigation to learn more about incorporating drawer navigation in Crosslight apps.

On this page:

Left Navigation Drawer

To reflect the modern mobile apps design, usually navigation drawers are placed on the left side of the screen, with a list of menus presented, either available as a single, flat list, or as a grouped menu. Therefore, in order to make the users of the app aware that the navigation drawer exists, usually, on the top left side of the screen, you will see a button with triple stacked horizontal lines, which indicates a navigation drawer is available. Also, the drawer can be shown by swiping from the left edge of the screen.

Left and Right Navigation Drawer

Similar to the left drawer, instead of having one drawer on the left side of the screen, Crosslight also offers the right drawer to be displayed together with the left drawer so you'll have two access to simultaneous drawers at once. You can fully customize the content for each drawer, which means, you can display the menus on one side of the screen and display a completely custom view on the other.

Currently Crosslight supports drawer navigation on three major mobile platforms, which are available on iOS, Android and Windows Phone platforms. To learn more about the navigation drawer available on each platform, see these pages respectively:

To learn more about incorporating drawer navigation in Crosslight apps, see Implementing Drawer Navigation.

Samples

To see various drawer samples in action, check out this sample: Navigation Drawer Samples.