alterno logo 2021-02

Launching SAP UI5 app from mobile home screen

Project managers often want to know what is the best way to launch a SAP UI5 application from a mobile device.
Mobile browser? SAP Fiori Client? Hybrid wrapped App?
Well the answer to this question is inconclusive and depends on many factors such as which is the target users population, MDM involvement, information security policy, etc.

This post describes an alternative approach –
Run your UI5 application from your mobile home screen as a fullscreen webapp.

in this way you still use the mobile browser but the user won’t feel it since the application launches by default in full screen mode which supplies a hybrid-like experience out of the box.

Launching a fullscreen web page when the user navigates to it is not possible. Browser vendors are very aware that a fullscreen experience on every page load is a huge annoyance, therefore a user gesture is required to enter fullscreen.

BUT, Vendors do allow users to “install” (not really installing, only in intention like) web apps on their home screen though, and the act of “installing” is a signal to the operating system that the user wants to launch as an full screen app on the platform.

This approach is pretty easy to implement using meta tags as follows:
1. add two meta tags in the header of your application, one for iOS and one for Chrome for Android.
<meta name=”apple-mobile-web-app-capable” content=”yes”>
<meta name=”mobile-web-app-capable” content=”yes”>
2. Enter your SAP UI5 app using a browser
3. Open the menu dropdown and choose ‘Add to home screen’
4. Run your UI5 app from the home screen web app shortcut that was created in the previous step
5. Enjoy your full screen SAP UI5 web app hybrid-like experience 🙂

P.S.
There are more advanced features to this approach, suchas make it open in landscape by default and more. So leave a comment below or PM me for further assistance with this.

Meanwhile try it with our site (which also build with UI5 btw), open it from your mobile browser device and add it to your home screen:
http://alterno.io


App is now launched as full screen mobile UI5 app-

Any questions?

Just write us a message!

Fill out the form and we will be in touch as soon as possible!