How to store the screenshot? about react-native-view-shot HOT 14 CLOSED

from react-native-view-shot.

It seems to be working for me. I made these changes to App.js in your example:

$ diff -u App.orig.js App.js
--- App.orig.js 2017-02-28 22:50:03.000000000 -0800
+++ App.js      2017-02-28 22:46:36.000000000 -0800
@@ -12,7 +12,11 @@

 } from "react-native";
 import omit from "lodash/omit";
-import { takeSnapshot } from "react-native-view-shot";
+
+import { takeSnapshot, dirs } from "react-native-view-shot";
+
+// cross platform dirs:
+const { CacheDir, DocumentDir, MainBundleDir, MovieDir, MusicDir, PictureDir } = dirs;

 import Btn from "./Btn";

@@ -33,16 +37,20 @@
   };

   snapshot = refname => () =>
-    takeSnapshot(this.refs[refname], this.state.value)
-    .then(res =>
-      this.state.value.result !== "file"
-      ? res
-      : new Promise((success, failure) =>
-      // just a test to ensure res can be used in Image.getSize
-      Image.getSize(
-        res,
-        (width, height) => (console.log(res,width,height), success(res)),
-        failure)))
+    takeSnapshot(this.refs[refname], {
+        ...this.state.value,
+        path: dirs.PictureDir+ '/hi.jpg'
+    })
+    .then(res => {
+      console.log("Image saved to", res);
+
+      return this.state.value.result !== "file" ? res : new Promise((success, failure) =>
+          // just a test to ensure res can be used in Image.getSize
+          Image.getSize(
+            res,
+            (width, height) => (console.log(res,width,height), success(res)),
+            failure));
+    })
     .then(res => this.setState({
       error: null,
       res,

Then checked in the console output:

from react-native-view-shot.

from react-native-view-shot.

you can look at RNFS is the current answer. maybe it should be in the lib as it seems to be a common requested feature, even though I would prefer to keep the lib simple.
I accept PRs

from react-native-view-shot.

By the way, it looks like RNFS is getting deprecated:

itinance/react-native-fs#228

from react-native-view-shot.

I guess we might reconsider making this a built-in feature then. user should be able to tell where he wants the image to be. one problem I see is if we use an absolute path, it will be platform dependent. I'm not sure if RN have a solution to abstract that yet. (actually I wish basic op like moving a file would be available in RN)

from react-native-view-shot.

we could start with a basic boolean, but I'm sure people will then ask that they want the screenshot to go in a specific folder / photo album for instance.

from react-native-view-shot.

I have implemented something in branch dirs.
it works but what's weird (to me) is when I set path: dirs.PictureDir+"/foobar2.png" , on iOS it ends up being a folder under the app directory but not the user picture dir..mmh. and I'm not seeing it in the Photos app. same happen for Android.
not sure what's wrong

from react-native-view-shot.

I don't see any obvious issues. I might have time this evening to try and run it if you don't figure it out.

from react-native-view-shot.

yeah, it works, but can you see the picture when you browse the Photos app then? Because I can't.
Maybe I'm expecting it would but it's not supposed to show up there?

It seems to store it inside the /data/Containers/Data/Application/*/Pictures but I would expect it would store it more in like next to the camera roll / in an album. But maybe i'm just mistaken. it looks like iOS also have a UIImageWriteToSavedPhotosAlbum also.

(The initial request of this issue was "store to camera roll / gallery".)

from react-native-view-shot.

or like http://stackoverflow.com/questions/4457904/iphone-how-do-i-get-the-file-path-of-an-image-saved-with-uiimagewritetosavedpho/4458451#4458451

from react-native-view-shot.

I think you are right and I'll consider this to be out of scope of the library (if you need to save in cameraroll / album, use a lib that do that)

I'll just merge my branch that allows to save the captured image to an absolute path (e.g. to the app's namespace folders like Document or Pictures) – you can then still retrieve it to save it somewhere else with a native module / another lib.

from react-native-view-shot.

you can try this: https://developer.android.com/reference/android/content/Intent.html#ACTION_MEDIA_SCANNER_SCAN_FILE

from react-native-view-shot.

hlo friends i am working on my college project , please help me i want to take a screen shot of specific part of screen like card part and then store the screen shot to image folder of project please help me .

from react-native-view-shot.