A plugin that allows you to enable (eventually lock the device) and disable the screen dim in your React Native app. Works in both iOS and Android.
$ npm install react-native-dimmer --save
In the XCode's "Project navigator", right click on your project's
"Libraries" folder ➜ Add Files to <...>.
Go to node_modules ➜ react-native-dimmer ➜ select the contents
of ios folder. Make sure RNDimmer.m is listed under "Compile Sources"
in your project's "Build Phases" tab.
Add react-native-dimmer to your ./android/settings.gradle file as follows:
include ':react-native-dimmer'
project(':react-native-dimmer').projectDir = new File(settingsDir, '../node_modules/react-native-dimmer/android')
Include it as dependency in ./android/app/build.gradle file:
dependencies {
...
compile project(':react-native-dimmer')
}
Finally, you need to add the package within the ReactInstanceManager of your
MainActivity (./android/app/src/main/java/your/bundle/MainActivity.java):
import social.yadi.rndimmer.ReactNativeDimmerPackage; // <---- import this one
...
@Override
protected List<ReactPackage> getPackages() {
return Arrays.<ReactPackage>asList(
new MainReactPackage(),
new ReactNativeDimmerPackage(this) // <---- add this line
);
}After that, you will need to recompile
your project with react-native run-android.
import React, { Component } from 'react-native';
import RNDimmer from 'react-native-dimmer';
...
class Application extends Component {
...
componentWillMount() {
// Enable dimmer
this.applyDimmer();
}
componentWillUnmount() {
// Disable dimmer
this.applyDimmer( false );
}
async applyDimmer( disabled = true ) {
try {
await RNDimmer.set( disabled );
console.log( disabled ? 'Enabled' : 'Disabled' );
} catch ( e ) {
console.error( e );
}
}
...
}