Browse Source

Add FS example

Gaëtan Renaudeau 5 years ago
parent
commit
8a6ea61c30
No account linked to committer's email address
5 changed files with 67 additions and 0 deletions
  1. 6
    0
      example/ios/Podfile.lock
  2. 1
    0
      example/package.json
  3. 4
    0
      example/src/App.js
  4. 38
    0
      example/src/FS.js
  5. 18
    0
      example/yarn.lock

+ 6
- 0
example/ios/Podfile.lock View File

@@ -96,6 +96,8 @@ PODS:
96 96
     - React-fishhook (= 0.60.4)
97 97
   - ReactNativeART (1.0.1):
98 98
     - React
99
+  - RNFS (2.14.1):
100
+    - React
99 101
   - RNGestureHandler (1.3.0):
100 102
     - React
101 103
   - RNGL (2.42.1):
@@ -135,6 +137,7 @@ DEPENDENCIES:
135 137
   - React-RCTVibration (from `../node_modules/react-native/Libraries/Vibration`)
136 138
   - React-RCTWebSocket (from `../node_modules/react-native/Libraries/WebSocket`)
137 139
   - "ReactNativeART (from `../node_modules/@react-native-community/art`)"
140
+  - RNFS (from `../node_modules/react-native-fs`)
138 141
   - RNGestureHandler (from `../node_modules/react-native-gesture-handler`)
139 142
   - RNGL (from `../node_modules/gl-react-native`)
140 143
   - RNReanimated (from `../node_modules/react-native-reanimated`)
@@ -200,6 +203,8 @@ EXTERNAL SOURCES:
200 203
     :path: "../node_modules/react-native/Libraries/WebSocket"
201 204
   ReactNativeART:
202 205
     :path: "../node_modules/@react-native-community/art"
206
+  RNFS:
207
+    :path: "../node_modules/react-native-fs"
203 208
   RNGestureHandler:
204 209
     :path: "../node_modules/react-native-gesture-handler"
205 210
   RNGL:
@@ -240,6 +245,7 @@ SPEC CHECKSUMS:
240 245
   React-RCTVibration: 0bea40cd51bd089bd591a8f74c86e91fdf2666c5
241 246
   React-RCTWebSocket: 163873f4cdd5f1058a9483443404fc3801581cb6
242 247
   ReactNativeART: d230fdaf9a6d15d5ec842355ada1edbe326c49d0
248
+  RNFS: a8fbe7060fa49157d819466404794ad9c58e58cf
243 249
   RNGestureHandler: 5329a942fce3d41c68b84c2c2276ce06a696d8b0
244 250
   RNGL: cb1021a8021300492e6413d17700113d0e65cee1
245 251
   RNReanimated: 1b52415c4302f198cb581282a0166690bad62c43

+ 1
- 0
example/package.json View File

@@ -15,6 +15,7 @@
15 15
     "react": "16.8.6",
16 16
     "react-native": "0.60.4",
17 17
     "react-native-canvas": "^0.1.33",
18
+    "react-native-fs": "^2.14.1",
18 19
     "react-native-gesture-handler": "^1.3.0",
19 20
     "react-native-maps": "^0.25.0",
20 21
     "react-native-reanimated": "^1.2.0",

+ 4
- 0
example/src/App.js View File

@@ -15,6 +15,7 @@ import CanvasScreen from './Canvas';
15 15
 import GLReactV2Screen from './GLReactV2';
16 16
 import SVGUriScreen from './SVGUri';
17 17
 import ARTScreen from './ART';
18
+import FSScreen from './FS';
18 19
 import ModalScreen from './Modal';
19 20
 
20 21
 const screens = {
@@ -33,6 +34,9 @@ const screens = {
33 34
   ART: {
34 35
     screen: ARTScreen,
35 36
   },
37
+  FS: {
38
+    screen: FSScreen,
39
+  },
36 40
   Canvas: {
37 41
     screen: CanvasScreen,
38 42
   },

+ 38
- 0
example/src/FS.js View File

@@ -0,0 +1,38 @@
1
+//@flow
2
+import React, { useState, useCallback } from 'react';
3
+import { SafeAreaView, Image, View } from 'react-native';
4
+import ViewShot from 'react-native-view-shot';
5
+import RNFS from 'react-native-fs';
6
+import Desc from './Desc';
7
+
8
+const dimension = { width: 50, height: 50 };
9
+
10
+const FSExample = () => {
11
+  const [source, setSource] = useState(null);
12
+  const onCapture = useCallback(async file => {
13
+    const data = await RNFS.readFile(file, 'base64');
14
+    setSource({ uri: 'data:image/png;base64,' + data });
15
+  }, []);
16
+  return (
17
+    <SafeAreaView>
18
+      <ViewShot onCapture={onCapture} captureMode="mount" style={dimension}>
19
+        <View
20
+          style={{
21
+            ...dimension,
22
+            backgroundColor: 'red',
23
+          }}
24
+        />
25
+      </ViewShot>
26
+
27
+      <Desc desc="FS to get the image from captured file" />
28
+
29
+      <Image source={source} style={dimension} />
30
+    </SafeAreaView>
31
+  );
32
+};
33
+
34
+FSExample.navigationOptions = {
35
+  title: 'react-native-fs',
36
+};
37
+
38
+export default FSExample;

+ 18
- 0
example/yarn.lock View File

@@ -1240,6 +1240,11 @@ balanced-match@^1.0.0:
1240 1240
   resolved "https://registry.yarnpkg.com/balanced-match/-/balanced-match-1.0.0.tgz#89b4d199ab2bee49de164ea02b89ce462d71b767"
1241 1241
   integrity sha1-ibTRmasr7kneFk6gK4nORi1xt2c=
1242 1242
 
1243
+base-64@^0.1.0:
1244
+  version "0.1.0"
1245
+  resolved "https://registry.yarnpkg.com/base-64/-/base-64-0.1.0.tgz#780a99c84e7d600260361511c4877613bf24f6bb"
1246
+  integrity sha1-eAqZyE59YAJgNhURxId2E78k9rs=
1247
+
1243 1248
 base64-js@^1.1.2, base64-js@^1.2.3:
1244 1249
   version "1.3.1"
1245 1250
   resolved "https://registry.yarnpkg.com/base64-js/-/base64-js-1.3.1.tgz#58ece8cb75dd07e71ed08c736abc5fac4dbf8df1"
@@ -4314,6 +4319,14 @@ react-native-canvas@^0.1.33:
4314 4319
   dependencies:
4315 4320
     ctx-polyfill "^1.1.4"
4316 4321
 
4322
+react-native-fs@^2.14.1:
4323
+  version "2.14.1"
4324
+  resolved "https://registry.yarnpkg.com/react-native-fs/-/react-native-fs-2.14.1.tgz#61c70a865b5b5bcb020dd4e4befd60a2c20c836f"
4325
+  integrity sha512-ZcfiwNP+FBgvv2eRk0B62/NI58mbjszjjYvQlP352HLkUqVsK4Ld6X8fdBO1lZAz6SgitUk8WEc9NEciRIt31g==
4326
+  dependencies:
4327
+    base-64 "^0.1.0"
4328
+    utf8 "^2.1.1"
4329
+
4317 4330
 react-native-gesture-handler@^1.3.0:
4318 4331
   version "1.3.0"
4319 4332
   resolved "https://registry.yarnpkg.com/react-native-gesture-handler/-/react-native-gesture-handler-1.3.0.tgz#d0386f565928ccc1849537f03f2e37fd5f6ad43f"
@@ -5365,6 +5378,11 @@ use@^3.1.0:
5365 5378
   resolved "https://registry.yarnpkg.com/use/-/use-3.1.1.tgz#d50c8cac79a19fbc20f2911f56eb973f4e10070f"
5366 5379
   integrity sha512-cwESVXlO3url9YWlFW/TA9cshCEhtu7IKJ/p5soJ/gGpj7vbvFrAY/eIioQ6Dw23KjZhYgiIo8HOs1nQ2vr/oQ==
5367 5380
 
5381
+utf8@^2.1.1:
5382
+  version "2.1.2"
5383
+  resolved "https://registry.yarnpkg.com/utf8/-/utf8-2.1.2.tgz#1fa0d9270e9be850d9b05027f63519bf46457d96"
5384
+  integrity sha1-H6DZJw6b6FDZsFAn9jUZv0ZFfZY=
5385
+
5368 5386
 util-deprecate@~1.0.1:
5369 5387
   version "1.0.2"
5370 5388
   resolved "https://registry.yarnpkg.com/util-deprecate/-/util-deprecate-1.0.2.tgz#450d4dc9fa70de732762fbd2d4a28981419a0ccf"