capacitor-android-navbar-info

Capacitor plugin for Android providing information about the navigation bar, like navigation bar height, gesture navigation mode, and more

Install

npm install @chefslist/capacitor-android-navigation-bar-info
npx cap sync

Usage

Get Navigation Bar Info

import { NavigationBarInfo } from '@chefslist/capacitor-android-navigation-bar-info';

const info = await NavigationBarInfo.getNavigationBarInfo();
console.log('Navigation bar height:', info.heightInDp);
console.log('Device height:', info.deviceHeight);
console.log('Is visible:', info.isNavigationBarVisible);
console.log('Is gesture navigation:', info.isGestureNavigation);

Listen for Navigation Bar Changes

The plugin automatically detects when the navigation bar info changes (e.g., when switching between windowed and fullscreen modes on Android 15+):

import { NavigationBarInfo } from '@chefslist/capacitor-android-navigation-bar-info';

// Add listener for navigation bar changes
await NavigationBarInfo.addListener('navigationBarInfoChanged', (info) => {
  console.log('Navigation bar info changed:', info);
  // Update your UI based on new navigation bar dimensions
});

// Don't forget to remove listeners when component unmounts
await NavigationBarInfo.removeAllListeners();

API

• getNavigationBarInfo()
• addListener('navigationBarInfoChanged', ...)
• removeAllListeners()
• Interfaces

getNavigationBarInfo()

getNavigationBarInfo() => Promise<NavigationBarInfo>

Returns: Promise<NavigationBarInfo>

addListener('navigationBarInfoChanged', ...)

addListener(eventName: 'navigationBarInfoChanged', listenerFunc: (info: NavigationBarInfo) => void) => Promise<PluginListenerHandle>

Listen for navigation bar info changes (e.g., when switching between windowed and fullscreen modes)

Returns: Promise<PluginListenerHandle>

removeAllListeners()

removeAllListeners() => Promise<void>

Remove all listeners for this plugin

Interfaces

NavigationBarInfo

PluginListenerHandle