react-native-screen-navbar

React Native library for changing android Navigation Bar color & visibility.

Use react-native-onscreen-navbar library if you want react components.

Usage

import NavigationBar from 'react-native-screen-navbar'
NavigationBar.setBackgroundColor('#000000', isAnimated)
NavigationBar.setTranslucent(true)

Install

npm install react-native-screen-navbar --save

Linking (automatically)

react-native link react-native-screen-navbar

Linking (manually)

In android/app/build.gradle, add the lines

dependencies {
+   compile project(':react-native-screen-navbar')
    compile fileTree(dir: "libs", include: ["*.jar"])
    compile "com.android.support:appcompat-v7:23.0.1"
    compile "com.facebook.react:react-native:+"  // From node_modules
}

In android/settings.gradle, add the lines

include ':app'
+ include ':react-native-screen-navbar'
+ project(':react-native-screen-navbar').projectDir = new File(rootProject.projectDir, '../node_modules/react-native-screen-navbar/android')

In android/app/src/main/java/com/example/MainApplication.java, add the NavigationBarPackage dependency.

import com.facebook.react.ReactActivity;
import com.facebook.react.ReactPackage;
import com.facebook.react.shell.MainReactPackage;
+ import com.navbar.navigationbar.NavigationBarPackage;

import java.util.Arrays;
import java.util.List;

public class MainApplication extends Application implements ReactApplication {

    ...
    
    /**
     * A list of packages used by the app. If the app uses additional views
     * or modules besides the default ones, add more packages here.
     */
    @Override
    protected List<ReactPackage> getPackages() {
        return Arrays.<ReactPackage>asList(
            new MainReactPackage(),
+           new NavigationBarPackage()
        );
    }
}

License

(c) 2016 Atte Huhtakangas, MIT license.