Skip to content

React Native Module for reading Android ScreenLayout Configuration

Notifications You must be signed in to change notification settings

Artirigo/react-native-screen-layout

Folders and files

NameName
Last commit message
Last commit date

Latest commit

 

History

1 Commit
 
 
 
 
 
 
 
 
 
 

Repository files navigation

React Native Module for reading Android ScreenLayout Configuration

This plugin provides access to the screenLayout configuration on Android devices.

Getting started

$ npm install react-native-screen-layout --save

Mostly automatic installation

$ react-native link react-native-screen-layout

Manual installation

Android

  1. 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')
    
  2. Insert the following lines inside the dependencies block in android/app/build.gradle:

      compile project(':react-native-screen-layout')
    
  3. 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()
            );
        }
    
        ...
    }

Usage

import ScreenLayout from 'react-native-screen-layout';

if(ScreenLayout.SCREEN_LAYOUT === ScreenLayout.LARGE) {
    console.log('this is a large screen');
}

About

React Native Module for reading Android ScreenLayout Configuration

Resources

Stars

Watchers

Forks

Releases

No releases published

Packages

No packages published