In this blog, I am describing to implement USB Printer in react native Application. it is the toughest task to implement printer in our Application. I have learned many libraries and found a library “react-native-usb-printer” that supports for Android Platform. It is very easy to use. It detects all connected USB Printer to our device if we got All Printer select one of them as a default Printer.
How to install it?
Installation-
|
1 |
npm install react-native-usb-printer --save |
Integrate Module-
To integrate react-native-usb-printer with the rest of your react app just execute:
|
1 |
react-native link react-native-usb-printer |
How to use?
Import-Module-
|
1 |
import { RNUSBPrinter } from 'react-native-usb-printer'; |
Find Printer Devices & Connect one of them-
|
1 2 3 4 5 6 7 8 9 |
let devices = await RNUSBPrinter.getUSBDeviceList(); console.log("Devices", devices); if (devices && devices.length > 0) { let printedSelected = await RNUSBPrinter.connectPrinter( devices[0].vendor_id, devices[0].product_id ); } |
Generate Text for printing-
We have to Note that it print only text String that encodes in “encoding: ‘GBK’ ” System. It Provides it’s own format to print our text. There are following some formatted TAG that supports by this library.
- “<M> … </M>” – for Medium text.
- <CM> … </CM> – center align and Medium text.
- <C> …</C> – center alignment.
- <B> …</B> for bold text.
- many more tag.
Printing Text via Connected Printer-
By this library, we print our page by two types-
- Print Without Cut Page- By this type, we print our many texts in a single Page.
1RNUSBPrinter.printText('Hello') - Print With Cut Page – By this type, We print our text String on the page and then cut this page. Real life example- Printing Invoice for separate users
1RNUSBPrinter.printBillTextWithCut("<C>Hello</C>")
Printing Page Image-
Resources:-
https://www.npmjs.com/package/react-native-usb-printer
https://github.com/bondwp/react-native-usb-printer