Merge pull request #96 from foxmicha/master

add captureScreen

Author: gre

README.md

@@ -110,6 +110,27 @@ This method release a previously captured `uri`. For tmpfile it will clean them
 
 NB: the tmpfile captures are automatically cleaned out after the app closes, so you might not have to worry about this unless advanced usecases. The `ViewShot` component will use it each time you capture more than once (useful for continuous capture to not leak files).
 
+## `captureScreen()` Android and iOS Only
+
+```js
+import { captureScreen } from "react-native-view-shot";
+
+captureScreen({
+  format: "jpg",
+  quality: 0.8
+})
+.then(
+  uri => console.log("Image saved to", uri),
+  error => console.error("Oops, snapshot failed", error)
+);
+```
+
+This method will capture the contents of the currently displayed screen as a native hardware screenshot. It does not require a ref input, as it does not work at the view level. This means that ScrollViews will not be captured in their entirety - only the portions currently visible to the user. 
+
+Returns a Promise of the image URI.
+
+- **`options`**: the same options as in `captureRef` method.
+
 ### Advanced Examples
 
 [Checkout react-native-view-shot-example](example)

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

@@ -85,13 +85,18 @@ public void captureRef(int tag, ReadableMap options, Promise promise) {
               file = createTempFile(getReactApplicationContext(), format);
             }
             UIManagerModule uiManager = this.reactContext.getNativeModule(UIManagerModule.class);
-            uiManager.addUIBlock(new ViewShot(tag, format, compressFormat, quality, width, height, file, result, snapshotContentContainer,reactContext, promise));
+            uiManager.addUIBlock(new ViewShot(tag, format, compressFormat, quality, width, height, file, result, snapshotContentContainer,reactContext, getCurrentActivity(), promise));
         }
         catch (Exception e) {
             promise.reject(ViewShot.ERROR_UNABLE_TO_SNAPSHOT, "Failed to snapshot view tag "+tag);
         }
     }
 
+    @ReactMethod
+    public void captureScreen(ReadableMap options, Promise promise) {
+        captureRef(-1, options, promise);
+    }
+
     private static final String TEMP_FILE_PREFIX = "ReactNative-snapshot-image";
 
     /**

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

@@ -44,6 +44,7 @@ public class ViewShot implements UIBlock {
     private Promise promise;
     private Boolean snapshotContentContainer;
     private  ReactApplicationContext reactContext;
+    private Activity currentActivity;
 
     public ViewShot(
             int tag,
@@ -56,6 +57,7 @@ public ViewShot(
             String result,
             Boolean snapshotContentContainer,
             ReactApplicationContext reactContext,
+            Activity currentActivity,
             Promise promise) {
         this.tag = tag;
         this.extension = extension;
@@ -67,13 +69,21 @@ public ViewShot(
         this.result = result;
         this.snapshotContentContainer = snapshotContentContainer;
         this.reactContext = reactContext;
+        this.currentActivity = currentActivity;
         this.promise = promise;
     }
 
     @Override
     public void execute(NativeViewHierarchyManager nativeViewHierarchyManager) {
         OutputStream os = null;
-        View view = nativeViewHierarchyManager.resolveView(tag);
+        View view = null;
+
+        if (tag == -1) {
+            view = currentActivity.getWindow().getDecorView().findViewById(android.R.id.content);
+        } else {
+            view = nativeViewHierarchyManager.resolveView(tag);
+        }
+
         if (view == null) {
             promise.reject(ERROR_UNABLE_TO_SNAPSHOT, "No view found with reactTag: "+tag);
             return;

example/App.js

@@ -13,7 +13,7 @@ import {
 } from "react-native";
 import SvgUri from "react-native-svg-uri";
 import omit from "lodash/omit";
-import { captureRef } from "react-native-view-shot";
+import { captureRef, captureScreen } from "react-native-view-shot";
 import { Surface } from "gl-react-native";
 import GL from "gl-react";
 import MapView from "react-native-maps";
@@ -53,9 +53,9 @@ export default class App extends Component {
       snapshotContentContainer: false
     }
   };
-
+  
   snapshot = refname => () =>
-    captureRef(this.refs[refname], this.state.value)
+    (refname ? captureRef(this.refs[refname], this.state.value) : captureScreen(this.state.value))
       .then(
         res =>
           this.state.value.result !== "tmpfile"
@@ -149,6 +149,7 @@ export default class App extends Component {
             <Btn label="📷 MapView" onPress={this.snapshot("mapview")} />
             <Btn label="📷 WebView" onPress={this.snapshot("webview")} />
             <Btn label="📷 Video" onPress={this.snapshot("video")} />
+            <Btn label="📷 Native Screenshot" onPress={this.snapshot()}/>
             <Btn
               label="📷 Empty View (should crash)"
               onPress={this.snapshot("empty")}

ios/RNViewShot.m

@@ -19,6 +19,12 @@ - (dispatch_queue_t)methodQueue
   return RCTGetUIManagerQueue();
 }
 
+RCT_EXPORT_METHOD(captureScreen: (NSDictionary *)options
+                  resolve:(RCTPromiseResolveBlock)resolve
+                  reject:(RCTPromiseRejectBlock)reject) 
+{
+  [self captureRef: [NSNumber numberWithInt:-1] withOptions:options resolve:resolve reject:reject];
+}
 
 RCT_EXPORT_METHOD(releaseCapture:(nonnull NSString *)uri)
 {
@@ -41,7 +47,14 @@ - (dispatch_queue_t)methodQueue
 
     // Get view
     UIView *view;
-    view = viewRegistry[target];
+
+    if ([target intValue] == -1) {
+      UIWindow *window = [[UIApplication sharedApplication] keyWindow];
+      view = window.rootViewController.view;
+    } else {
+      view = viewRegistry[target];
+    }
+
     if (!view) {
       reject(RCTErrorUnspecified, [NSString stringWithFormat:@"No view found with reactTag: %@", target], nil);
       return;
@@ -88,7 +101,9 @@ - (dispatch_queue_t)methodQueue
       scrollView.contentOffset = CGPointZero;
       scrollView.frame = CGRectMake(0, 0, scrollView.contentSize.width, scrollView.contentSize.height);
     }
+
     UIGraphicsBeginImageContextWithOptions(size, NO, 0);
+    
     success = [rendered drawViewHierarchyInRect:(CGRect){CGPointZero, size} afterScreenUpdates:YES];
     UIImage *image = UIGraphicsGetImageFromCurrentImageContext();
     UIGraphicsEndImageContext();

src/index.js

@@ -114,6 +114,19 @@ export function releaseCapture(uri: string): void {
   }
 }
 
+export function captureScreen(
+  optionsObject?: Options
+): Promise<string> {
+  const { options, errors } = validateOptions(optionsObject);
+  if (__DEV__ && errors.length > 0) {
+    console.warn(
+      "react-native-view-shot: bad options:\n" +
+        errors.map(e => `- ${e}`).join("\n")
+    );
+  }
+  return RNViewShot.captureScreen(options);
+}
+
 type Props = {
   options?: Object,
   captureMode?: "mount" | "continuous" | "update",