컨텐츠로 건너뛰기

시작하기

터미널 창
bun add @capgo/capacitor-navigation-bar
bunx cap sync
import { NavigationBar } from '@capgo/capacitor-navigation-bar';

네비게이션 바 색상과 버튼 테마 설정

import { NavigationBar } from '@capgo/capacitor-navigation-bar';
// Set to white with dark buttons
await NavigationBar.setNavigationBarColor({
color: NavigationBarColor.WHITE,
darkButtons: true
});
// Set to custom color
await NavigationBar.setNavigationBarColor({
color: '#FF5733',
darkButtons: false
});
// Set a custom divider color on Android 9+
await NavigationBar.setNavigationBarColor({
color: NavigationBarColor.WHITE,
darkButtons: true,
dividerColor: '#D9D9D9'
});

현재 네비게이션 바 색상과 버튼 테마 가져오기

import { NavigationBar } from '@capgo/capacitor-navigation-bar';
const { color, darkButtons } = await NavigationBar.getNavigationBarColor();
console.log('Current color:', color);
console.log('Using dark buttons:', darkButtons);

사전 정의된 네비게이션 바 색상

export enum NavigationBarColor {
/** White color */
WHITE = '#FFFFFF',
/** Black color */
BLACK = '#000000',
/** Transparent color */
TRANSPARENT = 'transparent',
}

이 페이지는 플러그인의 src/definitions.ts공개 API이 업스트림에서 변경될 때 다시 동기화 하세요.