Przeglądaj źródła

Update the example App to include the Native Screenshot button for testing the captureScreen functionality. Update the index.js as a final code refactor for the captureScreen name,

foxmicha 6 lat temu
rodzic
commit
5ed8cf90e6
2 zmienionych plików z 40 dodań i 2 usunięć
  1. 39
    1
      example/App.js
  2. 1
    1
      src/index.js

+ 39
- 1
example/App.js Wyświetl plik

@@ -12,7 +12,7 @@ import {
12 12
   WebView
13 13
 } from "react-native";
14 14
 import omit from "lodash/omit";
15
-import { captureRef } from "react-native-view-shot";
15
+import { captureRef, captureScreen } from "react-native-view-shot";
16 16
 import { Surface } from "gl-react-native";
17 17
 import GL from "gl-react";
18 18
 import MapView from "react-native-maps";
@@ -53,6 +53,43 @@ export default class App extends Component {
53 53
     }
54 54
   };
55 55
 
56
+  captureScreenshot = () =>
57
+    captureScreen(this.state.value)
58
+      .then(
59
+        res =>
60
+          this.state.value.result !== "tmpfile"
61
+          ? res
62
+          : new Promise((success, failure) =>
63
+          // just a test to ensure res can be used in Image.getSize
64
+          Image.getSize(
65
+            res,
66
+            (width, height) => (
67
+              console.log(res, width, height), success(res)
68
+            ),
69
+            failure
70
+          )
71
+        )
72
+      )
73
+      .then(res =>
74
+        this.setState({
75
+          error: null,
76
+          res,
77
+          previewSource: {
78
+            uri:
79
+              this.state.value.result === "base64"
80
+                ? "data:image/" + this.state.value.format + ";base64," + res
81
+                : res
82
+          }
83
+        })
84
+      )
85
+      .catch(
86
+        error => (
87
+          console.warn(error),
88
+          this.setState({ error, res: null, previewSource: null })
89
+        )
90
+      );
91
+    
92
+
56 93
   snapshot = refname => () =>
57 94
     captureRef(this.refs[refname], this.state.value)
58 95
       .then(
@@ -147,6 +184,7 @@ export default class App extends Component {
147 184
             <Btn label="📷 MapView" onPress={this.snapshot("mapview")} />
148 185
             <Btn label="📷 WebView" onPress={this.snapshot("webview")} />
149 186
             <Btn label="📷 Video" onPress={this.snapshot("video")} />
187
+            <Btn label="📷 Native Screenshot" onPress={this.captureScreenshot}/>
150 188
             <Btn
151 189
               label="📷 Empty View (should crash)"
152 190
               onPress={this.snapshot("empty")}

+ 1
- 1
src/index.js Wyświetl plik

@@ -124,7 +124,7 @@ export function captureScreen(
124 124
         errors.map(e => `- ${e}`).join("\n")
125 125
     );
126 126
   }
127
-  return RNViewShot.captureScreenshot(options);
127
+  return RNViewShot.captureScreen(options);
128 128
 }
129 129
 
130 130
 type Props = {