This plugin provides access to the screenLayout configuration on Android devices.
$ npm install react-native-screen-layout --save
$ react-native link react-native-screen-layout
-
Append the following lines to
android/settings.gradle
:include ':react-native-screen-layout' project(':react-native-screen-layout').projectDir = new File(rootProject.projectDir, '../node_modules/react-native-screen-layout/android')
-
Insert the following lines inside the dependencies block in
android/app/build.gradle
:compile project(':react-native-screen-layout')
-
Import Package
For React Native >= v0.29
Update the
MainApplication.java
file to use the Plugin via the following changes:... // 1. Import the plugin class. import com.artirigo.screenlayout.RNScreenLayoutPackage; public class MainApplication extends Application implements ReactApplication { private final ReactNativeHost mReactNativeHost = new ReactNativeHost(this) { ... @Override protected List<ReactPackage> getPackages() { // 2. Instantiate an instance of the Plugin runtime and add it to the list of // existing packages. return Arrays.<ReactPackage>asList( new MainReactPackage(), new RNScreenLayoutPackage() ); } }; }
For React Native v0.19 - v0.28
Update the
MainActivity.java
file to use the Plugin via the following changes:... // 1. Import the plugin class (if you used RNPM to install the plugin, this // should already be done for you automatically so you can skip this step). import com.artirigo.screenlayout.RNScreenLayoutPackage; public class MainActivity extends ReactActivity { @Override protected List<ReactPackage> getPackages() { // 2. Instantiate an instance of the Plugin runtime and add it to the list of // existing packages. return Arrays.<ReactPackage>asList( new MainReactPackage(), new RNScreenLayoutPackage() ); } ... }
import ScreenLayout from 'react-native-screen-layout';
if(ScreenLayout.SCREEN_LAYOUT === ScreenLayout.LARGE) {
console.log('this is a large screen');
}