Found a lot of examples for QR code scanner functionality but couldn't find any that are about displaying QR Code. Not sure how this can be done as nativesript is using specific xml based controls. Seems you can't build UI with something different than these. How to solve this problem. Also I want the visualisation of the QR code to be working in offline mode. Thanks!
2
-
I have not used this plugin but it has the ability to create QR codes npmjs.com/package/nativescript-zxing. It looks pretty straightforward, by creating an Image that you can then display as you would any other Image.JoshSommer– JoshSommer2018-01-15 20:45:08 +00:00Commented Jan 15, 2018 at 20:45
-
@LyubomirVelchev If my answer solved your question please mark it as accepted. :)David Artmann– David Artmann2018-02-21 18:53:37 +00:00Commented Feb 21, 2018 at 18:53
Add a comment
|
1 Answer
An example of how to display a QR code using @NathanaelA 's nativescript-plugin (nativescript-zxing) mentioned in the comment above:
import * as imgSource from "tns-core-modules/image-source";
const ZXing = require('nativescript-zxing');
const zx = new ZXing();
const barcode = zx.createBarcode({encode: "Text", height: 100, width: 100, format: ZXing.QR_CODE});
Return value barcode is either an android.graphics.Bitmap if running on Android or an UIImage if running on iOS.
img.imageSource = imgSource.fromNativeSource(barcode);
Use the native image instance appropriately. Here img is an nativescript Image widget and imgSource is the nativescript class ImageSource. You set the imageSource attribute of the Image widget with the result of fromNativeSource method offered by the ImageSource instance.
Generally, you can mostly find examples of how to use a plugin in the demo folder of their repository.
Kind regards,
David
