Access Mobile API in Odoo 16

With the introduction of the amazing mobile app in Odoo 10.0, customers now have direct access to all the software’s apps, including customized modules. The app delivers a unified user experience by smoothly combining Odoo Web and Native Mobile components. In this post, we’ll look at how you can use JavaScript to access native mobile features like the camera, vibration, notification, toast, and more from within Odoo Web by utilizing the Mobile API.

A web page contained in a mobile native web container.

Container. However, it’s nicely integrated, allowing you to use JavaScript to access native resources. In this integration, a Bridge layer serves as a bridge between the native mobile components and Odoo Web (JS).

When a call is initiated from JavaScript, the request travels through the Bridge before being forwarded to the proper native invoker. You receive the output in JavaScript after the native component has finished its duty and given the result back to the Bridge. Processing times may differ depending on the Native resources requested; for example, accessing the camera or GPS location may need more time.

Utilizing the Mobile API

You can utilize the Mobile API offered by the web_mobile.rpm object to communicate with these native mobile components. The API provides a list of methods that can only be used in the mobile app. Let’s examine some of the fundamental techniques and how to use them.

1. Display toast on the gadget

A Toast is a straightforward and unobtrusive popup that offers commentary on a procedure. It merely takes up the area necessary for the message to be displayed, allowing the user to continue using the existing application while the Toast is visible.

mobile.methods.showToast({'message': 'Message sent'});

2. Vibrating Instrument

Using this technique, you can set the time in milliseconds for which the mobile device vibrates.

mobile.methods.vibrate({'duration': 100});

3. Display the Snackbar in Motion

A Snackbar, which displays a brief message at the bottom of the screen (or lower left corner on bigger devices), is a quick way to give feedback. The Snackbar can additionally have an action button.

mobile. methods.showSnackBar({'message': 'Message is deleted'

 'btn_text': 'Undo'}).then(function(result){

    if(result){

        // Do undo operation

    }else{

        // Snack Bar dismissed

    }

});

4. Displaying Alerts

Using this technique, you can show a system-controlled notification outside of the default user interface of your program. You can customize the notification’s message and title.

mobile.showNotification({'title': 'Simple Notification', 'message': 

'This is a test for a simple notification'})

5. Add a Contact to Your Device

Using this technique, you can make a new device contact with specific information like a name, cell number, phone number, email address, etc.

var contact = {

    'name': 'Michel Fletcher',

    'mobile': '9999999999',

    // Other contact details...

}

mobile.methods.addContact(contact);

6. Barcode scanning

This technique provides on-device real-time barcode identification and supports a number of different formats, including EAN-13, QR Code, Data Matrix, and more.

mobile.methods.scanBarcode().then(function(code){

    if(code){

        // Perform operation with the scanned code

    }

});

7. Account Switching on a Device

To switch between different accounts on the device, use switchAccount().

mobile. methods.switch account();

With JavaScript access to native resources, Odoo’s mobile app allows seamless integration of Odoo Web and Native Mobile components. You can quickly add features like Toasts, Vibrations, Notifications, and Barcode Scanning to your Odoo applications to improve the mobile user experience by utilizing the Mobile API. Try out these mobile native components if you’re using Odoo Enterprise 10.0 or later to advance your Odoo app.