---
name: "setNavigationBarColor"
mode: "kit"
versionRequirements:
  - { name: "MiniKit", version: "1.0.0" }
platform:
  - "iOS"
  - "Android"
async: true
---

## setNavigationBarColor

> [VERSION] MiniKit >= 1.0.0

> [PLATFORM] iOS, Android

> ⚡ **Supports Promise** — Returns a Promise when success / fail / complete callbacks are omitted.

### Description

Set the page navigation bar color

### Parameters

| Property | Type | Required | Default | Since | Description |
| --- | --- | --- | --- | --- | --- |
| `frontColor` | `string` | Yes | - | `1.0.0` | Foreground color value, including the colors of buttons, title, and status bar; only #ffffff and #000000 are supported |
| `backgroundColor` | `string` | Yes | - | `1.0.0` | Background color value; valid values are hexadecimal colors |
| `animation` | `NavigationBarColorAnimationInfo` | Yes | - | `1.0.0` | Animation effect |
| `complete` | `() => void` | No | - | - | Completion callback (called on success or failure) |
| `success` | `() => void` | No | - | - | Success callback |
| `fail` | `(params: Object) => void` ↓see below | No | - | - | Failure callback |

#### fail callback parameters

| Property | Type | Description |
| --- | --- | --- |
| `errorMsg` | `string` | Error message |
| `errorCode` | `string \| number` | Error code |
| `innerError` | `Object` | Error extension |

##### fail(params).innerError properties

| Property | Type | Description |
| --- | --- | --- |
| `errorCode` | `string \| number` | Extended error code |
| `errorMsg` | `string` | Extended error information |


### Referenced Types

##### `interface` NavigationBarColorAnimationInfo

| Property | Type | Since | Description |
| --- | --- | --- | --- |
| `duration` | `number` | `1.0.0` | Animation duration in ms |
| `timingFunc` | `string` | `1.0.0` | Animation timing function 'linear'	Constant speed throughout 'easeIn'	Starts slowly 'easeOut'	Ends slowly 'easeInOut'	Starts and ends slowly |


### Examples

```tsx
ty.setNavigationBarColor({
  frontColor: "#000000",
  backgroundColor: "#FFFFFF",
  animation: { duration: 300, timingFunc: "easeInOut" },
  success: data => { console.log(data); },
  fail: error => { console.error(error); },
});
```