"Light weight React Native library to toggle the Android Immersive Mode."
npm install react-native-android-immersive-mode
Light weight React Native library to toggle the Android Immersive Mode.
Note: this package is for Android only and will do nothing for IOS. Immersive Full-Screen Mode is first introduced since Android 4.4 (API Level 19).


- Installation
- Usage
- License
$ npm install react-native-android-immersive-mode --save
$ react-native link react-native-android-immersive-mode
#### Android
Edit android/settings.gradle:
``diff`
+ include ':react-native-android-immersive-mode'
+ project(':react-native-android-immersive-mode').projectDir = new File(rootProject.projectDir, '../node_modules/react-native-android-immersive-mode/android')android/app/build.gradle
Edit : (for versions before v2.0.0, use compile instead of implementation for gradle@<=2)
`diff`
dependencies {
implementation fileTree(dir: "libs", include: ["*.jar"])
implementation "com.android.support:appcompat-v7:${rootProject.ext.supportLibVersion}"
implementation "com.facebook.react:react-native:+" // From node_modules
+ implementation project(':react-native-android-immersive-mode')
}android/app/src/main/java/.../MainApplication.java
Edit :
`diff
+ import com.jayli3n.ToggleImmersiveMode.ToggleImmersiveModePackage;
...
@Override
protected List
@SuppressWarnings("UnnecessaryLocalVariable")
List
+ packages.add(new ToggleImmersiveModePackage());
// Packages that cannot be autolinked yet can be added manually here, for example:
// packages.add(new MyReactNativePackage());
return packages;
}
`
javascript
import { immersiveModeOn, immersiveModeOff } from 'react-native-android-immersive-mode';
...
immersiveModeOn(); // Turn on immersive mode
immersiveModeOff(); // Turn off immersive mode
`
##### If immersive mode goes away after the app goes into background, use AppState to listen to when the app returns back to foreground from background, then run immersiveModeOn().
`javascript
import { AppState } from 'react-native';class App extends Component {
componentDidMount() {
AppState.addEventListener('change', this.handleAppStateChange);
}
handleAppStateChange = (nextAppState) => {
if (nextAppState === 'active') {
immersiveModeOn();
}
};
render() {
immersiveModeOn();
return (
);
}
}
``MIT