react-native-navigation-bar-color

React Native Navigation Bar Color Change

React Native Navigation Bar Color Change is a React Native library for change color of navigation/Bottom bar on Android.

Android Only

Table of Contents

• Installation
• Example
• API
• License

Installation

$ npm install react-native-navigation-bar-color --save

Automatic Configuration

$ react-native link react-native-navigation-bar-color

Manual Configuration

Android

1. Open up android/app/src/main/java/[...]/MainApplication.java

• Add import com.thebylito.navigationbarcolor.NavigationBarColorPackage; to the imports at the top of the file
• Add new NavigationBarColorPackage() to the list returned by the getPackages() method

1. Append the following lines to android/settings.gradle:

include ':react-native-navigation-bar-color' project(':react-native-navigation-bar-color').projectDir = new File(rootProject.projectDir, '../node_modules/react-native-navigation-bar-color/android') 3. Insert the following lines inside the dependencies block in `android/app/build.gradle`: compile project(':react-native-navigation-bar-color') ```

Example

Android Implementation

import React, { Component } from 'react';
import { View, Text } from 'react-native';
import changeNavigationBarColor from 'react-native-navigation-bar-color';

export default class Mynewapp extends Component {
  componentDidMount = () => {
    this.example();
  };

  example = () => {
    changeNavigationBarColor('red');
  };

  render() {
    return (
      <View
        style={{
          flex: 1,
          justifyContent: 'center',
          alignItems: 'center',
        }}
      >
        <Text>Hello Word!</Text>
      </View>
    );
  }
}

API

changeNavigationBarColor(color): (Android)

Change color of Navigation/Bottom bar. color can be a HEX color, or name. ex: green, blue, #80b3ff, #ffffff....

• Returns a Promise

  example = async () => {
      try{
          const response = await changeNavigationBarColor('#80b3ff');
          console.log(response)// {success: true}
      }catch(e){
          console.log(e)// {success: false}
      }
    
  };

License

MIT