/react-native-full-screen

Full screen functionality for Android

Primary LanguageJavaMIT LicenseMIT

React native full screen functionality Android

There is plenty of room for improvment by adding additional react bindings for props and callbacks.

Props: ToggleView
  <ToggleView style={{flex:1,alignItems:'center', justifyContent:'center'}}>
    <Image style={{height:500,width:500}} source={{uri:"http://placehold.it/500"}}></Image>

  </ToggleView>
Property Type Default Description
delay number 3000 how long to delay hide
delayHide boolean true if there should be a delayed hide event

Android Installation

Install the npm package react-native-full-screen. Inside your React Native project, run (example):

npm install --save react-native-full-screen
# RN >= 0.60
No action needed

# RN < 0.60
react-native link react-native-full-screen

Manual installation

In android/settings.gradle, remove the line include ':app' and add the following lines

include ':react-native-full-screen'
project(':react-native-full-screen').projectDir = file('../node_modules/react-native-full-screen/android')

NOTE : If you have included other libraries in your project, the include line will contain the other dependencies too.

In android/app/build.gradle, add a dependency to ':react-native-full-screen'

dependencies {
    compile project(':react-native-full-screen')
}

Next, you need to change the MainActivity of your app to register FullScreenModule :

import com.rn.full.screen.FullScreenModule; // add this import

public class MainActivity extends ReactActivity {
    //...

    @Override
    protected List<ReactPackage> getPackages() {
      return Arrays.<ReactPackage>asList(
          new MainReactPackage(),
          new FullScreenModule() // add this manager
      );
    }

TeamLockr full screen Team Lockr full screen for react native

These are functions created by the TeamLockr Team created for the TeamLockr platform.