Navigation Drawer & Bottom Navigation Footer
Ship an app-like navigation experience with the built-in Material navigation drawer and Material 3 bottom navigation bar — no changes to your website required.
WebViewGold ships two built-in native navigation UIs so you can offer an app-like navigation experience without touching your website: a side Navigation Drawer and a Material 3 Bottom Navigation Footer. Both are optional and can be combined or used independently.
1. Side Navigation Drawer
A floating menu button opens a Material navigation drawer with your links. Enable it in Config.java:
static boolean ENABLE_NAVIGATION_DRAWER = true;
Configure the entries and icons in:
app/src/main/res/menu/menu_drawer.xml
Each <item> becomes a drawer row and, when tapped, navigates the WebView to the URL you associate with it.
2. Bottom Navigation Footer
A Material 3 bottom-navigation bar sits at the bottom of the screen and switches between your top-level sections. Enable it in Config.java:
static boolean ENABLE_NAVIGATION_FOOTER = true;
The same file (res/menu/menu_drawer.xml) drives the entries — pick 3–5 top-level destinations.
Behavior:
- Both UIs respect the device's dark/light mode automatically.
- Icons and labels come from your menu XML.
- Tapping an entry loads the associated URL in the main WebView, so your web app never leaves the app shell.
Reference: Material 3 navigation bar guidelines.
SDK-style implementation notes
Treat this feature as a native capability exposed to your web layer: keep your production website or PWA as the source of truth, then use the documented WebViewGold configuration flags, URL commands, and JavaScript bridge calls to opt in to native Android behavior only where it adds value. This approach keeps your codebase maintainable because the same web application can serve browsers, WebViewGold for Android, and the other WebViewGold platforms with minimal conditional logic.
For reliable results, prefer HTTPS endpoints, stable route names, explicit success/error states in your UI, and small JavaScript helper functions that wrap native calls. For example, a web app built with jQuery Mobile, Lovable, Base44, Bolt, WordPress, Bubble, a custom React/Vue/Angular stack, or static HTML can expose a single button or event handler that triggers the native WebViewGold API while still showing a graceful browser fallback.
- Recommended integration pattern: detect the app context, call the WebViewGold API, then update your web UI after the native callback or route change.
- Testing checklist: validate the feature on a real device or packaged build, verify permissions and store review text, and confirm that browser-only users still receive a useful fallback.
- SEO benefit: keep feature pages, route titles, and structured content indexable on your website while WebViewGold delivers the native app shell for Android users.