Technology Blogs by SAP
Learn how to extend and personalize SAP applications. Follow the SAP technology blog for insights into SAP BTP, ABAP, SAP Analytics Cloud, SAP HANA, and more.
cancel
Showing results for 
Search instead for 
Did you mean: 
fvettore64
Advisor
Advisor
The hardware of modern mobile devices contains sensors able to collect many environment and device related information. Between those information, we can find:

  • GPS positioning

  • Atmospheric pressure

  • Magnetic field values

  • Acceleration values

  • Angular velocities


Those information can be used for implementing mobile applications that require to track the position, or to deliver specific information about the speed, the compass heading, the acceleration. As an example, I want to mention the most used apps of this kind: the navigation apps that we're using all the days when driving or hiking. Those apps typically uses GPS positioning and compass heading for providing directions on maps. Some more advanced apps are able to provide additional information that are very useful for trekking activities: for instance altitude and barometric pressure for supporting weather forecast.

SAP Build Apps makes very easy to access all those information from the apps you're developing,  allowing you to crete your own navigation or weather forecasting app.

In this article I'll explain how information collected from mobile device sensor's can be read and used within SAP Build Apps.

First of all, let's see what are the information that can be accessed: at present SAP Build Apps provides an out-of-the-box support for:

  • GPS location, including latitude, longitude, altitude, speed, heading, accuracy

  • Compass heading

  • Magnetic field values on the three axis: x, y, z

  • Acceleration values on the three axis: x, y, z

  • Angular velocities on the three axis: x, y, z

  • Atmospheric pressure


Inside SAP Build Apps, those information are saved into a dedicated set of variables (the sensorVars) that can be accessed from you applications just using formula bindings.

For instance, some of the GPS positioning information are available in the following variables:

  • sensorVars.geolocation.latestValue.latitude

  • sensorVars.geolocation.latestValue.longitude

  • sensorVars.geolocation.latestValue.altitude


A detailed documentation about the sensor variables and the sensor functions can be found on the official documentation.

The content of sensorVars variables is not automatically updated: when you need to use the sensor's data, you must invoke a function that asks the mobile device to read from the sensor. After doing that, the function makes available the required information into the sensorVars variables.

There are two ways for updating the sensorVars variables: the single read, when you just need to collect a single value from a sensor and the continuous polling, when you need to receive continuously and in real-time the updated values. In the latter case, you can also keep the story of the last read values, deciding how many values you want to keep.

Let's explore together the sensor's reading capabilities of SAP Build Apps, implementing a real app that you can run on you mobile phone.

First of all, we need to create a new mobile app from the Lobby.

In this app we want to just to read once the GPS positioning data and to display them in the home page. Let's remove the default text lines and let's add a button, named "Get GPS Position":


 

As usual, we add the logic associated to the button, in this case just dragging and dropping the GPS location component:


After launching the app, every time the button is clicked, the GPS related sensorVars are updated.

Let's display the collected information: we need to add to our application some Text components for displaying the GPS information, available in the sensorVars after clicking the button. A Text component for displaying the latitude can be added to canvas and bound to the following function:
"GPS Latitude: " + sensorVars.geolocation.latestValue.latitude

And we can add two additional text components for Longitude and Altitude:
"GPS Longitude: " +  sensorVars.geolocation.latestValue.longitude

"GPS Altitude: " + sensorVars.geolocation.latestValue.altitude

Please notice that the GPS Location component outputs to Port 1 the collected GPS information. If you need to use them in another component that follows, you can do it just binding to the result of the GPS Location component, without the need of accessing the sensorVars thru a formula.

Now we can test the application on our mobile device: we need to install to our device the SAP Build App, available on the Play Store and Apple Store and then we can open the LAUNCH section from you SAP Build Apps environment, click on Preview your app, generate a PIN code from the SAP Build App application on mobile device and typing the code under the Preview on your device section.

After doing that, we can start the preview of the app on your mobile device and, after clicking the button, we can read the GPS positioning information on our home page:


 

This is a good starting point, but probably the most interesting scenario is when we want to use sensor's information that are updated in real time. For implementing that capabilities, we need to install additional components from the Marketplace. The required components can be found just searching for "polling" in the Marketplace:


For the demo app I'd like to implement, we need to install the Start polling and Stop polling components for GPS, compass and barometer.

After creating a new app and installing those components, we add to the canvas two buttons: Start polling and Stop Polling. 

The logic for the Start polling button can be defined dragging and dropping all the installed Start polling components into the canvas, linking them to the Component tap event:


Please notice that each Start polling component has some properties that can be configured in the panel on right hand side of the screen. In particular, we can define the frequency of the update and the size of the history. Depending on the sensor, some other configurable properties may be available. For the purpose of this explanation, we can keep the default values.

The logic for the Stop polling button is very similar: we just need to use the Stop polling components instead of the Start ones.

And now we can add to you app some Text components for displaying the sensor's information, as we did before. We can use the same formulas as before for the GPS location info. For the compass heading we need to add a Text component and bind it to the formula:
"Compass heaading: " + ROUND(sensorVars.compass.latestValue.heading)

And for the atmospheric pressure:
"Barometer pressure: " + sensorVars.barometer.latestValue.pressure + " mbar"

 

Our app is ready to be tested: we can start the preview on your mobile device, as described before.

As soon as we start the app, we can see that the Text components cannot show any information. But when we click the Start polling button, they begins showing the expected information and those information are updated dynamically: just moving around, pointing the device to different directions and rising and lowering it, makes the displayed information to change in real time.

 


 

And when we click the Stop polling button,  the information stops updating.

With these simple examples, I demonstrated how mobile device sensor's information can be requested once or continuously and how the related measures can be read from the sensorVars using in your application a formula binding.

Now that you've learnt the basic aspects of sensor's information access, you can explore all the available features and then you can start implementing applications that use sensor's information to deliver an advanced user experience.

And that’s all for today!  Now you can continue to follow the SAP Build Apps environment Topic page (https://community.sap.com/topics/build-apps), post and answer questions (https://answers.sap.com/tags/6cfd8176-04ae-4548-8f38-158456e1a47a), and read other posts on the topic (https://blogs.sap.com/tags/6cfd8176-04ae-4548-8f38-158456e1a47a/).

 

Have a good time with SAP Build Apps! And please continue following my profile for new blogs and let me have your feedbacks.

 
9 Comments
Jacques-Antoine
Active Participant
0 Kudos
Very nice example fvettore64 to play with the sensors! So easy to do moreover.

Thank you for this nice training material!
ranjit_daniel
Participant
0 Kudos
Thanks fvettore64 for this. How can I use the GPS data from the device to display a map and put a pin on that location?

Please advise.

Thanks

Ranjit
fvettore64
Advisor
Advisor

You can use the WebView component and open it, passing the URL of a map service (Google Maps, OpenStreetMaps), that includes the coordinates you've read from the mobile device. As an example, you can read your GPS position, assign the values to a couple of PageVars named Latitude and Longitude (changing them to a text with the STRING function ) and then you can use OpenStreet Maps and invoke the URL using a page variable calculated with a formula:

URL("https://www.openstreetmap.org/?mlat=" + pageVars.Latitude + "&mlon=" + pageVars.Longitude + "#map=12/" + pageVars.Latitude + "/" + pageVars.Longitude)

When running this on a mobile phone, a maps is displayed with a pin in your location. You can do the same with Google Maps.

 

 

ranjit_daniel
Participant
0 Kudos
Thanks so much fvettore64 I tried as per your instructions and I think I have got it to work. I just wanted to run the configuration past you to see if I have got it right and this is what you meant.

Created two page variables


Added Webview component to the canvas

Added the logic for the component


Logic of the Webview component



Set variable name and assigned value for the two 'Set Page variable' flow functions.


 


Set WebView URL as per your instruction


Please advise. Thanks again.

Ranjit
fvettore64
Advisor
Advisor
0 Kudos

The logic for building the URL is correct. Please consider that, when you set the Latitude and Longitude page variables, instead of using the sensor vars, you can just use the latitude and longitude as provided as output from the GPS Position node.

What do you expect from your application ? A real time update of the map when the position changes or when you tap on the component ? In this case I'm not sure this approach can work, because the WebView component is rendered at the beginning when the home page and it is not refreshed any more. It can be used to show a location with a pin, but not for a real time updating map.

 

ranjit_daniel
Participant
0 Kudos
Hi fvettore64 - Thanks for all your help.

When I try to use them from the GPS node it does not allow me to select them as shown below. Is this because they are of 'number' type and should be a string. How do I convert them to string?

The application needs to show a location with a pin when the page loads and that seems to work fine.

 


 

Thanks

Ranjit
fvettore64
Advisor
Advisor
0 Kudos
You should use the STRING function to convert into a text that can be used to compose the URL.
ranjit_daniel
Participant
0 Kudos
Hi fvettore64 This is my first time doing this so I'm not too sure how/where to use the STRING function. Please could you explain.

Also if I wanted to use google maps service for the Webview component URL, what URL should I be using? Is there any documentation for it?

Please advise.

Thanks a lot

Ranjit
fvettore64
Advisor
Advisor
The value of the Latitude page vars can be set to: STRING(outputs["GPS location"].value.latitude)

Concerning the URL of Google maps, you can just find it by yourself opening Maps from a web browser, pointing at a location without streets and looking how the address has changed in the address box of the browser.