React Native- Resize Image and convert to base64

Question

So I'm using react-native-signature-capture to capture a signature, but I wan't to cut down on the image size before encoding it. I used https://github.com/bamlab/react-native-image-resizer to resize the image, but now I don't know how to convert it to base64. I tried using RN's ImageStore but I get an error with the filepath of the image. See below for the code:

ImageResizer.createResizedImage(encoded.pathName, 200, 100, 'PNG', 80, null, encoded.pathName) .then((resizedImageUrl) => { ImageStore.getBase64ForTag(resizedImageUrl, (data) => { console.log(data); }, (err) => console.log(err)); }) .catch((err) => console.log('failed to resize: ' + err));

Matt Aft · Accepted Answer · 2017-06-21 22:48:36Z

Solved this a while ago and forgot to put what I did until now, I basically used the library above and react-native-fs to resize and retrieve the image as a base64:

handleBase64 = async (path) => { const resizedImageUrl = await ImageResizer.createResizedImage(path, 200, 80, 'PNG', 80, 0, RNFS.DocumentDirectoryPath); const base64 = await RNFS.readFile(resizedImageUrl, 'base64'); return base64; }

J A Gonzalez · Accepted Answer · 2021-08-31 17:10:04Z

Matt Aft solution still works, though maybe the ImageResizer lib has changed since then. What worked for me was a slight alteration of his answer, since createResizedImage now returns an object:

handleBase64 = async (path) => { const resizedImage = await ImageResizer.createResizedImage(path, 200, 80, 'PNG', 80, 0, RNFS.DocumentDirectoryPath); const base64 = await RNFS.readFile(resizedImage.uri, 'base64'); return base64; }

Collectives™ on Stack Overflow

React Native- Resize Image and convert to base64

2 Answers 2

Comments

Comments

Hot Network Questions

Collectives™ on Stack Overflow

2 Answers 2

Comments

Comments

Related