Skip to Content

I came across sap.ndc.BarcodeScanner class. Below function can be used to open iOS device camera to scan the barcode.

	onPress: function(oEvent) {
			sap.ndc.BarcodeScanner.scan(
				function(mResult) {
					alert("We got a bar code\n" +
						"Result: " + mResult.text + "\n" +
						"Format: " + mResult.format + "\n" +
						"Cancelled: " + mResult.cancelled);
				},
				function(Error) {
					alert("Scanning failed: " + Error);
				},
			);
		}

 

Below are few steps to be able to use the iOS device camera by using above function.

  1. Create a new project by using ‘SAPUI5 Application’ template from WebIDE.
  2. Add a button into App.view.xml by using this code.
    <Button text="Scan" press="onPress" icon="sap-icon://bar-code"/>
    
  1. Open App.controller.js and import “sap/ndc/BarcodeScanner”.
  2. Copy above function and paste it into App.controller.js.
  3. Deploy app to SAP Cloud Platform.
  4. Register app to the SAP Fiori Launchpad.
  5. Download SAP Fiori Client app into iOS device from App store.
  6. Copy Fiori Launchpad url and paste it into Fiori Client app.
  7. Open the app and try out the barcode scanning functionality.

In simple words, to use Barcode or QR code functionality, Fiori Launch pad must be running through SAP Fiori Client iOS app instead of an iOS device browser.

For more information please review this: https://sapui5.hana.ondemand.com/#/api/sap.ndc.BarcodeScanner.

 

References:

https://sapui5.hana.ondemand.com/#/api/sap.ndc.BarcodeScanner.

To report this post you need to login first.

12 Comments

You must be Logged on to comment or reply to a post.

  1. Virinchy P

    Hi Mausam,

    Thanks for taking time in writing about the most demand functionality by business and SAP support in this regards.

    Just wanted to add that NDC stands for native device capabilities which is SAP custom developed API to use native device capabilities like barcode directly with the API directly  instead of adding the Cordova plugin explicitly and calling it.

    The additional advantage is that the sap.ndc.barcodescanner.scan api takes care of the check automatically if the app is opened via browser or hybrid app/Fiori client . If opened via browser or barcode scanner not detected,  api opens up a dialog box to enter the value manually . This is an important value added by SAP reducing the validation development effort for our developers.

    Few more examples of sap ndc barcode are available here

    Cheers

    Virinchy

    (0) 
    1. C. Ubkcah

      I think you should add this code directly at the top of your controller:

      jQuery.sap.require("sap.ndc.BarcodeScanner");

       

      (1) 
        1. C. Ubkcah

          I hope you develop in SAP Web IDE. Check if you turned on HAT Plugin:

          Go to SAP Web IDE, select Tools > Preferences > Plugins > Optional Plugins > Hybrid App Toolkit

          (0) 

Leave a Reply