Jason
Jason

Reputation: 101

How to print the contents of a screen in react native?

is there a way to print the contents of a screen, that contain images rendered, to a printer in React Native? I looked into react-native-print but it only accepts HTML text whilst react-native-xprinter only supports Android. Thanks.

Upvotes: 6

Views: 6985

Answers (1)

Jason
Jason

Reputation: 101

Managed to make it work. See codes below.

import RNPrint from 'react-native-print';

var htmlString = `<div style="(your CSS style here)"> (HTML contents here) </div>`;

RNPrint.print({html: htmlString});

If you want to embed an image in the HTML, see below:

var htmlString = `<div style="(your CSS style here)"> 
    <img src="data:image/png;base64, ${imgData}" style="width: $imgWidth; height: $imgHeight"/>
</div>`;

You can replace "image/png" with other image type. Hope this helps.

Upvotes: 4

Related Questions