Merge pull request #231 from catnuxer/rn.0.60.3

fixed Testable RN 0.60.3

Author: gre

android/build.gradle

@@ -11,20 +11,20 @@ buildscript {
             jcenter()
         }
         dependencies {
-            classpath 'com.android.tools.build:gradle:2.3.0'
+            classpath 'com.android.tools.build:gradle:3.4.1'
         }
     }
 }
 
 apply plugin: 'com.android.library'
 
 android {
-    compileSdkVersion safeExtGet('compileSdkVersion', 27)
+    compileSdkVersion safeExtGet('compileSdkVersion', 28)
     buildToolsVersion safeExtGet('buildToolsVersion', '28.0.3')
 
     defaultConfig {
         minSdkVersion safeExtGet('minSdkVersion', 16)
-        targetSdkVersion safeExtGet('targetSdkVersion', 27)
+        targetSdkVersion safeExtGet('targetSdkVersion', 28)
 
         versionCode 1
         versionName "1.0"

android/src/main/java/fr/greweb/reactnativeviewshot/DebugViews.java

@@ -5,8 +5,8 @@
 import android.content.res.Resources;
 import android.graphics.Matrix;
 import android.os.Build;
-import android.support.annotation.NonNull;
-import android.support.v4.util.Pair;
+import androidx.annotation.NonNull;
+import androidx.core.util.Pair;
 import android.util.Log;
 import android.view.View;
 import android.view.ViewGroup;

android/src/main/java/fr/greweb/reactnativeviewshot/RNViewShotModule.java

@@ -5,7 +5,7 @@
 import android.content.Context;
 import android.net.Uri;
 import android.os.AsyncTask;
-import android.support.annotation.NonNull;
+import androidx.annotation.NonNull;
 import android.util.DisplayMetrics;
 import android.util.Log;
 

android/src/main/java/fr/greweb/reactnativeviewshot/ViewShot.java

@@ -8,9 +8,9 @@
 import android.graphics.Paint;
 import android.graphics.Point;
 import android.net.Uri;
-import android.support.annotation.IntDef;
-import android.support.annotation.NonNull;
-import android.support.annotation.StringDef;
+import androidx.annotation.IntDef;
+import androidx.annotation.NonNull;
+import androidx.annotation.StringDef;
 import android.util.Base64;
 import android.util.Log;
 import android.view.TextureView;

example/Viewshoot.js

@@ -0,0 +1,112 @@
+/**
+ * Sample How To Screenshot Screen inside of ScrollView
+ * The original github from 
+ * https://github.com/gre/react-native-view-shot
+ */
+import React, {Component} from 'react';
+import {ScrollView, StyleSheet, Text, View, Button, Image, } from 'react-native';
+
+import ViewShot from "react-native-view-shot";
+
+export default class App extends Component {
+    constructor(props) {
+        super(props)
+        this.state={
+            error: null,
+            res: null,
+            options: {
+                format: "jpg",
+                quality: 0.9
+            }
+        }
+    }
+
+    renderContent()
+	{
+		const data = [1,2,3,4,5,6,7,8,9,10,11,12,13,14,15,16,17,18,19,20,21,22,23];
+		return data.map((item,index) => {
+			return (
+				<View style={styles.item} key={index}>
+					<Text>{item}</Text>
+				</View>
+			);
+		})
+	}
+
+    renderResultSnapshot()
+    {
+        if(this.state.res!==null)
+        {
+        console.log('Result on return snapshot: ', this.state.res);
+        return(
+            <Image
+                fadeDuration={0}
+                resizeMode="contain"
+                style={styles.previewImage}
+                source={this.state.res}
+            />
+        );
+        }
+
+        return;
+    }
+
+    
+
+    renderShootButton(){
+        return(
+            <Button
+                onPress={ async () => await this.captureViewShoot()}
+                title="Shoot Me"
+                color="#841584"
+            />
+        )
+    }
+    
+    captureViewShoot()
+    {
+        this.refs.full.capture().then(uri => {
+            console.log("do something with ", uri);
+            this.setState({res: {uri: uri}})
+        });
+    }
+
+    renderViewShot()
+    {
+        return(
+            <ScrollView style={styles.container}>
+                <ViewShot 
+                    ref="full" 
+                    options={{ format: this.state.options.format, quality: this.state.options.quality }} 
+                    style={styles.container}
+                >
+                    {this.renderResultSnapshot()}
+                    {this.renderContent()}
+                    {this.renderShootButton()}
+                </ViewShot>
+            </ScrollView>
+        )
+    }
+
+    render() {
+        return this.renderViewShot();
+    }
+}
+
+const styles = StyleSheet.create({
+    container: {
+        flex: 1,
+        backgroundColor: '#fff'
+    },
+    content: {
+        padding: 10,
+        backgroundColor: '#fff'
+    },
+    item: {
+        height: 50,
+    },
+    previewImage: {
+        width: 375,
+        height: 300
+    },
+});

src/index.js

@@ -171,6 +171,10 @@ function checkCompatibleProps(props: Props) {
 export default class ViewShot extends Component<Props> {
   static captureRef = captureRef;
   static releaseCapture = releaseCapture;
+  constructor(props) {
+    super(props)
+    this.state={}
+  }
   root: ?View;
 
   _raf: *;
@@ -249,10 +253,13 @@ export default class ViewShot extends Component<Props> {
     }
   }
 
-  componentWillReceiveProps(nextProps: Props) {
-    if (nextProps.captureMode !== this.props.captureMode) {
-      this.syncCaptureLoop(nextProps.captureMode);
+  static getDerivedStateFromProps(props, state) {
+    if(props.captureMode !== undefined) {
+      if (nextProps.captureMode !== this.props.captureMode) {
+        this.syncCaptureLoop(nextProps.captureMode);
+      }
     }
+    return null;
   }
 
   componentDidUpdate() {