navigation-bar

KO | EN

gitlite — search

#javascript #python #hacktoberfest #react #ai #typescript #llm #go #golang #android #machine-learning #rust #deep-learning #linux

(★ 84)

Navigation Bar plugin for Capacitor

navigation-bar Latest Version Download

Download Latest Version (.zip)

// repository documentation

Was this content helpful?

★ 0 (0 ratings)

<img src="https://user-images.githubusercontent.com/236501/85893648-1c92e880-b7a8-11ea-926d-95355b8175c7.png" width="128" height="128" />
<h3 align="center">Navigation Bar</h3>
<code>@hugotomazi/capacitor-navigation-bar</code>

 Capacitor plugin for Navigation Bar manipulation.

## Maintainers

| Maintainer  | GitHub                                      | Social                                                          |
| ----------- | ------------------------------------------- | --------------------------------------------------------------- |
| Hugo Tomazi | [hugotomazi](https://github.com/hugotomazi) | [@hugotomazi](https://br.linkedin.com/in/hugo-tomazi-299034101) |

## Install

```bash
npm install @hugotomazi/capacitor-navigation-bar
npx cap sync
```

## Configuration

No configuration required for this plugin.

## API

<docgen-index>

* [`show()`](#show)
* [`hide()`](#hide)
* [`setColor(...)`](#setcolor)
* [`setTransparency(...)`](#settransparency)
* [`getColor()`](#getcolor)
* [`addListener(...)`](#addlistener)
* [`addListener(...)`](#addlistener)
* [`addListener(...)`](#addlistener)
* [Interfaces](#interfaces)
* [Enums](#enums)

</docgen-index>

<docgen-api>

### show()

```typescript
show() => Promise<void>
```

Display the navigation bar.

--------------------

### hide()

```typescript
hide() => Promise<void>
```

Hide the navigation bar.

--------------------

### setColor(...)

```typescript
setColor(options: ColorParameters) => Promise<void>
```

Change the color of the navigation bar.
*Support alpha hexadecimal numbers.

| Param | Type |
| ------------- | ----------------------------------------------------------- |
| **`options`** | <code><a href="#colorparameters">ColorParameters</a></code> |

--------------------

### setTransparency(...)

```typescript
setTransparency(options: { isTransparent: boolean; }) => Promise<void>
```

Set the Transparency

| Param | Type |
| ------------- | ---------------------------------------- |
| **`options`** | <code>{ isTransparent: boolean; }</code> |

--------------------

### getColor()

```typescript
getColor() => Promise<{ color: string; }>
```

Gets the current color of the navigation bar in Hexadecimal.

**Returns:** <code>Promise&lt;{ color: string; }&gt;</code>

--------------------

### addListener(...)

```typescript
addListener(event: NavigationBarPluginEvents.SHOW, listenerFunc: () => void) => Promise<PluginListenerHandle>
```

Event fired after navigation bar is displayed

| Param | Type | Description |
| ------------------ | ------------------------------------------------------------------------------------ | ----------- |
| **`event`** | <code><a href="#navigationbarpluginevents">NavigationBarPluginEvents.SHOW</a></code> | The event |
| **`listenerFunc`** | <code>() =&gt; void</code> | Callback |

**Returns:** <code>Promise&lt;<a href="#pluginlistenerhandle">PluginListenerHandle</a>&gt;</code>

--------------------

### addListener(...)

```typescript
addListener(event: NavigationBarPluginEvents.HIDE, listenerFunc: () => void) => Promise<PluginListenerHandle>
```

Event fired after navigation bar is hidden

| Param | Type | Description |
| ------------------ | ------------------------------------------------------------------------------------ | ----------- |
| **`event`** | <code><a href="#navigationbarpluginevents">NavigationBarPluginEvents.HIDE</a></code> | The event |
| **`listenerFunc`** | <code>() =&gt; void</code> | Callback |

**Returns:** <code>Promise&lt;<a href="#pluginlistenerhandle">PluginListenerHandle</a>&gt;</code>

--------------------

### addListener(...)

```typescript
addListener(event: NavigationBarPluginEvents.COLOR_CHANGE, listenerFunc: (returnObject: { color: string; }) => void) => Promise<PluginListenerHandle>
```

Event fired after navigation bar color is changed

| Param | Type | Description |
| ------------------ | -------------------------------------------------------------------------------------------- | ----------- |
| **`event`** | <code><a href="#navigationbarpluginevents">NavigationBarPluginEvents.COLOR_CHANGE</a></code> | The event |
| **`listenerFunc`** | <code>(returnObject: { color: string; }) =&gt; void</code> | Callback |

**Returns:** <code>Promise&lt;<a href="#pluginlistenerhandle">PluginListenerHandle</a>&gt;</code>

--------------------

### Interfaces

#### ColorParameters

| Prop | Type | Description |
| ----------------- | -------------------- | ------------------------------------------------------------------------- |
| **`color`** | <code>string</code> | Sets the new color of the navigation bar. |
| **`darkButtons`** | <code>boolean</code> | Sets whether the default navigation bar buttons should be black or white. |

#### PluginListenerHandle

| Prop | Type |
| ------------ | ----------------------------------------- |
| **`remove`** | <code>() =&gt; Promise&lt;void&gt;</code> |

### Enums

#### NavigationBarPluginEvents

| Members | Value | Description |
| ------------------ | ---------------------------- | -------------------------------------------- |
| **`SHOW`** | <code>'onShow'</code> | Called after the navigation bar is displayed |
| **`HIDE`** | <code>'onHide'</code> | Called after navigation bar is hidden |
| **`COLOR_CHANGE`** | <code>'onColorChange'</code> | Called after navigation bar color is changed |

</docgen-api>

navigation-bar

navigation-bar Latest Version Download

Today's picks

Was this content helpful?

Recent Feedback

navigation-bar

navigation-bar Latest Version Download

Today's picks

Was this content helpful?

Recent Feedback

Download README