Skip to content Skip to sidebar Skip to footer
Home / Html / React Native

How To Add Image To Pdf File And Print In React Native Expo

Post a Comment
I want to print a pdf file with an html image embedded on it in react native expo mobile application. And when I tried generating the pdf file, image is not included on the generat

Solution 1:

This is a known problem on iOS for expo, adding a fetchImageData function to convert the image to a Base64 string is the recommended fix

createPDF = async (html) => {...};

fetchImageData = (uri) => { // fetch Base64 string of image dataconst data = awaitFileSystem.readAsStringAsync('file://' + uri, {
  encoding: FileSystem.EncodingType.Base64,
 });
 return imageData = 'data:image/png;base64,' + data;
};

const html = "
<html>
 <body>
  <div class='title-container'>
   <img source=${fetchImageData('asset/omnix.png')} />
  </div>
 </body>
</html>";

If you use fetchImageData to fill all your images they will print correctly

Post a Comment for "How To Add Image To Pdf File And Print In React Native Expo"